NGUI下拉列表PopList

下拉列表简介

下拉表是通过用户点击后，罗列一些选项供用户选择，最终把选中的项显示出来。Unity中也有使用，例如UISprite组件的Type属性。

下拉列表制作

本节课制作的效果如下：



1）首先利用UIsprite制作下拉表的背景。

2）再制作好的背景图片下，添加一个Label组件，用来显示选项文字。

3）选中UISprite添加BoxCollider和PopList组件。



相关属性说明

* Options 列表项，每一行为一项。

* Default 默认项 程序运行时，默认选中显示的项。

* Position 下拉表出现的位置

* Auto 自动选择位置

* Above 在上方显示

* Below 在下方显示

* Alignment 下拉项文字对齐方式

* Automatic/Left/Center/Right/justified（自动扩展)

* OpenOn 下来表打开方式

* ClickOrTap(点击或轻触)/Right Click(右击)/Double Click(双击)/Manual(手动调用)

* Localized 是否本地化

Atlas组

用于设置下拉项的背景和和选中时的高亮效果。



Background:下拉表背景图

HeightLight:鼠标移动过程中选中项背景

Font组

用于设置显示下拉列表项中字体



Font 用于设置字体

Font-Size:设置文本大小

TextColor:文字的颜色

Padding:X 列表项水平内缩进

Padding:Y 列表项垂直方向间隔

PopList重要程序

1）如何获取Options中的列表项

public class PopListDemo : MonoBehaviour {
private UIPopupList list;
// Use this for initialization
void Start () {
list = this.GetComponent<UIPopupList>();
//获取PopList的options项
foreach (string itemText in list.items)
{
print(itemText);
}
}
}

1
2
3
4
5
6
7
8
9
10
11
12

2)如何动态添加列表项

public class PopListDemo : MonoBehaviour {

private UIPopupList list;
// Use this for initialization
void Start () {
list = this.GetComponent<UIPopupList>();
//动态向options中添加项
for (int i = 0; i < 3; i++)
{
//通过AddItem添加项
list.AddItem("Item "+i);
//通过RemoveItem删除项
//list.RemoveItem("Item1");
}
}
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

3)动态获取当前选中的项

通过value属性可以获得当前列表项选中的值。

public class PopListDemo : MonoBehaviour {

private UIPopupList list;
// Use this for initialization
void Start () {
list = this.GetComponent<UIPopupList>();
//添加值改变回调
list.onChange.Add(new EventDelegate(onValueChange));
}
void onValueChange()
{
print(list.value);
}
}