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 Option Menu

Creating an Option Menu
  • Option Menu - "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 option menu to

on mouseUp
   mobilePick field "countryList"
   put the result into field "countryChoice"
end mouseUp

Native Picker Controls

iPhone Option Menu Support

Deploy your app onto a mobile device and clck on the menu. A native Picker View opens allowing the user to choose from the provided options.

4 Comments

dirk

How do you use UTF text in a Picker View??

Hanson Schmidt-Cornelius

Hi Dirk,

you can create Unicode entries for the picker wheel by entering Unicode text into the "Menu Items" field of the "Property Inspector". This even allows you to copy and paste a sequence of Unicode text.

Kind Regards,

Hanson

dirk

Thanks Hanson, I was trying to build it from a script - which failed. But yours works of course! :-)

However, can you tell me how to use one of the unicode items that is then picked? It seems to me to return garbage text - eg when I have "Japanese" actually in Japanese in the contents of the option menu, how can I then know when that has been selected? Using "on menuPick pItem" - pItem is non-recognisable.

Any possibility to have a "hidden" column with a corresponding code or some other possibility? eg. returning the line number that was selected?

Or any other suggestions? Thanks!

Hanson Schmidt-Cornelius

Hi Dirk,

if you implement the picker using the "Option Menu" the label of the button is updated with the unicode entry you selected. The "menuPick" event is also passed the option you selected. Indexes to an item are not provided here. A second column with indexes is also not available here.
If you implement the picker programmatically using "mobilePick", then you are returned the item number that corresponds to the item you selected.

In terms of handling unicode, have a look at the dictionary and search for "unicode". You will find a number of entries that allow you to convert between text and Unicode or even put a unicode item somewhere.

Kind Regards,

Hanson

Add your comment

E-Mail me when someone replies to this comment