【コピペでUnity】これさえ知ればButtonの実装は怖くない!

Unity
Unity

ボタンを実装したい人

とりあえずButtonっていうヤツを使えばいいんだっけ。
あれ、画面とか切り替える関数はどこで設定するんだ?
Buttonのインスペクタを見ても関数がなかったりする、どうしよう…。

こういった疑問に答えます。

 

本記事の内容

●Buttonサンプルコード
●UnityでのButtonの設定手順
●ButtonのOn Click ()の仕組み解説
●Buttonの動作をスクリプトで実装するには

 

この記事を書いている私は12才からフルスクラッチでゲームを作っています。
またコンパイラを専門として情報理工学の博士まで進学、中退をしており、プログラミング言語の文法にも関わる論文を書いていました。

 

本記事ではコピペで使える実行済みのコードと設定方法を紹介しつつ、サンプルから発展させた実践的な実装方法もご説明します。

※実行環境
Unity2021.3.1f1
Windows 10

 

Buttonサンプルコード

サンプルコードは以下の通りです。

見ての通り特段複雑な記述ではないことが分かるかと思います。
よってつまづきやすいところは実は、後述の設定にあるかと思います。

 

Receiverスクリプト

using UnityEngine;

public class Receiver : MonoBehaviour {
    private int _z = 5;

    public void OnButtonUp() {
        //オブジェクトを回転させる
        transform.eulerAngles = transform.eulerAngles + new Vector3(0, 0, _z);
    }
}

 

Senderスクリプト

using UnityEngine;
using UnityEngine.UI;

public class Sender : MonoBehaviour {
    private Button _button;

    //GUIでReceiverをアタッチしたオブジェクトを設定出来るようにする
    [SerializeField]
    private Receiver _receiver;

    void Start() {
        //ButtonオブジェクトからButtonコンポーネントを取得
        _button = GetComponent<Button>();

        //OnButtonUp関数をonClickに登録
        _button.onClick.AddListener(_receiver.OnButtonUp);
    }
}

 

●_z
z軸中心の回転角度
今回は整数で設定

●_button
Buttonインスタンス
Unityのスクリプトでは、コンポーネントは変数に保存して使用する

●_receiver
Receiverインスタンス
Unityのインスペクタでは使用したいコンポーネントそのものではなく、使用したいコンポーネントを追加したゲームオブジェクトを登録することで設定できる

 

UnityでのButtonの設定手順

Buttonの仕組みはかなり単純なのですが、いかんせんUnityでは操作が複雑なため見通しがよくないと感じています。
単純化すると以下の3ステップなので、細かい操作以前にまずはこれらを意識することをオススメします。

①ButtonのUIを用意する
②Buttonの操作対象を用意する
③Buttonで操作が出来るようにする

 

ButtonのUIを用意する

1.「Hierarchy」ウィンドウの余白で「右クリック > UI > Legacy > Button」
2.「Scene」ビュー右上のボタンから、2Dビューに切り替える
3.「Scene」ビュー内を「ホイールクリック」や「Alt+右クリック」で縮小する

 

4.「Inspector」ウィンドウでButtonの「Rect Transform」を下図のように設定

 

Buttonの操作対象を用意する

1.「Hierarchy」ウィンドウの余白で「右クリック > 3D Object > Cube」(※非常に小さいですが作れています)
2.「Inspector」ウィンドウでCubeの「Transform」を下図のように設定

 

3.「Project」ウィンドウで「Assets」ディレクトリを選択
4.余白で「右クリック > Create > C#スクリプト」
5.名前を「Receiver」に変更
6.サンプルコードをコピーペーストして保存

 

6.「Hierarchy」ウィンドウで追加した「Cube」をクリック
7.「Inspector」ウィンドウ最下部の「Add Component」ボタンをクリック
8.「receiver」と入力すると先ほど作った「Receiver」が出てくるのでクリック

 

Buttonで操作が出来るようにする

1.「Hierarchy」ウィンドウで追加した「Button」をクリック
2.「Inspector」ウインドウの「Button」コンポーネント、「On Click ()」の「+」をクリック

 

