UI変更の基本


宴2.0以降、UIは全てUnity4.6からのUnity標準UI機能(俗称uGUI)を使って作成されています。UIの変更もuGUIの基本操作どおりに作ってもらえれば大丈夫ですが、uGUIの操作全部となると把握するのが大変なので、宴で必要になる使い方を簡単にまとめました。

UIのテクスチャをインポートする

UI用のテクスチャインポート先は、自分の好きなフォルダを使ってかまいません。デフォルトのUIテクスチャは、「宴プロジェクト名/Textures/SpriteUI」以下にありますので、ここに置いてもかまいません。

テクスチャのインポート設定はこのようにします。Sprite(2D and UI)でさえあれば、どんな設定でもかまわないのですが、PackingTagなどの設定を統一したほうがアプリサイズの削減や実行速度の高速化になるので、なるべくデフォルトのインポート設定と同じにしたほうが良いでしょう。PackingTagの名前などがわからなかったら、他のデフォルトUIのインポート設定からコピーしてください。

必要であればBorderの設定をして、SliceやTiled設定を使えるようにしてください。これは、丸角などエッジ部分の大きさを変えずにUIの大きさを変えるためのものです。UIではこの設定をしておくと、テクスチャサイズを抑えたまま色々なサイズのUIを作れるので、ぜひ使ってみてください。

UIのテクスチャを変更する

各UIオブジェクトが持つ、Imageコンポーネントにある「Source Image」が表示するテクスチャの設定です。ここに新たなテクスチャを設定すればテクスチャの変更が可能です。
ちなみに、「宴プロジェクト名/Textures/SpriteUI」以下にあるデフォルトで使用するテクスチャも、宴パッケージからは独立して作成されているため、これを直接変更しても宴の更新と衝突したりする心配はありません。

UIのサイズや位置を変更する

UIのサイズや位置変更は、シーンビュー上で行うと直感的に操作できます。ただし、あらかじめシーンビュー上で2D用の設定をするようにしてください。
インスペクターから値を変更しても良いのですが、アンカーが「Stretch」設定になっている場合は少しややこしいですので、下図を参考にStretch設定されているUIのサイズなどを調整してみてください。

ss_129


バックログや選択肢、セーブウィンドウのUIを変更する

バックログやセーブウィンドウなど、「同じものをたくさん作るUI」は、Unityのプレハブという仕組みを使っています。ヒエラルキー上で青文字になっているのが目印です。シーンビュー内のUIを変更するだけではなく、Applyボタンでプレハブに変更を反映する必要があります。


プログラムで変更される画像など

オートセーブのアイコンなどはプログラムから設定されるので、少し扱いが難しいかもしれません。
基本的には関連するオブジェクトやプレハブのインスペクターから設定ができるようになっています。