ボタンや画像を自動で等間隔に整列する方法【Unityゲーム制作】

今回は、ボタンや画像などのオブジェクトを等間隔に自動で並べる方法のメモです。

ボタンを均等に配置

Unityではボタンや画像などの場所をマウスで移動したり、座標を入力して位置指定もできますが、簡単にきれいに並べることが出来るのでそれをやっていきます。

ボタンを配置(縦並び)

まずは適当にボタンを追加します。ボタンじゃなくて画像とかでもOK

とりあえず適当に3つほど作ります。位置の座標を入力して調整、3つが縦に並ぶように配置していますが、バラバラでももちろんOK。

下図のように並べたいボタンは同じグループ内に入れておきます。ボタンの配置範囲を分かりやすくするために、黒色で背景を設定。

背景(ボタングループの親)にコンポーネントを追加します。まずは縦並びにするので「垂直レイアウト」を選択。

整列を「MiddleCenter」にして真ん中整列にします。均等に並びます。

ここにさらにボタンを追加していきます。すると等間隔に自動で整列していきます。

ボタン配置(横並び)

次は横並び。「水平レイアウトグループ」を選択。

同じようにいくつか複製したり、サイズを変えたりしています。ここで、範囲からはみ出すようにあえて多く複製しています。

「子のサイズを制御」にチェックを入れると幅内に収まるようにボタンのサイズが自動で調整されます。

背景のオブジェクト(ボタンの親)を動かすと、ボタンごとごっそり動きます。こんな感じにゲーム画面の上にボタンを配置したいときとか便利。

実際のゲーム画面はこんな感じに。

ボタン配置(縦横並び)

縦横で並べたい場合は「グリッドレイアウトグループ」。ボタンじゃなくても問題ないので、プレハブ(Prefab)にしてみたり。

パティングや間隔で隙間を調整。画面の右端にこんな感じで配置するのも簡単。

今回は例としてボタンだけど、画像とかでも同じように可能。等間隔に整列させる場合、ある程度グループにしておくと後で並べ替えたりとかが簡単ですな。

タイトルとURLをコピーしました