【Unity】Buttonの使い方完全ガイド｜スクリプト制御・OnClick・Interactable・EventTriger対応｜Wamutai Tech

使用環境

・Unity Editor：2021.3.18f1

この記事でわかること

UnityのButton（ボタン）の基本的な使い方
スクリプトでのボタン操作（有効化・無効化・イベント登録）
EventSystem・EventTriggerを使った応用操作（マウスオーバー・長押し・ドラッグ）
ボタンに関するよくあるエラーとその対処法

Buttonとは？

ピッグダディ

今回は、UnityでButtonを使う方法を解説していくよ！

ピッグボーイ

ButtonってUnityでよく出てくるけど、
結局なにができるのか全然わからないや…

ピッグガール

インスペクターでの設定は簡単なんだけど、
EventTriggerとかスクリプトでの制御になると急に難しくなるんだよねぇ

ピッグダディ

大丈夫！基礎から応用までわかりやすく説明するから安心してね。
イベント設定、動的制御、よくあるエラーまで全部紹介していくよ！

UnityのButtonの使い方

Buttonの追加方法

[Hierarchy]→[右クリック]→[UI] → [Button – TextMeshPro]を選択
シーン内にButton（ボタン）が追加される

Buttonの構成要素

Image→ Buttonの見た目（背景画像）
Button→ Buttonのクリックイベント
TextMeshPro(子オブジェクト) → Button上のテキスト

OnClickの設定（動的＆静的）

Inspectorで設定（静的）

まずはこのスクリプトを作成しておこう！

using UnityEngine;

public class ButtonExample : MonoBehaviour
{
    public void StartGame()
    {
        Debug.Log("ゲーム開始！");
    }
}

次に以下の手順でスクリプトをGameObjectのClickイベントにアタッチしよう！
※先にスクリプトを適当なGameObjectにアタッチしておいてください。

HierarchyのButtonを選択
Inspectorの[On Click()] の「+」ボタンを押します
スクリプトを持つHierarchyのGameObjectをドラッグ＆ドロップ
実行する関数を選択(例: StartGame())

スクリプトのAddListenerで設定（動的）

以下のようにスクリプトを組むことでStart時にOnClickイベントにOnButtonClick関数が登録されます。
※myButtonにはButtonオブジェクトをInspectorでアタッチしておく必要がある

using UnityEngine;
using UnityEngine.UI;

public class ButtonController : MonoBehaviour
{
    public Button myButton;

    void Start()
    {
        myButton.onClick.AddListener(OnButtonClick);
    }

    void OnButtonClick()
    {
        Debug.Log("ボタンが押された！");
    }
}

Buttonのinteractableの設定（有効化・無効化）

InspectorでButtonのinteractableの設定（静的）

Buttonの有効化、無効化をInspectorで行う場合、「Interactable」にチェックを入れると有効化、チェックを外すと無効化されます。
※ 無効化とはクリックしても反応がなくなるという意味です。

スクリプトでButtonのinteractableの設定（動的）

以下のようにして有効化、無効化はスクリプトで行えます。

Button.interactable = true //有効化
Button.interactable = false //無効化

EventSystemとEventTriggerの活用

EventSystemとは？

EventSystemはUnityの入力イベントを管理するシステムで、
ボタンをクリックするだけでなく、マウスオーバー・キーボード・長押しなどのイベントも処理できます。

Unity UIが正常に動作するためには、必ずシーン内にEventSystemが必要です！
もしもボタンがクリックできない場合は、EventSystemが存在するか確認しよう。

EventTriggerを使ったボタンの拡張

EventTriggerを使うと、ボタンの挙動をさらに細かく制御できます。
例えば、マウスオーバー・長押し・サイクルの判定など。

EventTriggerの追加方法（Inspector）

HierarchyのButtonを選択
[Add Component] → [Event Trigger]を追加
[Add New Event Type]でイベントを追加
スクリプトの関数を設定する

EventTrigger の実装例（スクリプト）

①マウスオーバー（ポインタ入力 / ポインタ終了）

➡ボタンにカーソルを乗せた時・離れた時の処理を追加できる！

using UnityEngine;
using UnityEngine.EventSystems;

public class ButtonExample : MonoBehaviour, IPointerEnterHandler, IPointerExitHandler
{
    public void OnPointerEnter(PointerEventData eventData)
    {
        Debug.Log("ボタンにマウスが乗った！");
    }

    public void OnPointerExit(PointerEventData eventData)
    {
        Debug.Log("ボタンからマウスが離れた！");
    }
}

② 長押し（PointerDown / PointerUp）

➡長押しの開始・キャンセルを判定できる！

using UnityEngine;
using UnityEngine.EventSystems;

public class ButtonLongPress : MonoBehaviour, IPointerDownHandler, IPointerUpHandler
{
    private bool isPressed = false;

    public void OnPointerDown(PointerEventData eventData)
    {
        isPressed = true;
        Debug.Log("ボタン長押し開始");
    }

    public void OnPointerUp(PointerEventData eventData)
    {
        isPressed = false;
        Debug.Log("ボタン長押し解除");
    }
}

③ ドラッグ

➡ボタンをかけて移動できる！

using UnityEngine;
using UnityEngine.EventSystems;

public class ButtonDrag : MonoBehaviour, IDragHandler
{
    public void OnDrag(PointerEventData eventData)
    {
        transform.position = Input.mousePosition;
    }
}

よくあるエラーと解決策

ボタンがクリックできない

　・EventSystemが存在するか確認

　・Canvasのレンダリングモードを「Screen Space – Overlay」にする

EventTriggerが反応しない

　・EventTrigger のコンポーネントを正しく追加できているか確認

　・インターフェースを正しく実装しているかチェック（IPointerEnterHandler など）

まとめ

UnityのButtonは、クリックイベントを設定するだけでなく、EventTriggerを活用すれば高度なUI制御も可能です。

・基本的なクリックイベントは Inspector から設定可能
・スクリプトでボタンの有効化・有効化・テキスト変更ができる
・ EventSystem はボタンの動作に必須！
・ EventTrigger を使えば、マウスオーバー・長押し・段階操作も実行可能

※ TextMeshPro、Image、チェックボタンはこちらを参考にしてください。

Button

【Unity】Buttonの使い方完全ガイド｜スクリプト制御・OnClick・Interactable・EventTriger対応