ListPicker Component

Properties

backgroundColor
  Specifies the ListPicker's background color as an red-green-blue-alpha RRGGBBAA or red-green-blue RRGGBB string. If an Image has been set, the color change will not be visible until the Image is removed.
Data type: color
Designer Writable true <listpicker name="listpickerName" backgroundColor="FF223aab">
Code Writeable true listpickerName.backgroundColor = "FF223aab"
Code Readable true let variable = listpickerName.backgroundColor

elements
  Specifies the list of choices to display. This is in the form of an array of strings e.g. ['e4', 'e5', 'e6']
Data type: array
Designer Writable false
Code Writeable true listpickerName.elements = e4,e5,e6
Code Readable true let variable = listpickerName.elements

elementsFromString
  Set the list of choices from a string of comma-separated values.
Data type: string
Designer Writable true <listpicker name="listpickerName" elementsFromString="el1,el2,el3">
Code Writeable true listpickerName.elementsFromString = "el1,el2,el3"
Code Readable false

enabled
  Specifies whether the ListPicker should be active and clickable.
Data type: boolean
Designer Writable true <listpicker name="listpickerName" enabled="true">
Code Writeable true listpickerName.enabled = true
Code Readable true let variable = listpickerName.enabled

fontBold
  Specifies whether the text of the ListPicker should be bold. Some fonts do not support bold.
Data type: boolean
Designer Writable true <listpicker name="listpickerName" fontBold="true">
Code Writeable true listpickerName.fontBold = true
Code Readable true let variable = listpickerName.fontBold

fontItalic
  Specifies whether the text of the ListPicker should be italic. Some fonts do not support italic.
Data type: boolean
Designer Writable true <listpicker name="listpickerName" fontItalic="true">
Code Writeable true listpickerName.fontItalic = true
Code Readable true let variable = listpickerName.fontItalic

fontSize
  Specifies the text font size of the ListPicker, measured in sp(scale-independent pixels).
Data type: number
Designer Writable true <listpicker name="listpickerName" fontSize="24">
Code Writeable true listpickerName.fontSize = 24
Code Readable true let variable = listpickerName.fontSize

fontTypeface
  Specifies the text font face of the ListPicker as 'serif', 'sans serif', or 'monospace'.
Data type: string
Designer Writable true <listpicker name="listpickerName" fontTypeface="monospace">
Code Writeable false
Code Readable false

height
  Specifies the ListPicker's vertical height, measured in pixels.
Data type: number
Designer Writable false
Code Writeable true listpickerName.height = 200
Code Readable true let variable = listpickerName.height

heightPercent
  Specifies the ListPicker's vertical height as a percentage of the Screen's Height.
Data type: number
Designer Writable false
Code Writeable true listpickerName.heightPercent = "50%"
Code Readable false

image
  Specifies the path of the ListPicker's image. If there is both an Image and a BackgroundColor specified, only the Image will be visible.
Data type: string
Designer Writable true <listpicker name="listpickerName" image="cat.png">
Code Writeable true listpickerName.image = "cat.png"
Code Readable true let variable = listpickerName.image

itemBackgroundColor
  The background color of the ListPicker items.
Data type: color
Designer Writable true <listpicker name="listpickerName" itemBackgroundColor="FF22f54f">
Code Writeable true listpickerName.itemBackgroundColor = "FF22f54f"
Code Readable true let variable = listpickerName.itemBackgroundColor

itemTextColor
  The text color of the ListPicker items.
Data type: color
Designer Writable true <listpicker name="listpickerName" itemTextColor="FF745c33">
Code Writeable true listpickerName.itemTextColor = "FF745c33"
Code Readable true let variable = listpickerName.itemTextColor

selection
  The selected item. When directly changed by the programmer, the SelectionIndex property is also changed to the first item in the ListPicker with the given value. If the value is not in Elements, SelectionIndex will be set to 0.
Data type: string
Designer Writable true <listpicker name="listpickerName" selection="el1">
Code Writeable true listpickerName.selection = "el1"
Code Readable true let variable = listpickerName.selection

selectionIndex
  Selection index property setter method.
Data type: number
Designer Writable false
Code Writeable true listpickerName.selectionIndex = 0
Code Readable true let variable = listpickerName.selectionIndex

shape
  Specifies the shape of the ListPicker. The valid values for this property are 'round', 'rectangle' and 'oval'. The Shape will not be visible if an Image is used.
