Controls

Controls are common for most scenes. The HP webOS platform offers several types of control designs from check boxes and various buttons to a horizontal slider.

The following table provides additional information with image examples.

Type Description Example
Check box This control turns a value on or off. It appears as a box with two states, unchecked ("off") and checked ("on"). Implemented by using the Mojo.Widget.Checkbox API.

When labeling a check box, use words or phrases that clearly indicate what the on and off state means. For example, "Display alerts" makes sense on a check box because the "on" state means "display alerts" and "off" means "do not display alerts." Use check boxes anywhere in a scene. To display several of them, it helps to display one check box per line in a palm-list control for easy tapping of the check box target.
Button, multi-toggle This is a control that toggles between multiple states. Successive presses cycle through the options. The Music application is a good example. Load some music files, press Shuffle All, and then tap the icon in the lower right-side corner. It toggles between three states: Play all songs once, Repeat all, and Repeat 1 song.
Button, push

Use a push button to trigger an action. After pressing a button, it temporarily appears pressed in and then returns to its not pressed in state. Implemented by using the Mojo.Widget.Button API. There are various types of standard buttons available, such as Primary/Secondary buttons, Affirmative/Negative buttons (for constructive/destructive actions), and so on.

Button, segmented Use a segmented button to offer users a set of options (buttons) where only one may be chosen at a time. Segmented buttons are displayed in a group. Implemented using the Mojo.Widget.RadioButton API.

Examples: In the first segmented button group, the pressed button is SMALL and it appears pressed in with the background and text colors inverted. Pressing another button resets SMALL to the not pressed in state, and that next pressed button appears pressed in. In the second segmented button group, the pressed button is FEMALE.
Button, toggle

This is a control that turns something on or off. They look like traditional switches, and have two states: on and off. Implemented using the Mojo.Widget.ToggleButton API.

When labeling a toggle button, use words or phrases that clearly indicate each state. For example, the label "Wi-Fi" makes sense on a toggle that looks like a switch (you can turn that service on/off).

Slider This is a horizontal slider with a control knob that the user can press and drag to the desired location. Specify the minimum (left side) and maximum (right side) values. Optionally indicate intermediate choices that trigger additional behavior. Implemented using the Mojo.Widget.Slider API.