常用組件

? 創建 GUILayoutExample.cs 腳本，繼承 EditorWindow。

public class GUILayoutExample : EditorWindow
{...[MenuItem("EditorExtension/02.IMGUI/01.GUILayoutExample")]static void OpenGUILayoutExample(){GetWindow<GUILayoutExample>().Show();}private void OnGUI(){... // 在這里編寫面板控件}
}

1 Label 文本標簽

• GUILayout.LabelField(string文本內容);

private void OnGUI()
{...GUILayout.Label("Label: Hello IMGUI");...
}

2 TextField / TextArea / PasswordField 輸入框

• string變量 = GUILayout.TextField(string變量);

  • 單行輸入，不可以 Enter 換行。

• string變量 = GUILayout.TextArea(string變量);

  • 多行輸入，可以 Enter 換行。

• string變量 = GUILayout.PasswordField(string變量, char掩碼);

  • 密碼輸入框，輸入內容會顯示 char 掩碼。

private string _textfieldValue;
private string _textAreaValue;
private string _passwordFieldValue = "";private void OnGUI()
{...GUILayout.Label("TextField");_textfieldValue = GUILayout.TextField(_textfieldValue);GUILayout.Label("TextArea");_textAreaValue = GUILayout.TextArea(_textAreaValue);GUILayout.Label("PasswordField");_passwordFieldValue = GUILayout.PasswordField(_passwordFieldValue, '*');...
}

3 Butto / RepeatButton 按鈕

• if (GUILayout.Button(string按鈕名稱)) { ... }

  按下時觸發。

• if (GUILayout.RepeatButton(string按鈕名稱)) { ... }

  按下和松開都會觸發。

private void OnGUI()
{...if (GUILayout.Button("Button")){Debug.Log("Button Clicked");}// 按下松開都會觸發一次if (GUILayout.RepeatButton("RepeatButton")){Debug.Log("RepeatButton Clicked");}...
}

4 Horizontal / Vertical 方向布局

• 使用 GUILayout.BeginHorizontal(); 和 GUILayout.EndHorizontal(); 包圍代碼塊，使代碼塊的內容水平排列。

?

• 使用 GUILayout.BeginVertical (); 和 GUILayout.EndVertical (); 包圍代碼塊，使代碼塊的內容垂直排列。

? 默認排列方式為垂直排列。

private void OnGUI()
{...GUILayout.BeginHorizontal();{ // 使用大括號縮進表明排列關系GUILayout.Label("TextField");_textfieldValue = GUILayout.TextField(_textfieldValue);}GUILayout.EndHorizontal();...
}

5 Box 自動布局框

• GUILayout.Box(string文本內容);

  使用包圍盒包裹文本內容（深色區域）。

private void OnGUI()
{...GUILayout.BeginHorizontal();{GUILayout.Label("Box");GUILayout.Box("AutoLayout Box");}GUILayout.EndHorizontal();...
}

6 ScrollView 滾動視圖

• Vector2布局 = GUILayout.BeginScrollView(Vector2布局); // 開啟滾動視圖
...
EditorGUILayout.EndScrollView(); // 結束滾動視圖

  當區域不夠顯示全部內容時，啟用滑動條呈現滾動視圖。

private Vector2 _scrollPosition;private void OnGUI()
{..._scrollPosition = GUILayout.BeginScrollView(_scrollPosition);{GUILayout.BeginHorizontal();{GUILayout.Label("TextField");_textfieldValue = GUILayout.TextField(_textfieldValue);}GUILayout.EndHorizontal();...}GUILayout.EndScrollView();...
}

7 Horizontal / VerticalSlider 滑動條

• float變量 = GUILayout.HorizontalSlider(float變量, 最小值, 最大值);
• float變量 = GUILayout.VerticalSlider(float變量, 最小值, 最大值);

private float _sliderValue;private void OnGUI()
{...GUILayout.BeginHorizontal();{GUILayout.Label("HorizontalSlider");_sliderValue = GUILayout.HorizontalSlider(_sliderValue, 0, 1);}GUILayout.EndHorizontal();GUILayout.BeginHorizontal();{GUILayout.Label("VerticalSlider");_sliderValue = GUILayout.VerticalSlider(_sliderValue, 0, 1);}GUILayout.EndHorizontal();...
}

8 Area GUI 區域

• GUILayout.BeginArea(Rect布局位置);

  開啟一塊區域。

private void OnGUI()
{...GUILayout.BeginArea(new Rect(0, 0, 100, 100));{// 顯示重合了GUI.Label(new Rect(0, 0, 20, 20), "1");}GUILayout.EndArea();...
}

9 Window 窗口

• public static Rect Window(int標識ID, Rect布局位置, GUI.WindowFunction繪制函數, string窗口標題);

  在 EditorWindow 中，該窗口無法顯示。

  可在 RunTime 模式下顯示。

private void OnGUI()
{...// 目前不可見GUILayout.Window(1, new Rect(0, 0, 100, 100), id => { }, "Window");...
}

10 Toolbar 工具欄

• int下標 = GUILayout.Toolbar(int下標, string[]顯示名稱);

private int _toolBarIndex;private void OnGUI()
{..._toolBarIndex = GUILayout.Toolbar(_toolBarIndex, new[] { "1", "2", "3", "4", "5" });...
}

11 Toggle 開關按鈕

• bool開關 = GUILayout.Toggle(bool開關, string名稱);

private bool _toggleValue;private void OnGUI()
{..._toggleValue = GUILayout.Toggle(_toggleValue, "Toggle");...
}

12 Space / FlexibleSpace 空白

• GUILayout.Space(int間距);

  空出給定間距。

• GUILayout.FlexibleSpace();

  向兩邊擴張，擠壓中間區域

private void OnGUI()
{...GUILayout.BeginHorizontal();{GUILayout.Label("TextField");_textfieldValue = GUILayout.TextField(_textfieldValue);}GUILayout.EndHorizontal();GUILayout.Space(100); // 間距 100...GUILayout.BeginHorizontal();{GUILayout.Label("Button");GUILayout.FlexibleSpace(); // 擠壓中間區域，將 Button 推到右邊if (GUILayout.Button("Button")){Debug.Log("Button Clicked");}}GUILayout.EndHorizontal();...
}

? 下圖 “1” 表示垂直布局間隔 100，“2” 表示 Button 被水平擠壓到最小。

13 Width / Height / MinWidth / MinHeight / MaxWidth / MaxHeight 寬高控制

• GUILayout.MinWidth(int值);
• GUILayout.MaxWidth(int值);
• GUILayout.MinHeight(int值);
• GUILayout.MaxHeight(int值);

private void OnGUI()
{...GUILayout.BeginHorizontal();{GUILayout.Label("Button");GUILayout.FlexibleSpace(); // 擠壓中間區域，將 Button 推到右邊if (GUILayout.Button("Button",GUILayout.MinWidth(100), GUILayout.MaxWidth(150),GUILayout.MinHeight(100), GUILayout.MaxHeight(150))){Debug.Log("Button Clicked");}}GUILayout.EndHorizontal();...
}

14 SelectionGrid 選擇網格

• int下標 = GUILayout.SelectionGrid(int下標, string[]名稱, int水平數量);

private int _selectedGridIndex;private void OnGUI()
{..._selectedGridIndex = GUILayout.SelectionGrid(_selectedGridIndex, new[] { "1", "2", "3", "4", "5" }, 3);...
}