Data type: number
Designer Writable true <listpicker name="listpickerName" shape="round">
Code Writeable false
Code Readable false

showFeedback
  Specifies if a visual feedback should be shown when a ListPicker with an assigned Image is pressed.
Data type: boolean
Designer Writable true <listpicker name="listpickerName" showFeedback="true">
Code Writeable true listpickerName.showFeedback = true
Code Readable true let variable = listpickerName.showFeedback

showFilterBar
  If true, the ListPicker will show a search filter bar.
Data type: boolean
Designer Writable true <listpicker name="listpickerName" showFilterBar="true">
Code Writeable true listpickerName.showFilterBar = true
Code Readable true let variable = listpickerName.showFilterBar

text
  Specifies the text displayed by the ListPicker.
Data type: string
Designer Writable true <listpicker name="listpickerName" text="Test text">
Code Writeable true listpickerName.text = "Test text"
Code Readable true let variable = listpickerName.text

textAlignment
  Specifies the alignment of the ListPicker's text. Valid values are 'left', 'right' and 'center'
Data type: string
Designer Writable true <listpicker name="listpickerName" textAlignment="center">
Code Writeable false
Code Readable false

textColor
  Specifies the text color of the ListPicker as an red-green-blue-alpha RRGGBBAA or red-green-blue RRGGBB string.
Data type: color
Designer Writable true <listpicker name="listpickerName" textColor="FF778c08">
Code Writeable true listpickerName.textColor = "FF778c08"
Code Readable true let variable = listpickerName.textColor

title
  Optional title displayed at the top of the list of choices.
Data type: string
Designer Writable true <listpicker name="listpickerName" title="Test title">
Code Writeable true listpickerName.title = "Test title"
Code Readable true let variable = listpickerName.title

visible
  Specifies whether the ListPicker should be visible on the screen. Value is true if the ListPicker is showing and false if hidden.
Data type: boolean
Designer Writable true <listpicker name="listpickerName" visible="true">
Code Writeable true listpickerName.visible = true
Code Readable true let variable = listpickerName.visible

width
  Specifies the horizontal width of the ListPicker, measured in pixels.
Data type: number
Designer Writable false
Code Writeable true listpickerName.width = 280
Code Readable true let variable = listpickerName.width

widthPercent
  Specifies the horizontal width of the ListPicker as a percentage of the Screen's Width.
Data type: number
Designer Writable false
Code Writeable true listpickerName.widthPercent = "95%"
Code Readable false

class
  The styling class of the the component
Data type: string
Designer Writable true <listpicker name="listpickerName" class="Test class">
Code Writeable false
Code Readable false

id
  The styling id of the the component
Data type: string
Designer Writable true <listpicker name="listpickerName" id="Test id">
Code Writeable false
Code Readable false

name
  The name of the component that will be used to refer to it in code.
Data type: string
Designer Writable true <listpicker name="listpickerName" name="testComponent">
Code Writeable false
Code Readable false

Methods

Method name Description Parameters
open Opens the ListPicker, as though the user clicked on it.
listpickerName.open()
addEventListener Method used to create event listeners.
See Events below for samples.
eventName string
eventCallbackFunction callback

Events

Event name Description Parameters
afterPicking Event to be raised after the ListPicker activity returns its result and the properties have been filled in.
listpickerName.addEventListener(
    "afterPicking",
    function () {
        //Your code here
    }
)
beforePicking Event to raise when the ListPicker is clicked or the picker is shown using the Open method. This event occurs before the picker is displayed, and can be used to prepare the picker before it is shown.
listpickerName.addEventListener(
    "beforePicking",
    function () {
        //Your code here
    }
)
gotFocus Indicates the cursor moved over the ListPicker so it is now possible to click it.
listpickerName.addEventListener(
    "gotFocus",
    function () {
        //Your code here
    }
)
lostFocus Indicates the cursor moved away from the ListPicker so it is now no longer possible to click it.
listpickerName.addEventListener(
    "lostFocus",
    function () {
        //Your code here
    }
)
touchDown Indicates that the ListPicker was pressed down.
listpickerName.addEventListener(
    "touchDown",
    function () {
        //Your code here
    }
)
touchUp Indicates that the ListPicker has been released.
listpickerName.addEventListener(
    "touchUp",
    function () {
        //Your code here
    }
)