UnityでDialog Boxを表示する(2)


はじめに

 「UnityでDialog Boxを表示する(1)」では、メッセージを表示するだけのDialog Boxを作成しました。アプリケーションがメッセージを簡単に表示できる、表示・非表示のタイミングを制御できる、といったメリットがありましたが、WindowsではOKボタンやYes・Noボタンが付いていて、ボタンを押すとDialog Boxが消えるという動作が一般的です。そこで今回は、このOKボタンが付いたDialog Box(Dialog Box OK)を紹介させて頂きます。

デザイン

 前回のDialog BoxにOKボタンを追加しただけです。メッセージが表示された後、OKボタンを押すとDialog Boxが消えます。

図1.Dialog Box OKデザイン

Hierarchy 

 このDialog Boxの表示のためのUnity Hierarchyを以下のようにしました。

図2.Dialog Box OK Hierarchy

 図2のPanelMessageButton以下がOKボタンの付いたDialog Box OKです。ボタンが追加されただけです。その他の注意点は前回と同じです。

スクリプト

 以下は、このDialog Box OKのスクリプトです。前回と大きく違う点があります。メソッドはShow()だけで、Hide()は無くなりました。これは、ボタンを押すことで自信を消すため、外部からHide()されないためです。また、Show()メソッドはIEnumerator型ですので、呼び出しにはStartCoroutine()を使って非同期処理とします。そうしないと、Unityがロックしてしまいます。非同期処理に関しては別の機会で説明します。





using UnityEngine;
using UnityEngine.UI;
using TMPro;
using System.Collections;

public class DialogBoxOKScript : MonoBehaviour
{
    [SerializeField] TextMeshProUGUI _messageText;
    [SerializeField] Button _okButton;
    private bool _isButtonPressed = false ;

    //===================================================================================================
    /// <summary>
    /// ダイアログボックスの表示。IEnumerator型のメソッドなのでStartCoroutine()で呼び出してください。
    /// </summary>
    /// <param name="message">ダイアログボックスに表示したいメッセージの内容</param>
    /// <param name="error">メッセージの文字色を決める。false=デフォルト(白)、true=赤(強調したいとき)/param>
    public IEnumerator Show(string message, bool error = false)
    {
        _isButtonPressed = false;

        if (error) _messageText.color = Color.red;
        else _messageText.color = Color.white;
        _messageText.text = message;
        gameObject.SetActive(true);

        _okButton.onClick.RemoveAllListeners();
        _okButton.onClick.AddListener(() =>
        {
            _isButtonPressed = true;
            gameObject.SetActive(false);
        });

        yield return new WaitUntil(() => _isButtonPressed);
    }
}

動作確認

 非同期処理が分からなくても、上記Show()メソッドを以下の様に呼び出してください。まずは動作することが肝心です。

private void ShowDialogBox2()
{
    Debug.Log("button2");
    StartCoroutine(_dialog.Show("ボタン付きダイアログボックス", true));
}

 図3が動作結果です。OKボタンを押すとDialog Boxが消えます。

図3.Dialog Box OK、表示結果


コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

PAGE TOP