【Unity3D】UGUI Dropdown控件研究

一、前言

Dropdown下拉列表，控件还是很强大的，做UI的时候用的比较多，现在就将Dropdown使用中的一些经验总结起来，分享给大家了

二、参考资料

UGUI 中Dropdown控件的使用经验
Unity3D UGUI中的dropdown控件使用总结
Unity(一)关于Unity Dropdown控件的使用心得

三、正文

对于Dropdown控件的研究，我将分成这么几个部分：

• 1、控件的组成以及属性面板介绍
• 2、控件的初始化以及内容显示
• 3、增加节点以及删除节点
• 4、事件监听方式

1、控件的组成以及属性面板介绍

Label是显示初始化的文字
Arrow是显示初始化的下拉箭头
Template是Dropdown的模板样式
Item Background是每一个Item的背景图片
Item Checkmark是每一个Item的下拉框图片
Item Label是每一个Item的文字显示内容
Scrollbar是一个下拉框
其中Item Background和Item Checkmark的图集资源我们可以提前更改。

然后我们看一下Dropdown的属性面板：

Caption Text和Caption Image是作为下拉列表首选项的文字和图片显示，也是我们每次选择后的内容，因此可代码调用获取

Item Text作为下拉列表中每个item的文字显示，Item Image可以用来扩展模板增加内容

Value值会随着下拉列表选项的不同而变化，dropdown.value

Options选项栏内：可以动态赋值给Item对象 Dropdown.OptionData

2、控件的初始化以及内容显示

初始化文字内容

using UnityEngine;
using UnityEngine.UI;

public class TestDropdown : MonoBehaviour
{
public Dropdown Drd_IPList;

private void Start()
{
InitDropdown();
}

private void InitDropdown()
{
//清空默认节点
Drd_IPList.options.Clear();

//初始化
Dropdown.OptionData op1 = new Dropdown.OptionData();
op1.text = "220.110.1.10";
Drd_IPList.options.Add(op1);

Dropdown.OptionData op2 = new Dropdown.OptionData();
op2.text = "220.110.1.11";
Drd_IPList.options.Add(op2);

Dropdown.OptionData op3 = new Dropdown.OptionData();
op3.text = "220.110.1.12";
Drd_IPList.options.Add(op3);
}
}

同时初始化文字和图片

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

public class TestDropdown : MonoBehaviour
{
public Dropdown Drd_IPList;
public List<Sprite> m_Sprite;

List<string> m_TextContent;
Dropdown.OptionData m_TempData;

private void Start()
{
AddTextContent();
InitDropdown();
}

private void AddTextContent()
{
for (int i = 0; i < 3; i++)
{
m_TextContent.Add("220.110.1.1" + i);
}
}

private void InitDropdown()
{
//清空默认节点
Drd_IPList.options.Clear();

//初始化
for (int i = 0; i < 3; i++)
{
m_TempData = new Dropdown.OptionData();
m_TempData.text = m_TextContent[i];
m_TempData.image = m_Sprite[i];
Drd_IPList.options.Add(m_TempData);
}
//初始选项的显示
Drd_IPList.captionText.text = m_TextContent[0];
}
}

3、增加节点以及删除节点

添加节点

//添加节点
public void AddItem()
{
m_TempData = new Dropdown.OptionData();
m_TempData.text = "新添加的节点";
Drd_IPList.options.Add(m_TempData);
}

删除节点

//删除节点
public void DelectItem()
{
//删除第一个节点
m_TempData = Drd_IPList.options[0];
Drd_IPList.options.Remove(m_TempData);
}

删除后：

4、事件监听方式

使用Dropdown自带的监听事件

using UnityEngine;
using UnityEngine.UI;
[RequireComponent(typeof(Dropdown))]
public class Drop : MonoBehaviour
{
private Dropdown drop;
void Start()
{
drop = this.GetComponent<Dropdown>();
drop.onValueChanged.AddListener(Change);
}
private void Change(int index)
{
Debug.Log(index);
switch (index)
{
case 0: break;
case 1: break;
default: break;
}
}

使用ISelectHandler接口进行事件监听

using UnityEngine;
using UnityEngine.UI;
using UnityEngine.EventSystems;
public class Drop : MonoBehaviour,ISelectHandler
{
public Dropdown drop;
private int lastIndex;

public void OnSelect(BaseEventData eventData)
{
//避免点击下拉列表item和dropdown重复调用
if (drop.value == lastIndex) return;

//处理逻辑
//

Debug.Log("OnSelect=" + drop.value);
lastIndex = drop.value;
}

在Dropdown面板中使用脚本监听

using UnityEngine;
using UnityEngine.UI;

public class TestDropdown : MonoBehaviour
{
public Dropdown Drd_IPList;

//事件监听
public void EventListening()
{
switch (Drd_IPList.value)
{
case 0:
Debug.Log(0);
break;
case 1:
Debug.Log(1);
break;
case 2:
Debug.Log(2);
break;
default:
break;
}
}
}

将脚本挂在Main Camera上面（当然，任何物体都可以），然后将Dropdown拖入卡槽中：

将Dropdown下面的On Value Changed增加方法

运行起来，可以看到控制台打印的信息