Continuous
A free-moving thumb across the default 0..1 range.
var value by remember { mutableStateOf(0.5f) }
Slider(value = value, onValueChange = { value = it })
Text("Value: ${(value * 100).roundToInt()}%")Slider
Continuous, stepped, and range sliders
Sliders let people select a value or range from along a track. They support continuous motion, discrete steps within a range, and a two-thumb range variant.
Examples
Stepped
steps places discrete tick marks inside the value range.
var value by remember { mutableStateOf(2f) }
Slider(
value = value,
onValueChange = { value = it },
valueRange = 0f..10f,
steps = 9
)
Text("Step: ${value.roundToInt()}")Range
A RangeSlider exposes two thumbs for a lower and upper bound.
var range by remember { mutableStateOf(20f..80f) }
RangeSlider(value = range, onValueChange = { range = it }, valueRange = 0f..100f)
Text("From ${range.start.roundToInt()} to ${range.endInclusive.roundToInt()}")