GPUI Box GitHub

Components / controls

Slider builder

A track with one or two handles.

A builder is RenderOnce. Construct and mount it in one expression.

use gpui_kit::controls::slider::Slider;

Reviewed in choice.

Construct
new(ident: impl Into<Ident>) -> Self
Options

Chain onto the value.

label(label: impl Into<SharedString>) -> Self
range(min: f32, max: f32) -> Self
value(value: f32) -> Self
step(step: f32) -> Self
orientation(orientation: SliderOrientation) -> Self
length(length: f32) -> Self
display(display: impl Into<SharedString>) -> Self
on_change(handler: impl Fn(f32, &mut Window, &mut App) + 'static) -> Self
bind(binding: &Binding<f32>, cx: &App) -> Self
high(high: f32) -> Self
values(low: f32, high: f32) -> Self
marks(marks: impl IntoIterator<Item = f32>) -> Self
on_range_change(handler: impl Fn(f32, f32, &mut Window, &mut App) + 'static) -> Self
Example · choice
fn choice(_window: &mut Window, cx: &mut App) -> AnyElement {
    let theme = cx.theme().clone();
    div()
        .flex()
        .flex_col()
        .gap(px(theme.space(Space::Md)))
        .p(px(theme.space(Space::Lg)))
        .w(px(360.0))
        .child(
            Checkbox::new("scene.choice.telemetry")
                .label("Send anonymous usage data")
                .description("Counts only, never file contents")
                .checked(true)
                .on_change(|_, _, _| {}),
        )
        .child(
            Checkbox::new("scene.choice.partial")
                .label("Some providers enabled")
                .mixed()
                .on_change(|_, _, _| {}),
        )
        .child(
            Checkbox::new("scene.choice.locked")
                .label("Managed by policy")
                .checked(true)
                .disabled(true),
        )
        .child(
            Radio::new("scene.choice.ask")
                .label("Ask before every action")
                .selected(true)
                .on_select(|_, _| {}),
        )
        .child(
            Radio::new("scene.choice.auto")
                .label("Run without asking")
                .description("Consequential actions still require approval")
                .on_select(|_, _| {}),
        )
        .child(
            Switch::new("scene.choice.preview")
                .label("Preview releases")
                .on(true)
                .on_change(|_, _, _| {}),
        )
        .child(
            Switch::new("scene.choice.background-updates")
                .label("Background updates")
                .on(false)
                .on_change(|_, _, _| {}),
        )
        .child(
            Switch::new("scene.choice.managed-updates")
                .label("Managed updates")
                .on(true)
                .disabled(true),
        )
        .child(
            Slider::new("scene.choice.temperature")
                .label("Temperature")
                .range(0.0, 2.0)
                .step(0.1)
                .value(0.7)
                .display("0.7")
                .on_change(|_, _, _| {}),
        )
        .child(
            Slider::new("scene.choice.window")
                .label("Window")
                .range(0.0, 1.0)
                .values(0.2, 0.8)
                .marks([0.0, 0.25, 0.5, 0.75, 1.0])
                .display("0.2 – 0.8")
                .on_range_change(|_, _, _, _| {}),
        )
        .child(caption(
            &theme,
            "Vertical range uses the same value, marks, and keyboard contract",
        ))
        .child(
            div().h(px(220.0)).child(
                Slider::new("scene.choice.vertical")
                    .label("Vertical")
                    .orientation(SliderOrientation::Vertical)
                    .range(0.0, 100.0)
                    .step(10.0)
                    .value(60.0)
                    .marks([0.0, 25.0, 50.0, 75.0, 100.0])
                    .display("60")
                    .on_change(|_, _, _| {}),
            ),
        )
        .into_any_element()
}

Source: crates/gpui-kit/src/controls/slider.rs