Unity/レイアウトのソースを表示

==縦にコンテンツを並べる==
#ヒエラルキーからCreate/UI/Panelを作成する
#PanelのInspectorを開き、AddComponentでVerticalLayoutGroupを追加
#ControlChildSizeのWidthとHeightにチェックを入れる
#ChildForceExpandのWIdthとHeightにチェックを入れる
#Panelの中にImageなどを複数追加すると、Panel一杯に縦に均等に並ぶ

==横にコンテンツを並べる==
#ヒエラルキーからCreate/UI/Panelを作成する
#PanelのInspectorを開き、AddComponentでHorizontalLayoutGroupを追加
#ControlChildSizeのWidthとHeightにチェックを入れる
#ChildForceExpandのWIdthとHeightにチェックを入れる
#Panelの中にImageなどを複数追加すると、Panel一杯に横に均等に並ぶ

縦幅が高くなる場合は、ChildForceExpandのHeightのチェックを外す

==タイル状にコンテンツを並べる==
#ヒエラルキーからCreate/UI/Panelを作成する
#PanelのInspectorを開き、AddComponentでGridLayoutGroupを追加
#ControlChildSizeのWidthとHeightにチェックを入れる
#ChildForceExpandのWIdthとHeightにチェックを入れる
#Panelの中にImageなどを複数追加すると、タイル状に並ぶ

==縦に上からコンテンツを並べる==
#ヒエラルキーからCreate/UI/Panelを作成する
#PanelのInspectorを開き、AddComponentでVerticalLayoutGroupを追加
#ControlChildSizeのWidthとHeightにチェックを入れる
#ChildForceExpandのWidthだけにチェックを入れる
#Panelの中にImageなどを複数追加し、追加したImageのInspectorのAddCompnentにLayoutElementを追加する
#追加したImageなどのLayoutElenmentのMinHeightにチェックを入れ100とする

一部コンテンツのLayoutElenmentのFlexibleHeightに、チェックを入れ、値を1とすると、そのコンテンツが余白を埋めて拡大される。

==コンテンツをフィットさせたコンテンツを並べる場合==
===縦に上からコンテンツを並べるの例===
#ヒエラルキーからCreate/UI/Panelを作成する
#PanelのInspectorを開き、AddComponentでVerticalLayoutGroupを追加
#ControlChildSizeのWidthとHeightにチェックを入れる
#ChildForceExpandのWidthだけにチェックを入れる
#Panelの中にTextなどを複数追加し、
#ContentSizeFitterでVerticalFitをPreferredSizeにし、LayoutElementのMinHeightにチェックを入れ0で、設定する

参考：https://albatrus.com/entry/2021/03/06/162141

===横並びで、左からコンテンツを並べるの例===
#ヒエラルキーからCreate/UI/Panelを作成する
#PanelのInspectorを開き、AddComponentでHorizontalLayoutGroupを追加
#ControlChildSizeのHeightだけチェックを入れる・Widthは外す
#ChildForceExpandは両方チェックを外す
#Panelの中にTextなどを複数追加し、
#ContentSizeFitterでHorizontalFitをPreferredSizeにし、LayoutElementのMinWidthにチェックを入れ0で、設定する

参考：https://tsubakit1.hateblo.jp/entry/2017/06/15/020309

==縦幅を指定する==
LayoutElementのPreferredHeightにチェックして数値を入れると、その縦幅になる。

その縦幅にならない場合は、親オブジェクの~LayoutGroupのChildForceExpandのHeightのチェックを外す。

参考：https://taidanahibi.com/unity/auto-layout/

==UIアンカーで上下フィットさせる==
ImageなどについてるRectTreansformの左側に表示されているUIアンカーから上下stratchを選択すれば、上下にfitするUIが作れる

==ContentSizeFitterを追加したRectの縦幅/横幅を取得==
なにもしないと、表示処理が、1フレーム遅いのか？わからないが、こちらのタイミングで、ContentSizeFitterを効かせたい場合は、以下のように処理する。
<pre>
ContentSizeFitter contentSizeFitter = obj.GetComponent<ContentSizeFitter>();
contentSizeFitter.SetLayoutHorizontal();
contentSizeFitter.SetLayoutVertical();
</pre>

参考：https://www.snoopopo.com/entry/2023/10/01/125516

==LayoutGroupのControlChildSizeの意味==
ControlChildSizeのHeightにチェックをいれると、その下にImageがあった場合、そのImageのHeightが自動計算になる。逆に、チェックを外すとImageのHeightに数値をいれることができるようになる。