Unity Inspectorでトグルボタンを作成するにはどうすればよいですか?


13

私はUnityのTerrainツールに似たツールを作成したいと思います。このツールにはインスペクターにいくつかの素敵なトグルボタンがあります:

インスペクターの切り替えボタン 切り替えボタン

これに似たデザインを実現するにはどうすればよいですか?インスペクターで通常のボタンやその他のUIコンポーネントを作成する方法は知っていますが、ボタンを切り替えるための十分な情報が見つかりません。

これまで、チェックボックスを生成する通常のトグルを使用しました。

var tmp = EditorGUILayout.Toggle( SetAmountFieldContent, _setValue );

if ( tmp != _setValue )
{
  _setValue = tmp;
  if ( _setValue )
    _smoothValue = false;
}

tmp = EditorGUILayout.Toggle( SmoothValueFieldContent, _smoothValue );

if ( tmp != _smoothValue )
{
  _smoothValue = tmp;
  if ( _smoothValue )
    _setValue = false;
}

トグルGUIStyleを「ボタン」に設定しても、目的の結果は得られません。テキストまたは画像コンテンツは、ボタンの内側ではなく左側に配置されます。

var tmp = EditorGUILayout.Toggle( SetAmountFieldContent, _setValue, "Button" );

トグルでの望ましくない動作

また、GUISkinにあるオプションはどれも役に立たないようです。

回答:


8

トグルの代わりにボタンを使用して、この問題を解決しました。

最初に、機能の前に2つのボタンスタイルを定義します。

private static GUIStyle ToggleButtonStyleNormal = null;
private static GUIStyle ToggleButtonStyleToggled = null;

次に、OnInspectorGui()nullの場合に生成されることを確認します。

if ( ToggleButtonStyleNormal == null )
{
  ToggleButtonStyleNormal = "Button";
  ToggleButtonStyleToggled = new GUIStyle(ToggleButtonStyleNormal);
  ToggleButtonStyleToggled.normal.background = ToggleButtonStyleToggled.active.background;
}

そして、@ jzxによって提案されたアイデアを使用して、スタイルを切り替えます。

GUILayout.BeginHorizontal(  );

if ( GUILayout.Button( SetAmountFieldContent, _setValue ? ToggleButtonStyleToggled : ToggleButtonStyleNormal ) )
{
  _setValue = true;
  _smoothValue = false;
}

if ( GUILayout.Button( SmoothValueFieldContent, _smoothValue ? ToggleButtonStyleToggled : ToggleButtonStyleNormal ) )
{
  _smoothValue = true;
  _setValue = false;
}

GUILayout.EndHorizontal();

これは私が欲しかったものを生成します:

最初の切り替えボタン 2番目の切り替えボタン


1
よくやった!Unity3Dエディターのトグルボタンの答えを見つけるのに何日か探していました。1つの質問_smoothValue = !GUILayout.Button( SetAmountFieldContent, _smoothValue ? ToggleButtonStyleToggled : ToggleButtonStyleNormal)-2つのブール値の代わりに、を使用しないのはなぜですか?私と近いstadnard統一ボタン/トグルを使用するコードのルックスのためにうまく動作すること
Ivaylo Slavov

1
@IvayloSlavovわかりやすくするために例として使用しました
ラッセ

4

Toggleは、ボタンの現在の状態を返します- 値で渡されたのと同じ状態か、ユーザーが変更した新しい値のいずれかです。したがって、より良いパターンは...

// TODO: Initialize these with GUIContent
private GUIContent _toggleButtonDepressedLabel;
private GUIContent _toggleButtonDefaultLabel;

// Current toggle state
bool _toggleButtonState;

void DisplayToggle()
{
    var image = _toggleButtonValue
                ? _toggleButtonDepressedLabel
                : _toggleButtonDefaultLabel;
    var newState = EditorGUILayout.Toggle(image, _toggleButtonState);
    if (newState != _toggleButtonState)
    {
        _toggleButtonState = newState;
        OnToggleButtonChanged();
    }
}

void OnGUI ()
{
    DisplayToggle();
}

void OnToggleButtonChanged()
{
    // Do stuff.
}

GUIStylesには同じ状態依存スワッピングパターンを使用できます。

private GUIStyle _toggleButtonDepressedStyle;
private GUIStyle _toggleButtonDefaultStyle;
// ...
    var image = _toggleButtonValue
                ? _toggleButtonDepressedLabel
                : _toggleButtonDefaultLabel;
    var style = _toggleButtonValue
                ? _toggleButtonDepressedStyle
                : _toggleButtonDefaultStyle;
    var newState = EditorGUILayout.Toggle(image, _toggleButtonState, style);

2

基本的な、しかし簡単な方法は次のとおりです。

 pressed = GUILayout.Toggle(pressed, "Toggle me !", "Button");

ここから取られ


2

GUILayout.Toolbarを使用します。ドキュメントは誤解を招くもので、実際にはボタンを一緒に実行します。

ツールバーの例

さらに、スタイル「buttonleft」、「buttonmid」、「buttonright」を使用して、これらのボタンスタイルを直接描画できます。

        var left = GUI.skin.FindStyle("buttonleft");
        GUILayout.Button("left only button", left);

0

あなたはこれを行うことができます:

private GUIStyle buttonStyle;
private bool enableToogle;

public override void OnInspectorGUI()
{
    buttonStyle = new GUIStyle(GUI.skin.button);
    enableToogle = GUILayout.Toggle(enableToogle, "Toogle Me", buttonStyle);

    if(enableToogle)
    {
        // your stuff here
    }
}

buttonStyle内部OnInspectorGUI()でインスタンス化することが非常に重要です。そうしないと、エラーが発生します。また、参照をbuttonStyle = GUI.skin.button;コピーし、すべてのボタンのスタイルを変更するとskin.button変更されるため、実行しないでくださいbuttonStyle

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.