Delete redundant examples (all events now demoed in single simple example)
This commit is contained in:
1 parent
f30387597a
commit
0cdaeb1a8d
4 files changed
+8
-123
No files matched your search
@@ -1,6 +1,6 @@
|
||||
use dioxus::prelude::*;
|
||||
use dioxus_core::UiEvent;
|
||||
use dioxus_html::on::{KeyboardData, MouseData, WheelData};
|
||||
use dioxus_html::on::{FocusData, KeyboardData, MouseData, WheelData};
|
||||
use std::sync::Arc;
|
||||
|
||||
fn main() {
|
||||
@@ -20,9 +20,12 @@ enum Event {
|
||||
KeyDown(Arc<KeyboardData>),
|
||||
KeyUp(Arc<KeyboardData>),
|
||||
KeyPress(Arc<KeyboardData>),
|
||||
|
||||
FocusIn(Arc<FocusData>),
|
||||
FocusOut(Arc<FocusData>),
|
||||
}
|
||||
|
||||
const MAX_EVENTS: usize = 4;
|
||||
const MAX_EVENTS: usize = 8;
|
||||
|
||||
fn app(cx: Scope) -> Element {
|
||||
let container_style = r#"
|
||||
@@ -72,6 +75,9 @@ fn app(cx: Scope) -> Element {
|
||||
onkeyup: move |event| log_event(Event::KeyUp(event.data)),
|
||||
onkeypress: move |event| log_event(Event::KeyPress(event.data)),
|
||||
|
||||
onfocusin: move |event| log_event(Event::FocusIn(event.data)),
|
||||
onfocusout: move |event| log_event(Event::FocusOut(event.data)),
|
||||
|
||||
"Hover, click, type or scroll to see the info down below"
|
||||
}
|
||||
div { events_rendered },
|
||||
|
||||
@@ -1,56 +0,0 @@
|
||||
use dioxus::prelude::*;
|
||||
use dioxus_core::UiEvent;
|
||||
use dioxus_html::on::MouseData;
|
||||
|
||||
fn main() {
|
||||
dioxus::desktop::launch(app);
|
||||
}
|
||||
|
||||
fn app(cx: Scope) -> Element {
|
||||
let page_coordinates = use_state(&cx, || "".to_string());
|
||||
let screen_coordinates = use_state(&cx, || "".to_string());
|
||||
let element_coordinates = use_state(&cx, || "".to_string());
|
||||
let buttons = use_state(&cx, || "".to_string());
|
||||
let modifiers = use_state(&cx, || "".to_string());
|
||||
|
||||
let container_style = r#"
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
"#;
|
||||
let rect_style = r#"
|
||||
background: deepskyblue;
|
||||
height: 50vh;
|
||||
width: 50vw;
|
||||
"#;
|
||||
|
||||
let update_mouse_position = move |event: UiEvent<MouseData>| {
|
||||
let mouse_data = event.data;
|
||||
|
||||
page_coordinates.set(format!("{:?}", mouse_data.page_coordinates()));
|
||||
screen_coordinates.set(format!("{:?}", mouse_data.screen_coordinates()));
|
||||
element_coordinates.set(format!("{:?}", mouse_data.element_coordinates()));
|
||||
|
||||
// Note: client coordinates are also available, but they would be the same as the page coordinates in this example, because there is no scrolling.
|
||||
|
||||
buttons.set(format!("{:?}", mouse_data.held_buttons()));
|
||||
modifiers.set(format!("{:?}", mouse_data.modifiers()));
|
||||
};
|
||||
|
||||
cx.render(rsx! (
|
||||
div {
|
||||
style: "{container_style}",
|
||||
"Hover over to display coordinates:",
|
||||
div {
|
||||
style: "{rect_style}",
|
||||
onmousemove: update_mouse_position,
|
||||
prevent_default: "mousedown",
|
||||
}
|
||||
div {"Page coordinates: {page_coordinates}"},
|
||||
div {"Screen coordinates: {screen_coordinates}"},
|
||||
div {"Element coordinates: {element_coordinates}"},
|
||||
div {"Buttons: {buttons}"},
|
||||
div {"Modifiers: {modifiers}"},
|
||||
}
|
||||
))
|
||||
}
|
||||
@@ -1,39 +0,0 @@
|
||||
use dioxus::prelude::*;
|
||||
use dioxus_core::UiEvent;
|
||||
use dioxus_html::on::WheelData;
|
||||
|
||||
fn main() {
|
||||
dioxus::desktop::launch(app);
|
||||
}
|
||||
|
||||
fn app(cx: Scope) -> Element {
|
||||
let delta = use_state(&cx, || "".to_string());
|
||||
|
||||
let container_style = r#"
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
"#;
|
||||
let rect_style = r#"
|
||||
background: deepskyblue;
|
||||
height: 50vh;
|
||||
width: 50vw;
|
||||
"#;
|
||||
|
||||
let handle_event = move |event: UiEvent<WheelData>| {
|
||||
let wheel_data = event.data;
|
||||
delta.set(format!("{:?}", wheel_data.delta()));
|
||||
};
|
||||
|
||||
cx.render(rsx! (
|
||||
div {
|
||||
style: "{container_style}",
|
||||
"Scroll mouse wheel over rectangle:",
|
||||
div {
|
||||
style: "{rect_style}",
|
||||
onwheel: handle_event,
|
||||
}
|
||||
div {"Delta: {delta}"},
|
||||
}
|
||||
))
|
||||
}
|
||||
@@ -1,26 +0,0 @@
|
||||
use dioxus::prelude::*;
|
||||
|
||||
fn main() {
|
||||
dioxus::desktop::launch(app);
|
||||
}
|
||||
|
||||
fn app(cx: Scope) -> Element {
|
||||
cx.render(rsx! {
|
||||
div {
|
||||
button {
|
||||
ondblclick: move |_| {
|
||||
//
|
||||
println!("double clicked!");
|
||||
},
|
||||
"Click me!"
|
||||
}
|
||||
input {
|
||||
onfocusin: move |_| {
|
||||
//
|
||||
println!("blurred!");
|
||||
},
|
||||
"onblur": "console.log('blurred!')"
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
Reference in new issue
Block a user