About the NumericStepper component

The NumericStepper component allows a user to step through an ordered set of numbers. The component consists of a number displayed beside small up and down arrow buttons. When a user pushes the buttons, the number is raised or lowered incrementally. If the user clicks either of the arrow buttons, the number increases or decreases, based on the value of the stepSize parameter, until the user releases the mouse or until the maximum or minimum value is reached.

The NumericStepper only handles numeric data. Also, you must resize the stepper while authoring to display more than two numeric places (for example, the numbers 5246 or 1.34).

A stepper can be enabled or disabled in an application. In the disabled state, a stepper doesn't receive mouse or keyboard input. An enabled stepper receives focus if you click it or tab to it and its internal focus is set to the text box. When a NumericStepper instance has focus, you can use the following keys control it:

Key

Description

Down

Value changes by one unit.

Left

Moves the insertion point to the left within the text box.

Right

Moves the insertion point to the right within the text box.

Shift + Tab

Moves focus to the previous object.

Tab

Moves focus to the next object.

Up

Value changes by one unit.

For more information about controlling focus, see Creating custom focus navigation or FocusManager class.

A live preview of each stepper instance reflects the value of the value parameter indicated by the Property inspector or Component Inspector panel while authoring. However, there is no mouse or keyboard interaction with the stepper buttons in the live preview.

When you add the NumericStepper component to an application, you can use the Accessibility panel to make it accessible to screen readers. First, you must add the following line of code to enable accessibility:

mx.accessibility.NumericStepperAccImpl.enableAccessibility();

You only enable accessibility for a component once no matter how many instances you have of the component. For more information, see Creating Accessible Content.