[ Previous | Next | Contents | Glossary | Home | Search ]
Motif and CDE 2.1 Style Guide Reference

Spin Box (Control)

Reference

Description

A spin box displays related but mutually exclusive choices that have a natural sequence or that increase or decrease. A spin box can control multiple fields with a single set of spin arrows to change choices in each field. Figure 64 shows a spin box.

A spin button is a spin box that consists of a single field.

Figure 64. Spin Box.




View figure.

When to Use

Recommended
Use a spin box to allow a user to select a value from a familiar sequence of values that has a logical consecutive order, for example, months in a year or days in a month.

Recommended
Use a spin box only for familiar or naturally understood sequences of values, since the user has no way to see more than the value choice that is currently displayed in a field of the spin box.

Recommended
Use a spin box with multiple fields when the fields are related and each field is used to choose a value from a familiar natural sequence (such as days, months, and years).

Guidelines

Required
A spin box should consist of a pair of arrow buttons, plus one or more fields, each of which allow a user to choose among one of a mutually exclusive set of values.

Required
Each field in a spin box should be either a text-entry field, a text-display field, or a label, and always takes focus (even when it is a label).

Required
The arrow buttons in a spin box should represent action choices whose actions spin some field in the spin box. The arrow buttons do not take focus.

Required
The pair of arrow buttons in a spin box should be either horizontal (one points left and one points right) or vertical (one points up and one points down).

Required
If a spin box contains multiple fields, make either all of them tab groups or none of them.

Required
If a spin box is a tab group, then allow the user to use tab group navigation to move focus to the field in the spin box that last had focus.

Recommended
If a spin box guideline requires moving focus to or changing the value of a specified field that cannot be determined (for example, no field in the spin box previously had focus), use the most significant field of the spin box instead.

Recommended
Allow text entry to be used only as a shortcut for choosing a value, not as the only means of entering a value.

Required
When an explicit focus policy is in use and focus is on the spin box and the user presses the SELECT button on one of the arrow buttons, change the value of the field in the spin box that has focus.

Required
When an explicit focus policy is in use and focus is not in the spin box and the user presses the SELECT button on one of the arrow buttons, change the value of the field in the spin box that last had focus and move focus to it.

Required
When an implicit focus policy is in use and the user presses the SELECT button on one of the arrow buttons in the spin box, change the value of the field in which the user last pressed SELECT.

Required
When the user presses the SELECT button on a left- or upwards-pointing arrow, spin backwards through values in the designated field; on a right- or downwards-pointing arrow, spin forward through the values.

Required
Spinning forward through the legal values of a spin box field works in the following ways:

  1. When the values are ordered chronologically, moving forward moves to the next value chronologically. For example, if TUESDAY is currently displayed, display WEDNESDAY when the user presses the right or down arrow.

  2. When the values are ordered alphabetically, moving forward moves to the next value in lexicographic order. For example, for a field used to pick a font from an alphabetically organized list, if CHICAGO is currently displayed, display COURIER when the user presses the right or down arrow.

  3. When the values represent numbers or magnitudes, moving forward moves to a larger value or magnitude. For example, if 15 is currently displayed, display 16 when the user presses the right or down arrow.

    4. Recommended
    Allow the arrow buttons in a spin box to autorepreat.

    Required
    If a spin box uses horizontal arrows and it has focus, allow > and < to spin forward and backward, respectively, through the field that has focus.

    Required
    If a spin box uses horizontal arrows and contains a text-entry field, allow the user to enter and delete characters at the end of that field, but do not allow < and > to move the cursor through the field.

    Required
    If a spin box uses horizontal arrows, then allow Home and End to spin the field that has focus to its first or last legal value, respectively.

    Required
    If a spin box uses horizontal arrows and is a tab group or contains multiple fields (all of which are tab groups), then ^ should have the same effect as < and V should have the same effect as >.

    Required
    If a spin box uses horizontal arrows and contains multiple fields (none of which are tab groups), then allow Ctrl < and Ctrl > to move focus among the fields, wrapping at the edges.

    Required
    If a spin button has vertical arrows and contains a text field, it is a tab group.

    Required
    If a spin box uses vertical arrows and contains multiple fields, then either the spin box is a tab group or all of the fields are tab groups.

    Required
    If a spin box uses vertical arrows, then when focus is in the spin box, allow V and ^, respectively, to spin forward and backward through the field that has focus.

    Required
    If a spin box uses vertical arrows, then allow Ctrl Home and Ctrl End to spin the field that has focus to its first or last legal values, respectively.

    Required
    If a spin box uses vertical arrows, contains multiple fields (none of which are tab groups), and focus is on a field that is a label, allow < and > to move focus to the next field to the left or right, respectively, wrapping at the ends of the spin box.

    Recommended
    If a spin box uses vertical arrows and contains multiple fields (none of which are tab groups), allow Ctrl < and Ctrl > to move focus to the next field to the left or right, respectively, wrapping at the ends of the spin box.

    Recommended
    When a spin box contains multiple fields, allow the values acceptable in one field to depend upon the value of another field, when appropriate. For example, if the month field is April, allow the day field to be limited to the values 1 to 30.

    Recommended
    When the user changes the value in one field, causing the value in another field to become illegal, do not change the value in the dependent field either at all or until the user has moved the pointer or focus off of the element used to change the value. For example, if the user pressed an arrow button to change the month from April to May, change the day value from 30 to 31 only after the user moves the pointer away from the arrow buttons.

    Recommended
    When the user changes the value of a field via an arrow button or a directional key, wrap between the first and last value acceptable for that field.

    Optional
    When a value wraps forward or backward in one field of a spin box, allow it to change the value in the next most significant field forward or backward. For example, changing the day from 30 to 1 can change the month from April to May.

    Recommended
    When horizontal arrows are used, make each of them the height of the fields of the spin box and either place both of them at one side of the spin box or place the left-pointing arrow at the left end and the right-pointing arrow at the right end.

    Recommended
    When vertical arrows are used, place the upward-pointing arrow above the downward-pointing arrow, and place them at one end of the spin box.

    Recommended
    When no field within the spin box has focus, provide some form of emphasis to indicate which field would change value if the user pressed the SELECT button on one of the arrow buttons. It is acceptable to show this emphasis only when the pointer is within the spin box.

    Essential Related Topics

    For more information, see the Control and Text-Entry Field (Control) reference pages.

    Supplemental Related Topics

    For more information, see the Drop-Down Combination Box (Control) and Drop-Down List (Control) reference pages.

    [ Previous | Next | Contents | Glossary | Home | Search ]