【unity入門】よくわかるButtonの使い方-Buttonの理解をグッと深めよう!
![](https://mogi0506.com/wp-content/uploads/2019/04/plush-design-studio-734766-unsplash-1024x768.jpg)
こんにちは、もぎです。
ボタンを押したらゲームを開始するなど、ゲーム制作においてボタンを押した時の処理というのは非常に重要な要素です。
この記事ではそんなボタンの使い方についてまとめてみました。
この記事の目次
基本的なButtonの使い方
ボタンを作成
まずはボタンを作成していきましょう。
ボタンを作成するには、
Hierarchyビューから、Create > UI > Buttonで作成できます。
![](https://mogi0506.com/wp-content/uploads/2019/04/スクリーンショット-0031-04-17-14.42.25.png)
作成するとこのような感じになります。
![](https://mogi0506.com/wp-content/uploads/2019/04/スクリーンショット-0031-04-17-14.45.02.png)
クリックした時の処理
スクリプトを作成
まずはクリックした時の処理を記述するスクリプトを作成しましょう。
ProjectビューからCreate > C# Scriptで作成できます
![](https://mogi0506.com/wp-content/uploads/2019/04/スクリーンショット-0031-04-17-14.50.40.png)
作成できると下記のようになります。
![](https://mogi0506.com/wp-content/uploads/2019/04/スクリーンショット-0031-04-17-14.51.45.png)
ボタンにスクリプトを追加
次に作成したスクリプトをボタンに追加しましょう。
やり方は、スクリプトをボタンにドラッグ&ドロップです。
![](https://mogi0506.com/wp-content/uploads/2019/04/スクリーンショット-0031-04-17-15.13.14.png)
ドラッグ&ドロップするとこのように追加されます。
![](https://mogi0506.com/wp-content/uploads/2019/04/スクリーンショット-0031-04-17-15.13.37.png)
処理を記述
スクリプトにボタンをクリックしたら赤くする処理を記述していきましょう。
スクリプトを記述するにはスクリプトをダブルクリックしてください。
![](https://mogi0506.com/wp-content/uploads/2019/04/スクリーンショット-0031-04-17-15.19.08.png)
ボタンを押したらログ出力
ボタンを押したらログ出力するには、
関数を作成し、その中にボタンを押した時の処理を記述していきます。
今回であれば、ログ出力の記述ですね。
全体のサンプルコードは
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
public class NewBehaviourScript : MonoBehaviour {
// Use this for initialization
void Start () {
}
// Update is called once per frame
void Update () {
}
//ボタンを押した時の処理
public void Click()
{
//ログ出力
Debug.Log("押したよ!");
}
}
On Clickに関数を設定
スクリプトの中でボタンを押したらログ出力するClickという関数を作りました。
ボタンのOn Clickに関数を設定してボタンを押したら関数Clickが呼ばれるようにしましょう。
やり方は、まずOn Clickのプラスボタンを押し、
![](https://mogi0506.com/wp-content/uploads/2019/04/スクリーンショット-0031-04-17-20.16.59.png)
Buttonオブジェクトをドラッグ&ドロップして設定します。
![](https://mogi0506.com/wp-content/uploads/2019/04/スクリーンショット-0031-04-17-20.19.04.png)
設定したらNo Functionを押し、
![](https://mogi0506.com/wp-content/uploads/2019/04/スクリーンショット-0031-04-17-20.21.41.png)
自分で作成したスクリプト名>Click()を選択します。
![](https://mogi0506.com/wp-content/uploads/2019/04/スクリーンショット-0031-04-17-20.24.31.png)
設定すると下記の画像のようになります。
![](https://mogi0506.com/wp-content/uploads/2019/04/スクリーンショット-0031-04-17-20.27.12.png)
これでボタンを押した時にログ出力するようになりました。
実行結果は、
![](https://mogi0506.com/wp-content/uploads/2019/04/名称未設定.mov-26.gif)
一度だけ押せるButtonの作り方(interactableを使う)
![](https://mogi0506.com/wp-content/uploads/2019/04/名称未設定.mov-25.gif)
ボタンを一度押したら、もう押せなくボタンを作ることができます。
詳しい作り方はこちらの記事をどうぞ『interactableを使った!一度だけ押せるButtonの作り方』
onclickに引数を用いたButtonの作り方
![](https://mogi0506.com/wp-content/uploads/2019/04/名称未設定.mov-27.gif)
onclickには引数を用いることができます。
作り方は引数を用いて関数を作り、
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
public class NewBehaviourScript : MonoBehaviour {
// Use this for initialization
void Start () {
}
// Update is called once per frame
void Update () {
}
//ボタンを押した時の処理
public void Click(int x)
{
//引数をログ出力
Debug.Log(x);
}
}
inspectorから引数を設定するだけです。
![](https://mogi0506.com/wp-content/uploads/2019/04/スクリーンショット-0031-04-18-20.33.54.png)
実行結果は、
![](https://mogi0506.com/wp-content/uploads/2019/04/名称未設定.mov-27.gif)
まとめ
この記事ではButtonの使い方について扱ってきました。
この記事を読んでボタンについての理解が少しでも深まったのなら幸いです!