dioxus/examples/resize.rs
ASR-ASU 2f49a89638
Add the onresize event handler to Element (#2479)
* Add the capability to handle resize event for web target

* Add the capability to handle resize event for desktop target

* Return all the sizes, not just the first one

* Fix conversion from platform to generic ResizedData for liveview

* Update the generated interpreter js code base

* Fix clippy warnings

* Fix inconsistent use of block_size and inline_size

* Rename `onresized` event to `onresize`

* Remove the the special-casing logic from the binding logic

* Propagating the resize events using CustomEvent

* Fix case convention in core ts

* revert changes to unified bindings

* Cleanup as suggested

* add a resize example

* Fix desktop resize events

* remove tracing from resize example

* use the raw resize entry so we can downcast on web

* remove unused ResizeEventDetail

---------

Co-authored-by: Evan Almloff <evanalmloff@gmail.com>
2024-08-15 01:23:49 +00:00

27 lines
805 B
Rust

//! Run a callback
//!
//! Whenever an Element is finally mounted to the Dom, its data is available to be read.
//! These fields can typically only be read asynchronously, since various renderers need to release the main thread to
//! perform layout and painting.
use dioxus::prelude::*;
use dioxus_elements::geometry::euclid::Size2D;
fn main() {
launch(app);
}
fn app() -> Element {
let mut dimensions = use_signal(Size2D::zero);
rsx!(
head::Link { rel: "stylesheet", href: asset!("./examples/assets/read_size.css") }
div {
width: "50%",
height: "50%",
background_color: "red",
onresize: move |evt| dimensions.set(evt.data().get_content_box_size().unwrap()),
"This element is {dimensions():?}"
}
)
}