3.「On Click ()」の「None (Object)」に「Hierarchy」の「Cube」をドラッグアンドドロップ
4.「On Click ()」の「No Function」で「クリック > Receiver > OnButtonUp」

 

以上によりボタンをクリックすると、立方体が回転するようになりました。
「+」ボタンの場所が時々分からなくなるのでお気を付けください。

 

ButtonのOn Click ()の仕組み解説

On Click ()に登録できる関数

On Click ()では、Buttonのクリックが離された場合に実行する関数を登録できます。
Inputクラスなどの他の入力関数とは違い、「Up」に相当する判定しか発生しないので気を付けてください。
参考:【コピペでUnity】このスクリプト1つだけでクリック実装は完了!ホイールクリックも楽勝

 

また登録する関数は何でもいいワケではありません、下記の条件を満たさないとOn Click()に表示されないことがあります。

●public修飾子が付いていること
●返り値はvoidであること
●引数が1つであること

 

ちなみに引数の型にも制約があり、引数がdouble型だと表示されなくなったりするため注意ください。

 

Buttonコンポーネントのオプション

設定の手順では「On Click ()」の「Runtime Only」に触れませんでしたが、これはUnityEventに関する設定項目です。
動作は下記の通りです。

Off 動作しない
Editor And Runtime エディタでの編集中と実行中に動作する
Runtime Only 実行中のみ動作する

 

大事なことなので2回言いますが、このパラメータはあくまでもUnityEventの制御であってButtonの制御ではありません。
従って設定の変更が意味をなさない状況も出てきます。

例えば今回のOn Click ()で「Editor And Runtime」を設定しても、クリックのUnityEventは拾われないため立方体が回転することはありません。
スライダーなど値の変更にまつわるUnityEventであれば効果があるので試してみてはいかがでしょうか。

 

Buttonの動作をスクリプトで実装するには

On Click ()をスクリプトで設定する

ここまでGUIベースでのButtonの設定を見てきましたが、最初にも書いた通り操作が非常に複雑です。
基本的にUnityではGUIを使うと、オブジェクト間のやり取りの設定は手数が多くなると考えていいと思います。

そこで今回はスクリプトで「On Click ()」を設定するパターンも覚えておきましょう。
こちらを試すのはUnityでのスクリプト制作に十分慣れてからでよいです。

 

Buttonを操作するコンポーネントを作る

1.「Project」ウィンドウで「Assets」ディレクトリを選択
2.「Project」ウィンドウの余白で「右クリック > Create > C#スクリプト」
3.名前を「Sender」に変更
4.サンプルコードをコピーペーストして保存

 

On Click ()の設定を置き換える

1.「Hierarchy」ウィンドウで「Button」をクリック
2.「Inspector」ウインドウの「Button」コンポーネント、「On Click ()」の「-」をクリック

 

3.「Inspector」ウィンドウ最下部の「Add Component」ボタンをクリック
4.「sender」と入力すると先ほど作った「Sender」が出てくるのでクリック

 

5.「Receiver」の「None (Receiver)」に「Hierarchy」の「Cube」をドラッグアンドドロップ

 

以上で「On Click ()」で設定した時と同じ動作をします。
くり返しになりますが、初めのうちはどう作るかよりも以下の3ステップを意識することを優先しましょう。

①ButtonのUIを用意する
②Buttonの操作対象を用意する
③Buttonで操作が出来るようにする

 

実はスクリプトで設定した方が出来ることが増える

この実装方法のメリットは、

●OnClick()に設定している関数をGUIではなくスクリプトで書き換えられる
●GUIの設定では扱えなかった引数の関数を設定できる

です。

特に2つ目のメリットは単純に実装の選択肢が増えるため、かなり大きいと思います。
C#の文法であるdelegateがもとになっているので、余裕のある方は掘り下げてみるのもよいでしょう。

 

もちろんこの手の実装はラムダ式でなされているコードをよく見かけますがラムダ式で問題はなく、むしろ実装として分かりやすい場合さえあるでしょう。

今回はButtonの基本的な仕組みをご理解いただくため、出来る限り単純なコードをご用意した次第です。

 

以上です。

Unityはいいぞ。

コメント

タイトルとURLをコピーしました