Unity dropdown 界面设计

发表于2019-01-08
评论1 4.9k浏览
做界面设置的时候,考虑到页面的美感及设计感,有些情况下需要使用那种需要下拉列表框的界面,这篇就给大家记录下设置的方法,使用unity里自带的 dropdown ,在Hierarchy界面创建一个Dropdown,这个是基础这里就不多讲了。

最终功能:点击下拉列表,出现离开房间,解散房间,游戏设置文字和响应的图标。dropdown设置如下

跟默认的dropdown稍微删掉了一些不用的东西,比如首选项的文字我不需要。Dropdown我不想要背面的白色背景,将他的透明度改为了0,Arrow 是首个图标,选一个你想替换的icon.调节大小,这些自己试试就会了。

主要是这的配置:

Caption Text和Caption Image是作为首选项的文字和图片显示。

Item Text和Item Image是作为下拉列表中每个item的文字和图片显示。

Value值会随着下拉列表选项的不同而变化,默认是0,选择下拉列表的第一个,我这里不需要这样,就将他设计成一个不用的数字。

Options里面的第一个框是下拉列表中的文字,第二个是图片。

提示:这里的item Image 使用hierarchy视图里你你创建的item Image。不知道的话看这个博客的第二张图上能找到。这是一种通过摆界面的方式实现的。下面我们说一下通过代码实现,参考别人的。
 public string[] showText;
    public Sprite[] sprite;
    Dropdown dropDownItem;
    List<string> temoNames;
    List<Sprite> sprite_list;
    void Start()
    {
        dropDownItem = this.GetComponent<Dropdown>();
        temoNames = new List<string>();
        sprite_list = new List<Sprite>();
        AddNames();
        UpdateDropDownItem(temoNames);
    }
    void UpdateDropDownItem(List<string> showNames)
    {
        dropDownItem.options.Clear();
        Dropdown.OptionData temoData;
        for (int i = 0; i < showNames.Count; i++)
        {
            temoData = new Dropdown.OptionData();
            temoData.text = showNames[i];
            temoData.image = sprite_list[i];
            dropDownItem.options.Add(temoData);
        }
        
        dropDownItem.captionText.text = showNames[0];
       
    }
    void AddNames()
    {
        for (int i = 0; i < showText.Length; i++)
        {
            temoNames.Add(showText[i]);
        }
        for (int i = 0; i < sprite.Length; i++)
        {
            sprite_list.Add(sprite[i]);
        }
    }
}

dropDownItem.value == 0 判断选择的下拉列表框。

mydrop.value返回的是当前值所在list中的位置,位置是从0开始算起的。

dropdownItem.options.Clear(); 清空数据

dropdownItem.options.Add(tempData); 添加数据

dropdown.addoptions(“放入要显示的list数据”)方法显示要显示的内容

mydrop.options.RemoveAt(“要移除的数据”)方法 来移除当前选中的内容

mydrop.options[0].text; 
获取第一个下拉列表框的文本内容

如社区发表内容存在侵权行为,您可以点击这里查看侵权投诉指引