uGUIに関して学び直しておこうと思い、公式リファレンスを読んでみた際のメモ記事です。
Unityを普段から触ってらっしゃる方には当たり前の情報ばかりかもしれませんが、、
- スクリプトからUIパーツの重ね順を変える
- RenderMode
- Visual Componentについて
- Interaction Components
- Auto Layoutについて
- Event Systemについて
読んだリファレンスはこちら
スクリプトからUIパーツの重ね順を変える
uGUIの各パーツはHierarchyに配置された順番(上から順番)に重ねて描画されていきます。
この重ね順をスクリプトから修正したい場合は下記のメソッドが利用できます。
- SetAsFirstSibling
- SetAsLastSibling
- SetSiblingIndex
RenderMode
Screen Space - Overlay
UIパーツを画面の最も前面に表示するモード。スクリーンサイズが変わると自動的にCanvasサイズも調整される。
Screen Space - Camera
Overlayと似てはいるが、このモードの場合はCanvasはカメラから指定の距離に離れた場所に設置される。そしてカメラの影響を受けるため、FOVなどを変更するとUIもそれに伴って変化させることができる。Canvasサイズはスクリーンサイズの変更や、カメラの視錐台が変化に追従して調整される。
World Space
他の3Dオブジェクトと同様にCanvasのサイズを任意に調整して配置することができ、何かのオブジェクトの後ろに隠れたり、前で隠したりすることもできる。いわゆるdiegetic interfaceとして使える。
Visual Componentについて
ImageType
Imageコンポーネントの設定項目にあるImageTypeについてそれぞれの説明。
Simple
Sprite全体を均等にスケーリングする
Sliced
SpriteEditorで3x3に分割したスプライトの中心部分のみをスケーリングする
Tiled
Slicedと似ているが、中央部分を引き伸ばしてスケーリングするのではなく、タイリング(繰り返して使う)する
Filled
表示はSimpleと変わらないが、一方向に向けてSpriteの表示領域を変更できる
Interaction Components
ボタンとかさまざまなインタラクションを受け取ることができるUIパーツで、基本的にはVisual Elementsとともに使われる。
Selectableを継承しており、それにより状態遷移を管理しつつ、Normal,highlighted, Pressed, Disabledなどに応じた表示の切り替え、UIパーツ間のNavigationの設定などが可能になっている。
Buttonのアニメーション遷移
Button(Selectable)の状態に合わせてアニメーションを再生するようなAnimatorを作成する場合、雛形を自動で作成する機能が備わっている。
Auto Layoutについて
Layout ElementsとLayout Controllers
Auto LayoutはLayout ElementsとLayout Controllersのふたつの概念から構成されている。
Layout ElementsはRect Transformを持っており、Layout Controllersによって、適切なサイズが割り当てられる。
Layout Elementsには定義された下記のサイズに関する情報が存在する。
- Minumum width
- Minimum height
- Preferred width
- Preferred height
- Flexible width
- Flexible height
これらの値はLayout Elementコンポーネントを使用することで上書きすることができる。
そして、Layout Controllersは
- Minumum sizeを割り当てる
- 十分なスペースがある場合にPreferred sizeを割り当てる
- さらに余分なスペースがある場合にFlexible Sizeを割り当てる
この順番でLayout Elementsのサイズを決定していく。
Layout Controllersについて
Content Size Filter
このコンポーネントがついているGame Object自身のサイズを調整する働きを持つ。 例えばTextコンポーネントにつけて、width/heightをPreferredに設定すると、テキストの文字量に応じてサイズを自動で調整するようになる。
Aspect Ratio Fitter
高さに合わせて横幅を、もしくはその逆を考慮してサイズを調整してくれる。このコンポーネントはLayout Information(minumim sizeやpreferred size)を考慮しない。
Layout Groups
Horizontal Layout GroupやVertical Layout Groupのような、子要素のサイズと位置を調整するLayout Controllersのこと。
Layout Groupsは自分自身のサイズを調整はしないため、他のLayout Controllersと併用するか、ユーザでサイズを設定する必要がある。
自作Layout Controllers
Auto Layoutシステムはビルトインのいくつかの機能によって実現されているが、指定のインタフェースを実装したコンポーネントを作成することで自作のLayout Controllerを作成することも可能。
Layout Elementとして扱われるComponentを作成する場合はILayoutElementを実装する。
子要素のLayout Elementのサイズを調整するComponentを作成する場合はILayoutGroupを実装する。
自分自身のサイズを調整するComponentを作成する場合はILayoutSelfControllerを実装する。
Layout Calculations
Auto layoutがどのようにサイズを計算していくかの順番を説明する。
Minimum, Preferred, Flexibleの各種widthはILayoutElementのCalculateLayoutInputHorizontalを呼び出すことで取得できる。そしてこれはボトムアップで行われる。なぜなら、親要素のサイズ決定には子要素のLayoutElementsのサイズ情報が必要であるから。
そして有効なWidthを割り当てるために、トップダウンでILayoutControllerのSetLayoutHorizontalが呼び出される。トップダウンで行う理由は、子要素は親要素の有効な横幅を知らないといけないからである。この処理が終了すると、全てのLayout Elementsは有効なwidthをRect Transformにセットされた状態になる。
Miniumum, Preferred, Flexibleの各種heightはILayoutElementのCalculateLayoutInputVerticalを呼び出すことで取得できる。これもwidthと同様にボトムアップで行われる。
手順2と同様にILayoutControllerのSetLayoutVerticalをトップダウンで呼び出し、各Layout Elementsのheightを設定していく。
この手順からもわかる通り、Width→Heightの順でAuto Layoutはサイズを決定していくため、HeightがWidthに影響を受けることはあるが、その逆はない。
Rebuildのタイミング
現在のLayoutが有効でない状態になったタイミングで、Layoutの再計算が実行される。
これはLayoutRebuilder.MarkLayoutForRebuildを呼び出すことで、発火することができる。
LayoutのRebuildは即座には実行されず、現在のフレームの終了タイミングで、レンダリングが実行される直前に走る。理由としては、LayoutのRebuildを即座に走らせると、同一フレーム内で何度もRebuildが走る可能性があり、これはパフォーマンスの低下につながるからである。
Event Systemについて
EventSystemはキーボード、マウス、タッチなどのインプットに基づいて、GameObjectにEventを送信する機能を持ったコンポーネントである。
Event Systemはいくつかの他のコンポーネントとともに動作することでイベントの送信を実現している。
EventSystemの主な役割は下記の通りである。
- どのGameObjectが選択されているかを判断する
- どのInput Moduleが使用されているかを判断する
- Raycastingの管理(必要なら)
- Input Moduleの更新
Input Modulesについて
Event Systemがどのように振る舞うかを決めるメインロジックであり、これらは下記の用途で利用される。
- Inputのハンドリング
- Event Stateの管理
- Objectにイベントを送信する
同時に一つのInput Moduleのみがアクティブになれて、EventSystemと同じGameObjectにアタッチされていないといけない。