Pickers

Pickers are used to present a common UI for selecting inputs in a variety of application scenarios. Mojo offers pickers for common objects such as a date, time, or number, or to select files.

The next section covers the first three pickers, since they are conventional widgets and are very similar to each other. After that, we will look at the File picker. It’s accessed through function calls, and is actually implemented as a separate application wrapped with a framework interface.

Simple Pickers

The models for the date, time, and integer pickers are very similar. The pickers are declared within your scene’s view file and wrapped with styling divs as shown here:

<div class="palm-group unlabeled">
  <div class="palm-list">
    <div id="DatePkrId" x-mojo-element="DatePicker"></div>
  </div>
</div>

This creates a picker that spans the width of the screen and is enclosed with an unlabeled group frame (as shown in Figure 5-6).

A Date Picker widget example

Figure 5-6. A Date Picker widget example

These pickers present choices as a linear sequence of values that wraps around; when you scroll to the end of the sequence, they simply continue back at the beginning. There’s no way to override this behavior.

Date pickers

As shown in Figure 5-6, a date picker allows selection of month, day, and year values. The Date picker’s model has a single property, named date by default, which should be assigned a JavaScript Date object. ...

Get Palm webOS now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.