Skip to main content

List

Element type: Dictionary

Shows several values to the end user in a pop-up menu for them to chose from. The variable value will be the selected item among the items you provided. The type of the value will depend on the ones you specified.

Keys​

NameTypePossible valuesRequired
TypeStringInputRequired
InputTypeStringListRequired
VariableString-Required
LabelString-
LabelFontConfigurationDictionary (Font)-
DistributionStringFit, Center
PercentWidthNumber0...1
AlignmentStringLeft, Center, Right
WidthNumber-
ItemsArray(String) or Array(Number)Required
ValidationDictionary
MarginsDictionary (Margins)-
BorderDictionary (Border)-
Condition PRODictionary (Condition)-

Detail​

Type Required​

Type: String
Explanation: The type of the component has to be Input.

InputType Required​

Type: String
Explanation: The type of the component which has to be List.

Variable Required​

Type: String
Explanation: The variable used within the application and as a key in the input file Octory will create to let you retrieve the user inputs.

Label​

Type: String
Explanation: The label lets you give some insight to the end user about the value they need to enter. Its text will generally be placed on the left side of the input field.

info

If you do not specify a label, the input field will be centered. To keep the alignment with other input components which have a label, give the Label a whitespace for value.

LabelFontConfiguration​

Type: Dictionary (Font)
Explanation: Let you specify the font configuration to use. Default is "DefaultPrimary" if specified in the Font styles in the configuration file, or system font otherwise.

Distribution​

Type: String
Possible values: Fit, Center
Default: Center
Explanation: Specify how the label and the input field are stacked.

  • Fit gives them as much space as they need, but the input component will not be aligned with the other ones.
  • Center align the label and the input field in the horizontal middle of its container. This allows several input components to be aligned, although it may crop the text label.

PercentWidth​

Type: Number
Possible values: 0...1
Explanation: This value allows you to give more width to an input component, by specifying the percentage width it should take in its container. Default is most often 0.4.

Alignment​

Type: String
Possible values: Left, Center, Right
Availability: 3.1.0+
Explanation: Moves the label and the control together, as a single cluster, to the chosen edge of the row.

info

This key has no default. When it is absent, the input keeps the historical placement driven by Distribution and PercentWidth, so existing configurations are unchanged.

Alignment is independent from Distribution: Distribution decides how wide the label and the control are, Alignment decides where that cluster sits in the row. Note that a labeled input using Distribution set to Center keeps its right aligned label only while Alignment is absent.

Width​

Type: Number
Availability: 3.1.0+
Explanation: A fixed width for the menu, in points. An item title too long for that width is truncated inside the menu.

info

Width takes precedence over both the Fit sizing of Distribution and the fraction given by PercentWidth. Giving the same Width to several List inputs is how you get menus that all render at exactly the same size, whatever their longest item.

Items Required​

Type: Array(String) or Array(Number)
Explanation: Array of choices to propose to the end user. All the values need to have the same type to let Octory infer it. You can chose an array of String or Number. If Number is chosen, you can write Int or Real values, but you cannot mix them.

Validation​

Type: Dictionary
Explanation: Let you force the user to choose a value in a List input component.

Input Text Validation​

NameTypeRequired
WarningTextString
FontConfigurationDictionary (Font)
InstructionStringRequired

WarningText​

Type: String
Explanation: The text to display to the user when the input is empty or its value is incorrect. Default is "Incorrect or empty value".

FontConfiguration​

Type: Dictionary (Font)
Explanation: The font configuration to use for the warning text.

Instruction Required​

Type: String
Explanation: The text to display as an instruction to the user. This text will disappear when the user has selected an item.

Margins​

Type: Dictionary (Margins)
Explanation: Add padding to the component's sides.

Border​

Type: Dictionary (Border)
Explanation: Add a top or bottom border to a component.

Condition PRO​

Type: Dictionary (Condition)
Explanation: Allows to hide or show the component using a boolean expression.

Example​

List input component to choose a value among {Apprentice, Intermediate, Master, Expert, Legend} and a validation which prevents the user from going to the next slide until he has selected an item. A "Choose" instruction is displayed at first.

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
<!-- ... -->
<key>Slides</key>
<array>
<dict>
<key>Containers</key>
<array>
<dict>
<key>Components</key>
<array>
<dict>
<key>Type</key>
<string>Input</string>
<key>InputType</key>
<string>List</string>
<key>Variable</key>
<string>UserLevel</string>
<key>Items</key>
<array>
<string>Apprentice</string>
<string>Intermediate</string>
<string>Master</string>
<string>Expert</string>
<string>Legend</string>
</array>
<key>Validation</key>
<dict>
<key>WarningText</key>
<string>Please choose a value</string>
<key>Instruction</key>
<string>Choose</string>
</dict>
</dict>
</array>
</dict>
</array>
</dict>
</array>
<!-- ... -->
</dict>
</plist>