1use dioxus::prelude::*;
2use dioxus_spring::use_spring_style;
3use dioxus_use_gesture::{use_drag, DragState};
4use std::time::Duration;
5
6fn app(cx: Scope) -> Element {
7 let spring_ref = use_spring_style(cx, [0f32, 0f32], |[x, y]| {
8 format!("width: 200px; height: 200px; background: red; transform: translate({x}px, {y}px);")
9 });
10
11 let drag_ref = use_drag(cx, move |state, x, y| match state {
12 DragState::Move => spring_ref.set([x, y]),
13 DragState::End => spring_ref.animate([0., 0.], Duration::from_millis(500)),
14 });
15
16 render!(div {
17 onmounted: move |event| {
18 spring_ref.mount(event.data.clone());
19 drag_ref.mount(event.data);
20 }
21 })
22}
23
24fn main() {
25 dioxus_logger::init(log::LevelFilter::Info).expect("failed to init logger");
26
27 dioxus_web::launch(app)
28}