乐趣区

关于c#:Unity-UGUI的Dropdown下拉菜单组件的介绍及使用

jiezi

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
退出移动版