How do I use the Picker View on mobile?
This lesson describes how LiveCode menus can be represented and used on mobile. Screen captures are provided.
Introduction
In a desktop environment menus (option menus, pulldown menus, combo boxes and popup menus) provide an expanding list from which an item can be selected. On mobile devices a different user interface philosophy is used.
On mobile menus are represented by a native Picker View. This is created by the mobilePick command.
Creating an Picker View
- Button - "countryPicker"
- Entry Field - "countryChoice"
- Scrolling field - "countryList". This field is provided for reference only and list the options used in the picker.
Set the script of the button to
on mouseUp
local tIndex
// Show the picker
mobilePick field "countryList"
// The result is the line index of the selected item
put the result into tIndex
// Show the country with the chose index
put line tIndex of field "countryList" into field "countryChoice"
end mouseUpNative Picker Controls
Deploy your app onto a mobile device and click on the button. A native Picker View opens allowing the user to choose from the provided options.
Using an Option Menu
LiveCode Option Menus will automatically show a native mobile picker when deployed to a mobile device.
- Option Menu - "countryPicker"
- Set the Menu Items property to the list of countries
- Entry Field - "countryChoice"
Set the script of the Option Menu to
on menuPick pItemName
put pItemName into field "countryChoice"
end menuPickThe label of the Option Menu will be automatically set to the chosen item.
How do you use UTF text in a Picker View??