Increment Controls

Increment controls allow test takers to increment or decrement a value, which typically affects some facet of a related user interface element (e.g., increment controls are used to change the number of units in the Fraction Model response type.)

The components of an increment control are presented in a row, with the decrement button on the left, a label in the middle, and the increment button on the right.

The label has gray #757575 top and bottom borders.

The buttons have the same presentation and states as primary filled buttons (see the Buttons page for more information), except that only the outer corners are rounded. The decrement button typically has the minus-thin icon, and the increment button typicaly has the plus-thin icon (see the Icons page for more information), though other icons may be used in special cases. When the test taker reaches the minimum or maximum value allowed for a given control, the appropriate button becomes disabled.

The following demo presents the components for the decrement button, label, and increment button assembled in a row.

To view alternative presentations and styling, use the Change Theme and Read Aloud buttons in the upper-right of the screen.