ボタンを配置しよう

この章のキャプチャは従来のText子要素のボタンを例にしていますが、現在はText - TextMeshProを子に持つボタンの使用を推奨します。ボタン本体（ButtonコンポーネントやImage）は同じで、入れ子になっているテキスト要素がTextからTextMeshProに変わるだけです。手順や設定はそのまま読み替えて問題ありません。

次はボタンのUIを配置します。 ゲームを始めるスタートのボタンを配置してみたいと思います。

Buttonは下記のどれかの方法で追加する事ができるようになっています（TextMeshPro版のプリセットを推奨）。

• メインメニューから、GameObject > UI > Button - TextMeshPro
• ヒエラルキーウィンドウから、Create > UI > Button - TextMeshPro
• 右クリックから、UI > Button - TextMeshPro

配置されたボタンは入れ子構造になっており、ボタン要素の中にテキスト要素が入っています。TextMeshPro を使う場合は、このテキスト要素がText - TextMeshProになります。

またボタン要素は、ImageとButtonの2つのコンポーネントがアタッチされています。

インスペクタウィンドウを見ると、ボタンのコンポーネントに関していくつか設定に変更が加えられるようになっています。

ボタンには下記のように4つの状態がありますが、それぞれに各個のデザインを当てる事が可能となっています。

Transitionのプルダウンを変更する事で、デザインの適用方法を変更する事ができます。 それぞれ次のようになっていて状況によって使い分けます。

ボタンの色やテキスト、画像などを変更して、好きなデザインのボタンを作成しましょう。

NavigationのプルダウンはキーボードによるUIのフォーカスを切り替える設定を変更します。

ボタン用のスクリプトを書こう

作成したボタンは、簡単にC#にイベントを渡す事ができるようになっています。

まずはボタンを押した際のスクリプトを作成します。 ここではいくつかのアクションを実行したいので、ButtonActionsという名前のクラスを作成します。

public class ButtonActions : MonoBehaviour
{
	public void OnClickStart()
	{
		print("スタートボタンが押された！");
	}
}

ボタン用のスクリプトを動かそう

最後にボタンが押されたタイミングでOnClickStart()が呼び出されるようにします。

まず、スクリプトはヒエラルキーウィンドウ上のどこかのオブジェクトにアタッチされていないと動かないので、任意のオブジェクトにアタッチします。 プロジェクトウィンドウにスクリプトを作っただけでは動かないので注意しましょう。

また、適当にアタッチすると後から探すのが大変になるので、適切なオブジェクトがステージ上に無い場合には空のゲームオブジェクトScriptsを作成して、そこにアタッチしたりします。

次に、ボタンにイベントとしてこのScriptsオブジェクトのButtonActionsコンポーネントのOnClickStartイベントを登録します。

やり方はボタンを選択し、インスペクタウィンドウの下の方にあるOn Clickという枠の中からプラスボタンを押して、クリックに新しいアクションを作成します。

プラスボタンを押すとOn Clickの枠内にオブジェクトの登録UIが現れるので、ここに先ほどのScriptsオブジェクトを設定します。

すると右側のプルダウンにScriptsオブジェクトにアタッチされているコンポーネントと、そこに登録されているパブリックな関数が選ばれるようになるので、さきほど記述したOnClickStartイベントを呼ぶようにします。

再生してみよう

最後に再生してボタンを押し、コンソールに文字が正しく出力されるか見てみましょう。 下記のどちらかでゲームが再生されます。

• ツールバーの再生ボタン
• ショートカット Cmd+P

• ボタンイベントには引数として文字列を持たせてみよう
• タイトルテキストにボタンイベントを持たせてみよう