トグルを使って条件付き UI を作成する

この例では、トグルを使って条件付き UI を作成します。

例の概要

この例では 2 つのトグルを持つカスタムエディターウィンドウを作成しています。トグルを使って以下のことがで可能です。

ラベルの表示/非表示
ボタンの有効化/無効化

この例で作成するすべてのファイルは、GitHub リポジトリにあります。

例の作成

サンプルを作成するには以下を行います。

任意のテンプレートで Unity プロジェクトを作成します。
Project ウィンドウに、Editor という名前のフォルダーを作成します。

Editor フォルダーに、以下のコンテンツを含む ToggleExample という C# ファイルを作成します。

using UnityEngine;
using UnityEditor;
using UnityEngine.UIElements;
namespace Samples.Editor.Controls
{
    public class ToggleExample : EditorWindow
    {
        private Toggle showToggle;
        private Toggle activateToggle;
        private Label labelToShow;
        private Button buttonToActivate;
        [MenuItem("Window/ToggleExample")]
        public static void OpenWindow()
        {
            var window = GetWindow<ToggleExample>("Controls: Toggle Sample");
            window.minSize = new Vector2(200, 170);
            EditorGUIUtility.PingObject(MonoScript.FromScriptableObject(window));
        }
        public void CreateGUI()
        {
            showToggle = new Toggle("Show label")
            {
                value = true
            };
            activateToggle = new Toggle("Active button")
            {
                value = true
            };
            labelToShow = new Label("This label is shown when the above toggle is set to On");
            buttonToActivate = new Button(() => Debug.Log("Button pressed!"))
            {
                text = "Active if above toggle is On"
            };
            rootVisualElement.Add(showToggle);
            rootVisualElement.Add(labelToShow);
            rootVisualElement.Add(activateToggle);
            rootVisualElement.Add(buttonToActivate);
            showToggle.RegisterValueChangedCallback(evt => labelToShow.visible = evt.newValue);
            activateToggle.RegisterValueChangedCallback(evt => buttonToActivate.SetEnabled(evt.newValue));
        }
    }
}