uGUIでレイアウトを行う - Unityのチュートリアル

このレッスンでは、uGUI の レイアウトについて解説します。 現在はプロジェクトが作られていて Canvas Scaler は このような設定になっています。 ここではパネルがあり 左上にロゴとタイトルが あるようなものを作りたいので イメージを作成しましょう。 パネルは画面いっぱいに 余白を取ってレイアウトされる ようにしたいので広げます。 この時 Windows であれば ドラッグしながら Alt を押すと 対称に広がります。 Mac であれば option を押してください。 続いてロゴを作ります。 簡易的にイメージで作ります。 イメージですが 通常は画像を表示するものですが 特に設定、Sprite がない場合は その下の Color が そのまま表示されます。 ここではサイズを 60×60 にして 左上にレイアウトします。 そしてタイトル、 今度はテキストで作ります。 ［Text］の内容を［Title］と変えて ［Font Size］を 30 にします。 この時にレクトが テキストより小さいと 消えてしまう設定になっているので ここではサイズは合わせて 表示されるようにしてください。 そしてロゴの横に持っていきます。 ではこれでレイアウトができたように 見えるんですが 現在［Canvas Scaler］のほうで バッチのほうが Width で設定されていますので 横幅については合っている感じですが 縦が小さくなります。 そして高さ、こちらが小さくなると 消えてしまうので これではパネルとして うまく配置できていません。 ではパネルの設定を きちんと合わせましょう。 ［Rect Transform］左上に レイアウトのボタンがあります。 これはどこからレイアウトするか ということです。 このどこからというのは 親要素になります。 ここではキャンバスですね。 キャンバスのレクトに対して 左上から、真ん中から、右下から 高さをストレッチするか 横幅をストレッチするか どの位置でストレッチするか という設定になります。 ここでは全体的に広げたいので 右下の横幅も高さも ストレッチする設定にしました。 そうすると表記が ［Left］［Top］ ［Right］［Bottom］になるので これは余白を表します。 ここでは０にすると ぴったり合うんですが 50…