Unity (i) Experience with Unity dropdown controls

Description: See some links to the control of some use is not very understanding, so I personally explored a bit, below to share their own experience

Features to implement: 1 The drop-down list shows image,2 each time you choose, the picture in the dropdown changes along with it.

1: First look at the controls

Added a new item Image yourself, which will be referred to later for its usefulness.

Image is used to make an assignment object, which is mentioned later

Lable and arrow are used to display the initialized text and tick options.

2: Take a look at the dropdown properties panel

Caption text and Caption image are text and picture displays as drop-down list preferences

Item text and item image are displayed as text and pictures for each item in the drop-down list

Value values vary depending on the drop-down options and can be exploited by code

Options Bar: You can assign values to the corresponding item object by code Dropdown.optiondata

3: see below for scripts and objects to use

Showtext the text of each item you test with

Sprite itself used to do each item's picture display

Want to achieve the following effects:

Other_img is random. An IMG object is used to assign values as a third party, see the code. Don't worry about it, huh?

4: Code module

Description: Refer to someone else's code and make a change

Public string[] Showtext;
Public sprite[] Sprite;
Dropdown Dropdownitem;
List<string> Temonames;
List<sprite> sprite_list;
Public Image other_img;//arbitrary IMG, used as an assigned value substitution
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++)
{
Assign a value to each of the option options
Temodata = new Dropdown.optiondata ();
Temodata.text = Shownames[i];
Temodata.image = Sprite_list[i];
DROPDOWNITEM.OPTIONS.ADD (Temodata);
}
Display of initial options
DropDownItem.captionText.text = Shownames[0];
Other_img.sprite = sprite_list[0];
Dropdownitem.captionimage =other_img;

}
void Update ()
{
if (dropdownitem.value==0)
{
Debug.Log ("11111111");
}
if (dropdownitem.value==1)
{
Debug.Log ("22222222");
}
if (dropdownitem.value==2)
{
Debug.Log ("33333333");
}


This. Getcomponent<image> (). Sprite = Other_img.sprite;
}
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]);
}
}

Supplemental Code Description:


CaptionText and Cationimage as preferences, content display

Here the values after each selection drop-down list are displayed in dropdown, and the text shows that the Imge property of dropdown is always null, so save the image property after each selection and update the assignment again.

You need to convert the attributes of image and Sprite, so we use a third party other_image

If you don't need dropdown to display the image of the drop-down list, just remove the code from the red box above and the code in the update. You can also add a single diagram to the table head, so that the in-game look at the beautiful drop-down list is complete.

PS: Welcome everyone to exchange guidance