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<string> 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" });    }}

操作步骤：

  1. 创立一个空物体，并将Dropdown组件增加到该物体上。
  2. 将DropdownExample脚本增加到该物体上。
  3. 在Inspector面板中，将Dropdown组件的援用拖拽到DropdownExample脚本的dropdown字段上。
  4. 运行游戏，下拉菜单中将显示"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);    }}

操作步骤：

  1. 创立一个空物体，并将Dropdown组件增加到该物体上。
  2. 将DropdownExample脚本增加到该物体上。
  3. 在Inspector面板中，将Dropdown组件的援用拖拽到DropdownExample脚本的dropdown字段上。
  4. 在DropdownExample脚本中，创立一个公共办法OnDropdownValueChanged，并将其绑定到Dropdown组件的On Value Changed事件上。
  5. 运行游戏，抉择下拉菜单中的选项，控制台将输入所选选项的文本。

注意事项：

  • 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();    }}

操作步骤：

  1. 创立一个空物体，并将Dropdown组件增加到该物体上。
  2. 将DropdownExample脚本增加到该物体上。
  3. 在Inspector面板中，将Dropdown组件的援用拖拽到DropdownExample脚本的dropdown字段上。
  4. 创立一个InputField组件，并将其援用拖拽到DropdownExample脚本的inputField字段上。
  5. 在DropdownExample脚本中，创立一个公共办法AddOption，并将其绑定到一个按钮的OnClick事件上。
  6. 运行游戏，输出一个新选项的文本，点击按钮，下拉菜单中将增加一个新选项。

注意事项：

  • 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);    }}

操作步骤：

  1. 创立一个空物体，并将Dropdown组件增加到该物体上。
  2. 将DropdownExample脚本增加到该物体上。
  3. 在Inspector面板中，将Dropdown组件的援用拖拽到DropdownExample脚本的dropdown字段上。
  4. 在Start函数中，应用dropdown.SetValueWithoutNotify办法设置默认选项的索引。
  5. 运行游戏，下拉菜单中将默认抉择第二个选项。

注意事项：

  • 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;    }}

操作步骤：

  1. 创立一个空物体，并将Dropdown组件增加到该物体上。
  2. 创立一个空物体作为自定义模板，设置其布局和款式。
  3. 将DropdownExample脚本增加到第一个物体上。
  4. 在Inspector面板中，将Dropdown组件的援用拖拽到DropdownExample脚本的dropdown字段上。
  5. 将自定义模板的援用拖拽到DropdownExample脚本的customTemplate字段上。
  6. 运行游戏，下拉菜单将应用自定义模板进行显示。

注意事项：

  • 自定义模板须要是一个RectTransform组件。

参考资料

  • Unity官网文档：Dropdown