Runtime Surface Config Example

This example demonstrates layer-shika's runtime surface configuration capabilities using the instance-based Surface Control API.

Features Demonstrated

Dynamic Sizing: Toggle between compact (32px) and expanded (64px) bar heights
Anchor Position Control: Switch between top and bottom screen edges at runtime
Layer Management: Cycle through Background, Bottom, Top, and Overlay layers
Instance-based Targeting: Use CallbackContext to control the specific surface that invoked the callback
Slint State Management: State lives in Slint component properties, Rust callbacks apply Wayland configuration

Controls

Expand/Collapse Button: Toggle between 32px and 64px bar heights
Switch Anchor: Toggle between top and bottom screen positions
Switch Layer: Cycle through Top → Overlay → Bottom → Background layers

Running the Example

cargo run -p runtime-surface-config

Implementation Highlights

Slint-managed State

The Slint component owns all state via properties:

export component Bar inherits Window {
    in-out property <bool> is-expanded: false;
    in-out property <string> current-anchor: "Top";
    in-out property <string> current-layer: "Top";

    callback toggle-size(bool);
    callback switch-anchor(string);
    callback switch-layer(string);

    Button {
        text: is-expanded ? "Collapse" : "Expand";
        clicked => {
            root.is-expanded = !root.is-expanded;
            toggle-size(root.is-expanded);
        }
    }
}

Instance-based Control from Callbacks

Callbacks receive CallbackContext and use this_instance() to target only the specific surface:

shell.select(Surface::named("Bar"))
    .on_callback_with_args("toggle-size", move |args, control| {
        let is_expanded = args.first()
            .and_then(|v| v.clone().try_into().ok())
            .unwrap_or(false);

        let new_size = if is_expanded { 64 } else { 32 };

        control.this_instance()
            .configure()
            .size(0, new_size)
            .exclusive_zone(new_size.try_into().unwrap_or(32))
            .apply()?;

    });

API Patterns

Send configuration commands via .configure() builder or individual methods
Commands execute asynchronously in the event loop
Multiple surfaces with the same name can be controlled independently

State Management:

Slint component properties hold all UI state
Slint logic computes next states (e.g., toggling, cycling)
Rust callbacks receive new values and apply Wayland configuration
No Rust-side state synchronization needed

2.6 KiB Raw Blame History