Unity 之 UGUI Dropdown组件使用简析

Unity 之 UGUI Dropdown组件使用简析

官方文档：https://docs.unity3d.com/Manual/script-Dropdown.html

来自官方诠释：控件显示当前选择的选项。一旦单击，它将打开选项列表，以便可以选择一个新选项。选择新选项后，关闭的列表再次关闭，控件将显示新选定的选项。如果用户单击控件本身或画布中的任何其他位置，列表也将关闭。

---

创建出Unity 定义好的Dropdown组件，大概长成这个样子…

细心的你会发现，当运行时，会生成一个Blocker，这个时充满当前图层的，这也是为什么当你点击了下拉选项，点击空白处，下拉选项会自动关闭的原因。

看一下生成的Blocker的Inspector面板

---

下面是一个对DropDown基础操作

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;

public class DropDownTest : MonoBehaviour {

    public Dropdown dropDown;

	void Start () {

        //是否可以点击
        dropDown.interactable = true;

        #region 添加下拉选项，，，设置文字，底图
        //添加一个下拉选项
        Dropdown.OptionData data = new Dropdown.OptionData();
        data.text = "方案一";
        //data.image = "指定一个图片做背景不指定则使用默认"；
        dropDown.options.Add(data);

        //另一种添加方式 , 不过用起来并不比第一个方便，
        List<Dropdown.OptionData> listOptions = new List<Dropdown.OptionData>();       
        listOptions.Add(new Dropdown.OptionData("方案二"));
        listOptions.Add(new Dropdown.OptionData("方案三"));
        dropDown.AddOptions(listOptions);

        //设置显示字体大小
        dropDown.captionText.fontSize = 14;
        //dropDown.captionImage = "底图";
        //设置要复制字体大小
        dropDown.itemText.fontSize = 15;
        //dropDown.itemImage = "底图";

        //PS：我一般是使用循环 使用第一种形式添加
        #endregion

        #region 添加完成就可以使用了，那么当我们想要复用怎么办呢？，这时就用到了移除OptionData，下面的每个注释打开都是一个功能
        //直接清理掉所有的下拉选项，
        dropDown.ClearOptions();
        //亲测不是很好用
        //dropDown.options.Clear(); 

        //对象池回收时，有下拉状态的，直接干掉... (在极限点击测试的情况下会出现)
        if (dropDown.transform.childCount == 3)
        {
            Destroy(dropDown.transform.GetChild(2).gameObject);
        }

        //移除指定数据   参数：OptionData
        dropDown.options.Remove(data);
        //移除指定位置   参数:索引
        dropDown.options.RemoveAt(0); 
        #endregion

        #region 添加监听函数
        //当点击后值改变是触发 (切换下拉选项)
        dropDown.onValueChanged.AddListener((int v) => OnValueChange(v));
        //若有多个，可以将自己当做参数传递进去，已做区分。
        //dropDown.onValueChanged_1.AddListener((int v) => OnValueChange(dropDown.gameobject,v));
        #endregion
    }

    /// 

    /// 当点击后值改变是触发 (切换下拉选项)
    /// 
    /// 是点击的选项在OptionData下的索引值
    void OnValueChange(int v)
    {
        //切换选项 时处理其他的逻辑...
        Debug.Log("点击下拉控件的索引是..." + v);
    }	
	
}

---

---

内置的方法和属性大家可以去官网查看，文章开头有官网链接哦

官方源码：

#region 程序集 UnityEngine.UI, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null
// E:\program files\Unity\Editor\Data\UnityExtensions\Unity\GUISystem\UnityEngine.UI.dll
#endregion

using System.Collections.Generic;
using UnityEngine.Events;
using UnityEngine.EventSystems;

