【NGUI】スライスの設定して画像を引き延ばす

  • |
【NGUI】スライスの設定して画像を引き延ばす
   

UIに限らず画像のサイズはできるだけ最小に抑える必要があります。
メモリーの節約もあるし、アプリ容量の削減にもなります。
今回紹介するNGUIのスライス機能を使えば、最小限の画像データで大きなUI画像を作成することができます。

スライス Sliced

「NGUI Sprite」をアタッチすると、以下のようなコンポーネントが作成されます。
今回の引き伸ばしを実装したい場合にはTypeを「Sliced」に合わせてください。
Slice

次に使用する画像を選択します。
そして、画像の右側にある「Edit」ボタンを押します。
Sliced2

そうすると、テクスチャアトラスの設定画面が出てきます。
ここで、どのように画像を引き延ばすかを調整できます。
下記赤い枠の数字を調整します。
Sliced3

各線の内側が引き伸ばされる領域になります。
Sliced4  1

こうすれば、実際の画像は以下のようになります。
Sliced5  1

この画像Slicedを使わなければ、このような感じです。
Sliced6  1

最後に

このように画像を工夫すれば、小さい画像データから適切なUIを作ることができます。
この辺りは画像を作成するときに、同引き伸ばしをすればいいのかを予め考えて作る必要があるのですが、実際の効果は大きいのでぜひ利用をしてみましょう。

Unity5ゲーム開発レシピ ハマるゲーム制作のノウハウUnity5ゲーム開発レシピ ハマるゲーム制作のノウハウ
BATA,まつだす

翔泳社 2016-01-23
売り上げランキング : 162732

Amazonで詳しく見る

Related Posts Plugin for WordPress, Blogger...