Unity UGUI的Dropdown（下拉式選單）元件的介紹及使用

1. 什麼是Dropdown元件？

Dropdown（下拉式選單）是Unity UGUI中的一個常用元件，用於在使用者點選或選擇時顯示一個下拉式選單，提供多個選項供使用者選擇。

2. Dropdown元件的工作原理

Dropdown元件由兩部分組成：一個可點選的按鈕和一個下拉式選單。當用戶點選按鈕時，下拉式選單會展開，顯示所有選項。使用者可以通過點選選項來進行選擇。

3. Dropdown元件的常用屬性

Options：下拉式選單中的選項列表。
Caption Text：按鈕上顯示的文字。
Template：下拉式選單的模板。
Item Text：下拉式選單中選項的文字。
On Value Changed：當選擇的值發生變化時觸發的事件。

4. Dropdown元件的常用函數

ClearOptions()：清空下拉式選單中的選項。
AddOptions(List options)：向下拉式選單中新增選項。
SetValueWithoutNotify(int value)：設定當前選擇的值，但不觸發事件。

5. 範例程式碼

範例1：建立一個簡單的下拉式選單

using UnityEngine;
using UnityEngine.UI;

public class DropdownExample : MonoBehaviour
{
    public Dropdown dropdown;

    void Start()
    {
        dropdown.ClearOptions();
        dropdown.AddOptions(new List<string> { "Option 1", "Option 2", "Option 3" });
    }
}

操作步驟：

建立一個空物體，並將Dropdown元件新增到該物體上。
將DropdownExample指令碼新增到該物體上。
在Inspector面板中，將Dropdown元件的參照拖拽到DropdownExample指令碼的dropdown欄位上。
執行遊戲，下拉式選單中將顯示"Option 1"、"Option 2"和"Option 3"三個選項。

注意事項：

在Start函數中新增選項，確保在遊戲開始時下拉式選單已經初始化。

範例2：獲取當前選擇的值

using UnityEngine;
using UnityEngine.UI;

public class DropdownExample : MonoBehaviour
{
    public Dropdown dropdown;

    void Start()
    {
        dropdown.ClearOptions();
        dropdown.AddOptions(new List<string> { "Option 1", "Option 2", "Option 3" });
    }

    public void OnDropdownValueChanged(int value)
    {
        Debug.Log("Selected option: " + dropdown.options[value].text);
    }
}

操作步驟：

建立一個空物體，並將Dropdown元件新增到該物體上。
將DropdownExample指令碼新增到該物體上。
在Inspector面板中，將Dropdown元件的參照拖拽到DropdownExample指令碼的dropdown欄位上。
在DropdownExample指令碼中，建立一個公共方法OnDropdownValueChanged，並將其繫結到Dropdown元件的On Value Changed事件上。
執行遊戲，選擇下拉式選單中的選項，控制檯將輸出所選選項的文字。

注意事項：

OnDropdownValueChanged方法的引數value表示當前選擇的索引。

範例3：動態新增選項

using UnityEngine;
using UnityEngine.UI;

public class DropdownExample : MonoBehaviour
{
    public Dropdown dropdown;
    public InputField inputField;

    void Start()
    {
        dropdown.ClearOptions();
        dropdown.AddOptions(new List<string> { "Option 1", "Option 2", "Option 3" });
    }

    public void AddOption()
    {
        string newOption = inputField.text;
        dropdown.options.Add(new Dropdown.OptionData(newOption));
        dropdown.RefreshShownValue();
    }
}

操作步驟：

建立一個空物體，並將Dropdown元件新增到該物體上。
將DropdownExample指令碼新增到該物體上。
在Inspector面板中，將Dropdown元件的參照拖拽到DropdownExample指令碼的dropdown欄位上。
建立一個InputField元件，並將其參照拖拽到DropdownExample指令碼的inputField欄位上。
在DropdownExample指令碼中，建立一個公共方法AddOption，並將其繫結到一個按鈕的OnClick事件上。
執行遊戲，輸入一個新選項的文字，點選按鈕，下拉式選單中將新增一個新選項。

注意事項：

AddOption方法通過inputField獲取新選項的文字，並使用dropdown.options.Add方法新增新選項。
新增新選項後，需要呼叫dropdown.RefreshShownValue方法重新整理下拉式選單的顯示。

範例4：設定預設選項

using UnityEngine;
using UnityEngine.UI;

public class DropdownExample : MonoBehaviour
{
    public Dropdown dropdown;

    void Start()
    {
        dropdown.ClearOptions();
        dropdown.AddOptions(new List<string> { "Option 1", "Option 2", "Option 3" });
        dropdown.SetValueWithoutNotify(1);
    }
}

操作步驟：

建立一個空物體，並將Dropdown元件新增到該物體上。
將DropdownExample指令碼新增到該物體上。
在Inspector面板中，將Dropdown元件的參照拖拽到DropdownExample指令碼的dropdown欄位上。
在Start函數中，使用dropdown.SetValueWithoutNotify方法設定預設選項的索引。
執行遊戲，下拉式選單中將預設選擇第二個選項。

注意事項：

SetValueWithoutNotify方法用於設定當前選擇的值，但不觸發On Value Changed事件。

範例5：自定義下拉式選單模板

using UnityEngine;
using UnityEngine.UI;

public class DropdownExample : MonoBehaviour
{
    public Dropdown dropdown;
    public GameObject customTemplate;

    void Start()
    {
        dropdown.ClearOptions();
        dropdown.AddOptions(new List<string> { "Option 1", "Option 2", "Option 3" });
        dropdown.template = customTemplate.transform as RectTransform;
    }
}

操作步驟：

建立一個空物體，並將Dropdown元件新增到該物體上。
建立一個空物體作為自定義模板，設定其佈局和樣式。
將DropdownExample指令碼新增到第一個物體上。
在Inspector面板中，將Dropdown元件的參照拖拽到DropdownExample指令碼的dropdown欄位上。
將自定義模板的參照拖拽到DropdownExample指令碼的customTemplate欄位上。
執行遊戲，下拉式選單將使用自定義模板進行顯示。

注意事項：

自定義模板需要是一個RectTransform元件。

參考資料

Unity官方檔案：Dropdown