namespace UnityEngine.UI
{
    //
    // 摘要:
    //     A standard dropdown that presents a list of options when clicked, of which one
    //     can be chosen.
    //一个标准的下拉菜单，它在单击时显示一个选项列表，可以从中选择一个。
    [AddComponentMenu("UI/Dropdown", 35)]
    [RequireComponent(typeof(RectTransform))]
    public class Dropdown : Selectable, IPointerClickHandler, ISubmitHandler, ICancelHandler, IEventSystemHandler
    {
        protected Dropdown();

        //
        // 摘要:
        //     The Image component to hold the image of the currently selected option.
        //用于保存当前选定选项的图像的图像组件。
        public Image captionImage { get; set; }
        //
        // 摘要:
        //     The Text component to hold the text of the currently selected option.
        //用于保存当前选定选项的文本的文本组件。
        public Text captionText { get; set; }
        //
        // 摘要:
        //     The Rect Transform of the template for the dropdown list.
        //下拉列表模板的Rect转换
        public RectTransform template { get; set; }
        //
        // 摘要:
        //     The list of possible options. A text string and an image can be specified for
        //     each option.
        //可能选项的列表。可以为每个选项指定文本字符串和图像。
        public List<OptionData> options { get; set; }
        //
        // 摘要:
        //     A UnityEvent that is invoked when when a user has clicked one of the options
        //     in the dropdown list.
        //当用户单击其中一个选项时调用的UnityEvent 在下拉列表中。
        public DropdownEvent onValueChanged { get; set; }
        //
        // 摘要:
        //     The Text component to hold the text of the item.
        //文本组件来保存项的文本。
        public Text itemText { get; set; }
        //
        // 摘要:
        //     The Image component to hold the image of the item.
        //用于保存项的图像的图像组件。
        public Image itemImage { get; set; }
        //
        // 摘要:
        //     The index of the currently selected option. 0 is the first option, 1 is the second,
        //     and so on.
        //当前选定选项的索引。0是第一个选项，1是第二个选项，等等。
        public int value { get; set; }

        public void AddOptions(List<Sprite> options);
        public void AddOptions(List<string> options);
        public void AddOptions(List<OptionData> options);
        //
        // 摘要:
        //     Clear the list of options in the Dropdown.
        //清除下拉列表中的选项。
        public void ClearOptions();
        //
        // 摘要:
        //     Hide the dropdown list.
        //隐藏下拉列表。
        public void Hide();
        //
        // 摘要:
        //     Called by a BaseInputModule when a Cancel event occurs.
        //当发生取消事件时，由BaseInputModule调用。
        // 参数:
        //   eventData:
        public virtual void OnCancel(BaseEventData eventData);
        //
        // 摘要:
        //     Handling for when the dropdown is 'clicked'.
        //处理当下拉框被'点击'。
        // 参数:
        //   eventData:
        //     Current event.
        public virtual void OnPointerClick(PointerEventData eventData);
        //
        // 摘要:
        //     What to do when the event system sends a submit Event.
        //当事件系统发送提交事件时应该做什么。
        // 参数:
        //   eventData:
        //     Current event.
        public virtual void OnSubmit(BaseEventData eventData);
        //
        // 摘要:
        //     Refreshes the text and image (if available) of the currently selected option.
        //     If you have modified the list of options, you should call this method afterwards
        //     to ensure that the visual state of the dropdown corresponds to the updated options.
        //刷新当前选定选项的文本和图像(如果可用)。
        //如果你修改了选项列表，你应该在之后调用这个方法
        //确保下拉菜单的可视状态与更新后的选项相对应。
        public void RefreshShownValue();
        //
        // 摘要:
        //     Show the dropdown list.
        //显示下拉列表。
        public void Show();
        protected override void Awake();
        //
        // 摘要:
        //     Override this method to implement a different way to obtain a blocker GameObject.
        //重写此方法以实现获取拦截器GameObject的另一种方法。
        // 参数:
        //   rootCanvas:
        //     The root canvas the dropdown is under.
        //下拉菜单下的根画布。
        // 返回结果:
        //     The obtained blocker.
        protected virtual GameObject CreateBlocker(Canvas rootCanvas);
        //
        // 摘要:
        //     Override this method to implement a different way to obtain a dropdown list GameObject.
        //重写此方法以实现获取下拉列表GameObject的另一种方法。
        // 参数:
        //   template:
        //     The template to create the dropdown list from.
        //创建下拉列表的模板。
        // 返回结果:
        //     The obtained dropdown list.
        protected virtual GameObject CreateDropdownList(GameObject template);
        protected virtual DropdownItem CreateItem(DropdownItem itemTemplate);
        //
        // 摘要:
        //     Override this method to implement a different way to dispose of a blocker GameObject
        //     that blocks clicks to other controls while the dropdown list is open.
        //重写此方法以实现处理拦截器GameObject的另一种方法
		//当下拉列表打开时，它阻止对其他控件的单击。
        // 参数:
        //   blocker:
        //     The blocker to dispose of.
        //要处理的阻滞剂。
        protected virtual void DestroyBlocker(GameObject blocker);
        //
        // 摘要:
        //     Override this method to implement a different way to dispose of a dropdown list
        //     GameObject.
        //重写此方法，以实现处理下拉列表的另一种方法
        // 参数:
        //   dropdownList:
        //     The dropdown list to dispose of.
        //要处理的下拉列表。
        protected virtual void DestroyDropdownList(GameObject dropdownList);
        protected virtual void DestroyItem(DropdownItem item);
        protected override void OnValidate();

