| Table of Contents |
|---|
Description
ONGOING
Checkboxes are used for a list of options where the user may select multiple options, including all, some or none.
...
The component may be used as a single checkbox in which the user can check/uncheck it or it may be used s a group of joined checkboxes that can be selected at the same time.
Types
...
...
Checkbox group
...
...
Checklist
...
Usage & Behaviour
General guidelines
List check boxes in a logical order, such as grouping highly related options together or placing most common options first, or following some other natural progression. Alphabetical ordering isn't recommended because it is language dependent, and therefore not localizable.
Align check boxes vertically, not horizontally. Horizontal alignment is harder to read.
Label every check box.
Write the label as a phrase or an imperative sentence, and use no ending punctuation.
The default view of a set of checkboxes is having no option selected.
...
A single checkbox - an individual choice
independent choices (zero or more) - users can select any combination of options in a group of checkboxes
Master type checkbox which controls other checkboxes' states.
Dependent choices where at least 1 option must be selected Hierarchy structure in which the parent has an indeterminate state(future TBD)
States
The checkbox control allows 3 modes:
...
For each if the modes, you can find the different states below:
...
Interaction
Clicking a checkbox toggles between the states of the checkbox.
Within a group of checkboxes, each checkbox can be checked or unchecked. The user can check multiple options.
Users should be able to select the checkbox by clicking on the box directly or by clicking on its label. The touchable area for toggling the checkbox ends where the text ends.
The default view of a set of checkboxes is having no option selectedis this so?.
...