Menu
Home
Log in / Register
 
Home arrow Computer Science arrow Learn BlackBerry 10 App Development
< Prev   CONTENTS   Next >

CheckBox and ToggleButton

Check boxes and toggle buttons enable users to select options. Both controls inherit from

AbstractToggleButton and share the following attributes:

n You can use the checked property to determine the state of the toggle control.

n You can handle the checkedChanged signal to capture state changes.

CheckBox

A CheckBox control has two states: checked or unchecked. You can also optionally display some text beside the check box explaining its purpose. If you include some text, it will always be left-aligned, and the check box will be right-aligned (see Figure 4-14).

Figure 4-14. CheckBox

Listing 4-20 shows you how to handle check box states in QML.

Listing 4-20. CheckBox

CheckBox {

id: checkbox checked: true text: "Checkbox"

onCheckedChanged: {

console.log("checkbox state: " + checkbox.checked)

}

}

In practice, use check boxes when users can select multiple items or options, which are not mutually exclusive.

ToggleButton

A toggle button is a kind of switch control, which can, for example, represent On/Off states (see Figure 4-15). Signal handling is identical to a check box.

Figure 4-15. CheckBox

You should use a toggle button when users can switch between two mutually exclusive options, such as On and Off.

ScrollView

A ScrollView is a container allowing the scrolling and zooming of its content. A ScrollView provides a viewport, which displays an area of the entire content. You can use a ScrollView when the content will not fit the UI entirely (for example, that would be the case if a container included many controls).

Note that a ScrollView's content can also be an ImageView or a WebView (for example, you can use a ScrollView to zoom in or out of a picture). You can control the scrolling behavior by setting the ScrollView's scrollViewProperties property. Listing 4-21 shows you how to include a WebView in a ScrollView.

Listing 4-21. ScrollView

Page {

ScrollView {

WebView {

url: "apress.com"

}

scrollViewProperties {

scrollMode: ScrollMode.Vertical pinchToZoomEnabled: true

}

}

}

Use a ScrollView when

n A control's content does not fit the screen and you need to provide a viewport that you can navigate (by scrolling horizontally and/or vertically).

n You need to zoom in or out of content using a pinch gesture.

System Dialogs, Prompts, and Toasts

You can use the system dialog controls to pause your application flow and communicate important information to the user. System dialogs can be used to ask the user to confirm an action, notify the user of an event, or prompt the user for additional information.

 
Found a mistake? Please highlight the word and press Shift + Enter  
< Prev   CONTENTS   Next >
 
Subjects
Accounting
Business & Finance
Communication
Computer Science
Economics
Education
Engineering
Environment
Geography
Health
History
Language & Literature
Law
Management
Marketing
Philosophy
Political science
Psychology
Religion
Sociology
Travel