Picker

It allows user to pick a customized value that defined by app creator.

Usage

In most of the cases, we simply use "Picker" component to show a list of customized value to allow user select a suitable input and identify the data by storage name. It allows you to get back the user input data by typing ${ NAME YOU DEFINED IN STORAGE NAME } in anywhere of the app.

Action [ Created | Selected ]

Simply click the action you want to define and drag components inside.

Created:

Mostly used to define further UI design within the Picker.

Selected:

It's used to define action when user selected a value.

Example

Reload a "Text" component (*Be reminded that you should set a alias to that "Text" component first) displayed on screen when user selected a value. The logic is showed below. ( ) is used to define the action we selected and [ ] is used to define the properties we set:

Picker -> (Selected) -> Reload Action [Action: TEXT ALIAS]

Properties

Simply click a gear on the right hand corner of related "Range" component to edit the properties.

Data source - Used to define customized label and value for user selection. Simply use “,” to separate each set of label and value. E.g. 1,2,3,4,5.

For advance usage, You can use “:” to set label and value. Label is used to define text displayed to user and value is used to define an actual text. E.g. Totally agree:1, Agree:2, Normal:3, Disagree:4, Totally disagree:5

Label Key - Useful when the data source is JSON format. It used to define the key from JSON to be the label.

Value Key - Useful when the data source is JSON format. It used to define the value from JSON to be the label.

Selected Value - Preconfigured a value selected.