Unity事例ノート

UNITY

テキストのレイアウト

UIテキストの表示について、少しだけ勉強していきましょう。

今回は2Dゲームで制作します。

テキストをつくる

まずはテキストを作成。

ヒエラルキー→作成→UI→テキスト。

自動でCanvasというオブジェクトができ、その中にTextが作られます。

今後つくるテキストはすべて、このCanvasに入ることになるので、ぜひ覚えておきましょう。

ちょっとわかりにくいですが、ゲームビューにはこのようにNewTextと表示されています。

場合によって、このテキストは左下に表示されたりすることもあります。

しかし、シーンビューに表示されていないんですね。

カメラをズームアウトしていくと、一応こんな風にテキストエリアが出てきます。

ちょっと違和感ありですが、2Dゲームの場合、テキストはゲームビューを見ながら調整しましょう。

カラーとフォント種類

さて今度はカラー変更。

色のところを白に変えました。

テキストの中身をGameOverに変えます。

続いて、フォントの種類を変えましょう。

通常フォントはArialになっています。

これを変えるには、事前にフォントのデータが必要なんですね。

Fontsというフォルダを作り、今回はCourierPrimeBoldというフォントデータを入れました。

データを入れるのはドラッグアンドドロップで。

これでCourierPrimeBoldを選べるようになります。

サイズと配置

さらにフォントのサイズを拡大します。

ここでたとえばフォントサイズを50にすると、突然テキストが消えてしまうんですね。

小さいと表示されるのが、大きくすると消えてしまう。

問題はテキストボックスのサイズなのですが、とりあえずの解決として、オーバーフローを触ります。

水平オーバーフロー、垂直オーバーフローの両方にチェック。

これでテキストがきちんと表示されたと思います。

ちなみにこの問題は、文字サイズに対してテキストエリアが小さすぎることが原因です。

矩形トランスフォームの幅160、高さ30。

このサイズがテキストに対して小さすぎるということなので、このサイズを大きくしてあげても、きちんとテキスト表示されます。

さて、今度はテキストを画面中央にします。

矩形トランスフォームの、アンカープリセットをクリック。

Altキーを押しながら、真ん中のピボットをクリックしましょう。

テキストエリアが真ん中にレイアウトされます。

しかし、ちょっとテキストがずれているんですね。

これはテキストエリアの中で左詰めになっているからです。

整列のところ、左右を真ん中に、上下を真ん中にしましょう。

これで無事、中央にレイアウトされました。

SCHOOL教室案内