You are here:
ImageSelector Control
The ImageSelector element defines a list-type UI control that displays images with labels and a user can select an image.
Required Editions
| Available in: Enterprise, Performance, and Unlimited Editions |
The table lists the ImageSelector attributes.
| Attribute | Description | Data Type | Required |
|---|---|---|---|
| name | Identification of this image selector. | String | yes |
| type | The type of the image selector. | string [FilterElement] | yes |
| dataSource | The data is linked to the image selector. | Any list data where the list elements contain a reference to an image. | yes |
| filter | Defies the ImageSelector as Master Control in a MasterDetailSectionPage. | boolean | no, defaults to false |
The ImageSelector element contains these sub-elements.
- Bindings
- Resource
- Events
Bindings
The Bindings node consists of Binding elements that can be used in the ImageSelector Control element.
| Attribute | Description | Type | Binding Source | |
|---|---|---|---|---|
| Image | The attribute in the list entries that points to the image resource. | Image | Any image resources available in the project | yes |
| Text | The attribute in the list entries that points to a text resource. displays as a label for the images | Text | Any label resource available in the project or an arbitrary string. | no, defaults to no text displayed |
| Info | The attribute in the list entries that points to an additional information resource. displays as floating text over the image. | Text | Any label resource available in the project or an arbitrary string. | no, defaults to no info displayed |
Resource
The ImageSelector Resource node consists of resource elements that can be used in the ImageSelector control element. The table list the attributes of the ImageSelector Items node
| Attribute | Description | Value or Pattern |
|---|---|---|
| target | Describes the actual UI element. | string [RootLabel] |
| type | Defines how the resource is shown. | string [Label] |
| Id | The ID is used to map the localized resource and the actual element in the UI. | string |
| defaultLabel | One default value can be set, depending on the type, that is, defaultText, defaultLabel, and defaultImage. | string |
| bindingMode | Only applies if type = Label. Determines whether a long line of text is wrapped (true) or trimmed (false). | string [One Way] |
Events
The ImageSelector Events node consists of the event elements that can be used in the ImageSelector control element. ItemSeletedEvent is triggered when an offline mobile app user tap on an image.
Sample XML Code.
<ImageSelector name="ImageSelectorCtrl" type="FilterElement" dataSource="dataSource" filter="true">
<Items>
<Bindings>
<Binding target="Image" type="Image" binding="imageBinding" bindingMode="ONE_WAY" />
<Binding target="Text" type="Text" binding="textBinding" bindingMode="ONE_WAY" />
<Binding target="Info" type="Text" binding="infoBinding" bindingMode="ONE_WAY" />
</Bindings>
</Items>
<Events>
<ItemSelectedEvent event="filterSelected">
<Params>
<Param name="filterCode" value="value" />
</Params>
</ItemSelectedEvent>
</Events>
</ImageSelector>Did this article solve your issue?
Let us know so we can improve!
