Function stepper_bound 

pub fn stepper_bound(
    label: &str,
    state: &BoundState<f64>,
    lower: f64,
    upper: f64,
    step: f64,
) -> View

Create a Stepper wired to Rust state — the +/− buttons write back.

Examples found in repository

examples/settings.rs (line 66)

fn body() -> View {
    let s = settings();

    form![
        section![header: text("Account");
            hstack![
                text("Name"),
                spacer(),
                textfield_bound("Your name", &s.name).text_field_style(
                    views::TextFieldStyle::RoundedBorderTextFieldStyle,
                ),
            ],
            toggle_bound("Notifications", &s.notify),
        ],
        section![header: text("Playback");
            vstack_aligned(&[
                hstack![
                    text("Volume"),
                    spacer(),
                    text!("{:.0}%", s.volume.get() * 100.0).fg_system(SystemColor::Gray),
                ],
                slider_bound(&s.volume, 0.0, 1.0),
            ], HorizontalAlignment::Leading),
            stepper_bound("Refresh every", &s.refresh, 1.0, 60.0, 1.0),
        ],
        section![header: text("Appearance");
            picker_bound!(
                "Theme",
                &s.theme,
                text(THEMES[0]).tag_int(0),
                text(THEMES[1]).tag_int(1),
                text(THEMES[2]).tag_int(2),
            )
            .picker_style(PickerStyle::InlinePickerStyle),
        ],
        section![
            button("About", show_about)
                .a11y_hint("Opens a panel describing this app"),
        ],
    ]
    .form_style(FormStyle::GroupedFormStyle)
    .sheet_bound(&s.about, about_panel())
}

examples/common/spec.rs (lines 592-598)

fn node_view(node: &Node) -> Result<View, String> {
    let spacing = node.f64_attr("spacing").unwrap_or(8.0);
    let base = match node.name.as_str() {
        "vstack" => {
            let kids = children(node)?;
            match node.attr("align") {
                Some(a) => vstack_aligned_spacing(&kids, h_align(a, node.line)?, Some(spacing)),
                None => vstack_spacing(&kids, spacing),
            }
        }
        "hstack" => {
            let kids = children(node)?;
            match node.attr("align") {
                Some(a) => hstack_aligned_spacing(&kids, v_align(a, node.line)?, Some(spacing)),
                None => hstack_spacing(&kids, spacing),
            }
        }
        "zstack" => zstack_aligned(&children(node)?, align(node.attr("align").unwrap_or("center"), node.line)?),
        "text" => {
            let s = node.value.as_deref().unwrap_or("");
            let mut v = text(s);
            if let Some(style) = node.attr("style") {
                v = v.text_style(text_style(style, node.line)?);
            }
            if let Some(size) = node.f64_attr("size") {
                v = v.font_size(size);
            }
            if node.flag("bold") {
                v = v.bold();
            }
            if node.flag("italic") {
                v = v.italic();
            }
            if let Some(c) = node.attr("color") {
                v = match tint(c, node.line)? {
                    Tint::System(sc) => v.fg_system(sc),
                    Tint::Literal(lc) => v.fg(lc),
                };
            }
            v
        }
        "spacer" => spacer(),
        "divider" => divider(),
        // The action is a no-op on purpose: a spec read from a file has nowhere
        // to put behaviour, and pretending otherwise would be worse than a
        // button that visibly does nothing. `hot_reload.rs` is where a spec
        // gains behaviour, by being reloaded.
        "button" => button(node.value.as_deref().unwrap_or("Button"), || {}),
        "color" => color(parse_color(node.value.as_deref().unwrap_or("#808080"), node.line)?),
        "image" => system_image(node.value.as_deref().unwrap_or("star")).into_view(),
        "rect" => match node.attr("color") {
            Some(c) => match tint(c, node.line)? {
                Tint::System(sc) => rectangle_shape().fill_system(sc),
                Tint::Literal(lc) => rectangle_shape().fill(lc),
            },
            None => rectangle_shape().into_view(),
        },
        "circle" => match node.attr("color") {
            Some(c) => match tint(c, node.line)? {
                Tint::System(sc) => circle_shape().fill_system(sc),
                Tint::Literal(lc) => circle_shape().fill(lc),
            },
            None => circle_shape().into_view(),
        },
        "capsule" => match node.attr("color") {
            Some(c) => match tint(c, node.line)? {
                Tint::System(sc) => capsule_shape().fill_system(sc),
                Tint::Literal(lc) => capsule_shape().fill(lc),
            },
            None => capsule_shape().into_view(),
        },
        "progress" => progress(
            node.value.as_deref().and_then(|v| v.parse().ok()).unwrap_or(0.5),
            node.f64_attr("total").unwrap_or(1.0),
        ),
        "gauge" => gauge(
            node.value.as_deref().and_then(|v| v.parse().ok()).unwrap_or(0.5),
            node.f64_attr("min").unwrap_or(0.0),
            node.f64_attr("max").unwrap_or(1.0),
            text(node.attr("label").unwrap_or("")),
        ),
        "group_box" => group_box(stack_children(node)?),
        "list" => list(stack_children(node)?),
        "scroll" => stack_children(node)?.scroll(),
        "form" => form(stack_children(node)?),
        // Every bound control needs an explicit `@name`.
        //
        // Inventing one — from the line, or from position in the tree — looks
        // friendlier and is a trap: adding a line above a `toggle` would
        // change its derived name, and the control would silently reset on the
        // next reload. A name the file states is a name that survives the file
        // being edited, which is the entire point of the slots.
        "toggle" => toggle_bound(
            node.value.as_deref().unwrap_or("Toggle"),
            &flag_slot(&require_slot(node)?, node.flag("on")),
        ),
        "slider" => {
            let lo = node.f64_attr("min").unwrap_or(0.0);
            let hi = node.f64_attr("max").unwrap_or(1.0);
            slider_bound(
                &number_slot(&require_slot(node)?, node.f64_attr("value").unwrap_or(lo)),
                lo,
                hi,
            )
        }
        "stepper" => stepper_bound(
            node.value.as_deref().unwrap_or("Stepper"),
            &number_slot(&require_slot(node)?, node.f64_attr("value").unwrap_or(0.0)),
            node.f64_attr("min").unwrap_or(0.0),
            node.f64_attr("max").unwrap_or(100.0),
            node.f64_attr("step").unwrap_or(1.0),
        ),
        "field" => textfield_bound(
            node.value.as_deref().unwrap_or(""),
            &string_slot(&require_slot(node)?, node.attr("text").unwrap_or("")),
        ),
        "label" => label(
            node.value.as_deref().unwrap_or(""),
            node.attr("icon").unwrap_or("star"),
        ),
        other => {
            return Err(format!(
                "line {}: no view called `{other}`; try one of {}",
                node.line,
                NAMES.join(", ")
            ))
        }
    };
    decorate(base, node)
}