Image Lists define the options that are available to the User in Image Selection Fields. This Field type cycles through different values when the User clicks on the image and each of the images has an associated value that is then stored against the individual image Field. An example would be to use an Image Selection Field to set a value for confidence using custom images for the values Low, Medium and High. Here for example, the values could be 1, 2 and 3 respectively.
Once an Image List has been created it will be stored globally which means that you will be able to choose these selection options for multiple Fields across multiple Apps.
Accessing the Image Lists via Settings
To view the Image Lists for a site, first go to the Launchpad and select the COG Menu. Then select the 'Image List' App from the selection below.
To edit the options in an existing Image List click its row from the List of all existing items and click the '+' to add an option or the 'x' to remove an option. To create a new Image List, click on '+ New Record' below 'Image List'. If it is a new Image List then it MUST have an Identifier, a Name and at least one option.
Identifier: This is a value assigned so that the system has a unique reference to the Selection Options you are creating.
Name: The name is how you will recognise the Image List for selection when assigning it to an Image List Field.
Accessing Image Lists via AppStudio
Naturally you must first be in the AppStudio side of your site (note this may not be something you have access to depending on your account permissions). Once here it is from the Home level of AppStudio that you will see 'Select Lists' on the left hand side. Clicking on this will take you to a list of all Selections for your site where you can then drill down into them and edit as desired.
Adding the Selection Options
On the Image List edit page you will be able to choose what values are assigned to the individual option Fields. Click on the '+' or 'Add' In AppStudio to add options and you will need to enter four values for each.
Title: This is the friendly name for the option that will be shown to the User when they hover over the image on the input screen. It may also be used in Reporting as the friendly name for the selection made.
Value: The value is what is stored against the Field in the database when the Image has been selected.
Note: In our example here, the User has scored the confidence on a scale of 1 to 3 but the Title for each option is the friendly name of Low, Medium & High.
Note: Please also note that while the value of a particular image may be numeric, the value stored is a text value, so if you need to use this value in an expression then you need to convert it to a number within the expression, e.g.
IF(Int([Confidence]) >=2, 'Great', 'Bad')
Image: Now set the image that is going to be displayed that represents the value. You have the option of selecting from one of the Images that you have uploaded to the Image List Assets folder or you can upload a new Image (see here.)
Display Order: The display order is the order that the selection options appear in. If no Display Order has been set then the options will display in the order that they were added. To specify a Display Order assign each selection option a numeric value. They will display first to last in the selection based on lowest number first.
If you want to remove a selection item then this can be done by clicking on the cross on the right of the selection option.
Display Order in AppStudio:
Use a drag and drop method as shown below by clicking and dragging the ordering tiles onto one another to order the Image Selection.
Note: Display Orders have to be whole integers. Therefore, it is good practice to assign Display Orders in multiples of 10 as this leaves room to add future options in specific places. This avoids the need to re-assign all Display Orders like if they are consecutive (1, 2, 3, 4 etc) as if I wanted to add an option between 2 and 3 I can't as 2.5 isn't a recognised Display Order value.
Adding the Image List to a Field - Configuration Article
Having created the Selection Options, these can now be assigned to a Field. For the Field Type ImageList, it will let you choose from the list of globally stored selection options. After choosing the correct Image List for the Field, you can then specify the size that it should appear with the options of Small, Medium and Large.
You also have the option of defining the Image List at this point by clicking on the edit pencil icon to the right of selection options. It will pop open a pane with the option to choose an Image List to update or create a new Image List by selecting 'Select an item...; from the 'Image List' drop-down.