Skip to main content
Sliders
Updated over a week ago

Play’s slider element lets you add & customize Apple’s native slider. A slider is a control to adjust a value within a range.

Anatomy of a Slider

There are two parts to a slider element: the thumb and the track. The thumb (or knob) is the circle that you drag to a position on the slider. The track is the line that the thumb drags along.

The track is broken into two sections by the thumb. Any track to the left of the thumb is the min. Any track to the right of the thumb is the max.

If the slider’s start value equals the min value or the max value, the min or max, respectively, will not be visible until you slide the thumb.

Slider Values

There are four values for a slider that you can adjust in Play: start, step, min, and max.

The Start Value is the slider’s value when it has not yet been interacted with. It will be reflected in the original output text and the position of the slider’s thumb.

The Step Value is the increment between each number in the range.

The Min Value is the bottom of the slider’s range. It will be displayed when the slider is all the way to the left.

The Max Value is the top of the slider’s range. It will be displayed when the slider is all the way to the right.

Symbols

You can select a Min Symbol and a Max Symbol for your slider. The Min Symbol will appear to the left of the slider, and the Max Symbol will appear to the right. You can select any symbols and adjust their size, scale, and weight.

Round To

Use the Round To attribute to choose the number of decimal places displayed in the output text. You have the option between a whole number, one decimal, or two decimals.

Customize

Click on the Customize property to open a popup where you can choose the color of the min, max, knob, and symbols from your list of Color styles.

Did this answer your question?