[CLIK] Populating a List from an INI File

[Matt Doyle]

Populating a scrolling list, drop down, etc. in ActionScript is quite easy. Assuming you have a drop down menu with the instance name "dropDownList", simply use the 'dataProvider' property to fill that list:

dropDownList.dataProvider = ["row1", "row2", "row3", "row4", "row5", "row6", "row7", "row8"];

But most of the time, you'll want to populate your list dynamically via UnrealScript. This is easy enough.

We'll populate our list via a UDK config file, specifically DefaultUI.ini. Open that file, and add this to the bottom. (NOTE: This assumes the class containing your drop down list is called SFMenuTutorial):

[UTGame.SFMenuTutorial]
+ListOptions=(OptionName="Option 1",OptionLabel="Cool",OptionDesc="Something cool.")
+ListOptions=(OptionName="Option 2",OptionLabel="Awesome",OptionDesc="Something awesome.")
+ListOptions=(OptionName="Option 3",OptionLabel="Amazing",OptionDesc="Something amazing.")

Each line represents an option in the list.

OptionLabel will be displayed in the list. The other items are optional. You can include as many items as you wish in each row, as long as you separate them with commas.

Now, in your UnrealScript file that contains the dropdown scrolling list (mine is called SFMenuTutorial), be sure to include the UI file in the config declaration. This is basically the name of the config file minus the "Default" part. In the case of "DefaultUI.ini", use just "UI" like so:

class SFMenuTutorial extends GFxMoviePlayer
	config(UI);

Next, we declare some important variables. The first variable is used as a reference to the actual drop down scrolling list in Flash. The next is a structure - each option in the list is made up of three string variables.

/** The drop down menu */
var GFxClikWidget DropDown;

/** Structure which defines each option in the list. */
struct Option
{
    var string OptionName; 
    var string OptionLabel; // This will be displayed in the list.
    var string OptionDesc;
};

Then we declare an array of this structure type (Option) that will hold each of the options defined in DefaultUI. The array has the keyword "config" added after the "var" keyword to indicate that the data for this array is found in a config file. The data we want is found in any row item named ListOptions in that config file (see above):

/** Aray of all list options, defined in DefaultUI.ini */
var config array<Option> ListOptions;

Next, we initialize the drop down list, assuming the drop down list in Flash has an instance name of "dropDownList":

event bool WidgetInitialized(name WidgetName, name WidgetPath, GFxObject Widget)
{    
    switch(WidgetName)
    {                 
        case ('dropDownList'):
	    DropDown = GFxClikWidget(Widget);
	    SetUpDataProvider(DropDown);
	    break;
        default:
            break;
    }
    return true;
}

Notice we execute the function SetUpDataProvider(), passing it the newly referenced 'DropDown' widget as an argument. That function comes next. Essentially, we create a temporary object (TempObj) to hold the various options found in the ListOptions rows of the config file, and we store each option as an element object in an array called DataProvider. We then assign that array of our option objects (DataProvider) to the "dataProvider" property of the drop down menu using SetObject.:

function SetUpDataProvider(GFxClikWidget Widget)
{
    local byte i;
    local GFxObject DataProvider;
    local GFxObject TempObj;

    DataProvider = CreateArray();

    switch(Widget)
    {
        case(DropDown):
	    for (i = 0; i < ListOptions.Length; i++)
	    {                
                TempObj = CreateObject("Object");
		TempObj.SetString("name", ListOptions[i].OptionName);
		TempObj.SetString("label", ListOptions[i].OptionLabel); // this will be displayed in the list
		TempObj.SetString("desc", ListOptions[i].OptionDesc);
        
		DataProvider.SetElementObject(i, TempObj);
	    }
    }
    Widget.SetObject("dataProvider", DataProvider);   
}

Last of all, be sure to bind the widget for the drop down in the default properties.

defaultproperties
{
    WidgetBindings.Add((WidgetName="dropDownList",WidgetClass=class'GFxClikWidget'))
}

That's all there is to it!

ADDENDUM:

With a drop down list, the number of rows displayed varies automatically. So if you have less than 5 rows of options, say 3, the list only displays 3 rows. At most, it will display 5, which is hardcoded into the class 'DropdownMenu.as', but this value can be changed.

As for a ScrollingList, you must specify the rowCount manually in UnrealScript, like so:

MyScrollingList.SetFloat("rowCount",ListOptions.Length);

[MaVmAn]

Thanks for this tuto, will be helpful for sure.