ナインスライス
作成日
更新日
画像(特にUI用の枠やパネルなど)を 3x3の9つの領域 に分割し、それぞれの領域ごとに異なるスケーリングルールを適用することで、柔軟にサイズ変更ができる仕組み。
こんなふうに画像を分割する。
+---+-------+---+
| 1 | 2 | 3 |
+---+-------+---+
| 4 | 5 | 6 |
+---+-------+---+
| 7 | 8 | 9 |
+---+-------+---+
- 1, 3, 7, 9(四隅)はそのままのサイズで描画される(スケーリングなし)
- 2, 4, 6, 8(辺)は片方向にスケーリング
- 5(中央)は縦横両方向にスケーリング
この分割によって、画像の角のデザイン(丸みや影)を崩さずに、中央部分を伸縮してUIを柔軟に表示可能になる。

公開日
更新日