Preview
Loading GPUI
Props
Install
cargo add evilbuttonsUsage
use evilbuttons::SlideToDetonate;
use gpui::{div, prelude::*, Context, IntoElement, Render, Window};
struct ButtonDemo;
impl Render for ButtonDemo {
fn render(&mut self, _: &mut Window, _: &mut Context<Self>) -> impl IntoElement {
div().child(
SlideToDetonate::new("launch")
.label("Slide to detonate")
.on_confirm(|_, _| launch_the_missiles()),
)
}
}Variants
Light
.variant(SlideToDetonateVariant::Light) swaps the dark groove for a light one with a white handle.
Loading GPUI
SlideToDetonate::new("launch").variant(SlideToDetonateVariant::Light)Heavy fuse
High resistance makes the handle lag further behind the pointer the closer it gets to the end.
Loading GPUI
SlideToDetonate::new("launch")
.label("Push through")
.resistance(0.85)Locked to the pointer
smoothness(0.0) and resistance(0.0) give a direct, one-to-one drag with no spring.
Loading GPUI
SlideToDetonate::new("launch").smoothness(0.0).resistance(0.0)Floaty
High smoothness lets the handle glide behind the pointer on a loose spring.
Loading GPUI
SlideToDetonate::new("launch").smoothness(0.9)Props
SlideToDetonate is a GPUI RenderOnce builder; its drag state is keyed by id.
| Method | Type | Default | Description |
|---|---|---|---|
new(id) | impl Into<ElementId> | - | Unique id for the slider state. |
label(s) | impl Into<SharedString> | "Slide to detonate" | Track label shown while idle. |
on_confirm(f) | Fn(&mut Window, &mut App) | - | Fired once the handle is released past the threshold. |
threshold(t) | f32 | 0.9 | Fraction of the track (0-1) the handle must cross to arm the action. |
resistance(r) | f32 | 0.35 | How hard the fuse pushes back (0-1). 0 tracks the pointer one to one; higher values make the handle lag further behind toward the end. |
smoothness(s) | f32 | 0.4 | How softly the handle follows the pointer (0-1). 0 locks it to the pointer; higher values glide behind on a looser spring. |
variant(v) | SlideToDetonateVariant | Dark | Surface style: a recessed dark groove (Dark) or a light one (Light). |
reset_after(d) | Duration | 1600ms | How long to stay in the success state before resetting. Duration::ZERO stays. |
disabled(bool) | bool | false | Locks the handle and dims the track. |
Good to know
- A heavy
resistanceslows the handle but never blocks it. smoothness(0.0)makes the handle track the pointer exactly.- Once grabbed, the handle follows the pointer anywhere in the window, like pointer capture.
- With the handle focused, the arrow keys step it by 10%, Home and End jump; reaching the threshold detonates. Moving focus away snaps it back.
- The label's shimmer is applied per letter rather than as a continuous gradient, since GPUI can't clip a gradient to text.