ボタンを配置しよう
次はボタンのUIを配置します。 ゲームを始めるスタートのボタンを配置してみたいと思います。
Buttonは下記のどれかの方法で追加する事ができるようになっています。
- メインメニューから、
GameObject > UI > Button
- ヒエラルキーウィンドウから、
Create > UI > Button
- 右クリックから、
UI > Button
配置されたボタンは入れ子でボタン要素の中にテキスト要素が入った状態になっています。
またボタン要素は、ImageとButtonの2つのコンポーネントがアタッチされています。
インスペクタウィンドウを見ると、ボタンのコンポーネントに関していくつか設定に変更が加えられるようになっています。
ボタンには下記のように4つの状態がありますが、それぞれに各個のデザインを当てる事が可能となっています。
名前 | 状態 |
---|---|
Normal | 通常 |
Highlighted | マウスが乗った時やボタンが選択されている時 |
Pressed | ボタンが押された時 |
Normal | ボタンが使えない時 |
Transrationのプルダウンを変更する事で、デザインの適用方法を変更する事ができます。 それぞれ次のようになっていて状況によって使い分けます。
名前 | 状態 |
---|---|
None | 何も変えない |
Color Tint | 色の違いで変化をつけたい場合 |
Sprite Swap | 画像を変えて変化をつけたい場合 |
Animation | Animatorを使用してボタン効果をつけたい場合 |
ボタンの色やテキスト、画像などを変更して、好きなデザインのボタンを作成しましょう。
NavigationのプルダウンはキーボードによるUIのフォーカスを切り替える設定を変更します。
名前 | 状態 |
---|---|
None | キーボードで変更しない |
Horizontal | 水平方向 |
Vertical | 垂直方向 |
Automatic | 自動で指定する |
ボタン用のスクリプトを書こう
作成したボタンは、簡単にC#にイベントを渡す事ができるようになっています。
まずはボタンを押した際のスクリプトを作成します。
ここではいくつかのアクションを実行したいので、ButtonActions
という名前のクラスを作成します。
public class ButtonActions : MonoBehaviour
{
public void OnClickStart()
{
print("スタートボタンが押された!");
}
}
ボタン用のスクリプトを動かそう
最後にボタンが押されたタイミングでOnClickStart()
が呼び出されるようにします。
まず、スクリプトはヒエラルキーウィンドウ上のどこかのオブジェクトにアタッチされていないと動かないので、任意のオブジェクトにアタッチします。 プロジェクトウィンドウにスクリプトを作っただけでは動かないので注意しましょう。
また、適当にアタッチすると後から探すのが大変になるので、適切なオブジェクトがステージ上に無い場合には空のゲームオブジェクトScripts
を作成して、そこにアタッチしたりします。
次に、ボタンにイベントとしてこのScripts
オブジェクトのButtonActions
コンポーネントのOnClickStart
イベントを登録します。
やり方はボタンを選択し、インスペクタウィンドウの下の方にあるOn Click
という枠の中からプラスボタンを押して、クリックに新しいアクションを作成します。
プラスボタンを押すとOn Click
の枠内にオブジェクトの登録UIが現れるので、ここに先ほどのScripts
オブジェクトを設定します。
すると右側のプルダウンにScripts
オブジェクトにアタッチされているコンポーネントと、そこに登録されているパブリックな関数が選ばれるようになるので、さきほど記述したOnClickStart
イベントを呼ぶようにします。
再生してみよう
最後に再生してボタンを押し、コンソールに文字が正しく出力されるか見てみましょう。 下記のどちらかでゲームが再生されます。
- ツールバーの
再生ボタン
- ショートカット
Cmnd
+P
- ボタンイベントには引数として文字列を持たせてみよう
- タイトルテキストにボタンイベントを持たせてみよう