        //
        // 摘要:
        //     Class used internally to store the list of options for the dropdown list.
        //类，用于在内部存储下拉列表的选项列表。
        public class OptionDataList
        {
            public OptionDataList();

            //
            // 摘要:
            //     The list of options for the dropdown list.
            public List<OptionData> options { get; set; }
        }
        //
        // 摘要:
        //     Class to store the text and/or image of a single option in the dropdown list.
        //类来存储下拉列表中单个选项的文本和/或图像。
        public class OptionData
        {
            //
            // 摘要:
            //     Create an object representing a single option for the dropdown list.
            //
            // 参数:
            //   text:
            //     Optional text for the option.
            //
            //   image:
            //     Optional image for the option.
            public OptionData();
            //
            // 摘要:
            //     Create an object representing a single option for the dropdown list.
            //
            // 参数:
            //   text:
            //     Optional text for the option.
            //
            //   image:
            //     Optional image for the option.
            public OptionData(string text);
            //
            // 摘要:
            //     Create an object representing a single option for the dropdown list.
            //
            // 参数:
            //   text:
            //     Optional text for the option.
            //
            //   image:
            //     Optional image for the option.
            public OptionData(Sprite image);
            //
            // 摘要:
            //     Create an object representing a single option for the dropdown list.
            //为下拉列表创建一个表示单个选项的对象。
            // 参数:
            //   text:
            //     Optional text for the option.
            //
            //   image:
            //     Optional image for the option.
            public OptionData(string text, Sprite image);

            //
            // 摘要:
            //     The text associated with the option.
            public string text { get; set; }
            //
            // 摘要:
            //     The image associated with the option.
            public Sprite image { get; set; }
        }
        //
        // 摘要:
        //     UnityEvent callback for when a dropdown current option is changed.
        //UnityEvent回调函数，用于更改当前下拉选项时的回调。
        public class DropdownEvent : UnityEvent<int>
        {
            public DropdownEvent();
        }
        protected internal class DropdownItem : MonoBehaviour, IPointerEnterHandler, ICancelHandler, IEventSystemHandler
        {
            public DropdownItem();

            public Text text { get; set; }
            public Image image { get; set; }
            public RectTransform rectTransform { get; set; }
            public Toggle toggle { get; set; }

            public virtual void OnCancel(BaseEventData eventData);
            public virtual void OnPointerEnter(PointerEventData eventData);
        }
    }
}