skyler
/
egui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Move first `request_animation_frame` into resize observer (#4628) 

This PR ensures the first animation frame happens _after_ the resize
observer has had a chance to do its job.

* Closes https://github.com/emilk/egui/issues/4622

The first commit contains some `log` calls to observe the changed
behavior:

Before:
```
[eframe::web::app_runner] eframe/src/web/app_runner.rs:191: LOGIC [300.0 150.0]
[eframe::web::events] eframe/src/web/events.rs:633: ResizeObserver canvas=[300.0 150.0] to=(1920, 993)
[eframe::web::app_runner] eframe/src/web/app_runner.rs:191: LOGIC [1920.0 993.0]
[eframe::web::app_runner] eframe/src/web/app_runner.rs:191: LOGIC [1920.0 993.0]
```

After:
```
[eframe::web::events] eframe/src/web/events.rs:633: ResizeObserver canvas=[300.0 150.0] to=(1920, 993)
[eframe::web::app_runner] eframe/src/web/app_runner.rs:191: LOGIC [1920.0 993.0]
[eframe::web::app_runner] eframe/src/web/app_runner.rs:191: LOGIC [1920.0 993.0]
```
This commit is contained in:
Jan Procházka 2024-06-06 10:30:32 +02:00 committed by GitHub
parent cbb5d6aa93
commit 3d632cd333
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 14 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
crates/eframe/src/web/events.rs
View File

@ -608,6 +608,14 @@ pub(crate) fn install_canvas_events(runner_ref: &WebRunner) -> Result<(), JsValu
Ok(()) Ok(())
} }
/// Install a `ResizeObserver` to observe changes to the size of the canvas.
///
/// This is the only way to ensure a canvas size change without an associated window `resize` event
/// actually results in a resize of the canvas.
///
/// The resize observer is called the by the browser at `observe` time, instead of just on the first actual resize.
/// We use that to trigger the first `request_animation_frame` _after_ updating the size of the canvas to the correct dimensions,
/// to avoid [#4622](https://github.com/emilk/egui/issues/4622).
pub(crate) fn install_resize_observer(runner_ref: &WebRunner) -> Result<(), JsValue> { pub(crate) fn install_resize_observer(runner_ref: &WebRunner) -> Result<(), JsValue> {
let closure = Closure::wrap(Box::new({ let closure = Closure::wrap(Box::new({
let runner_ref = runner_ref.clone(); let runner_ref = runner_ref.clone();
@ -628,6 +636,11 @@ pub(crate) fn install_resize_observer(runner_ref: &WebRunner) -> Result<(), JsVa
// force an immediate repaint // force an immediate repaint
runner_lock.needs_repaint.repaint_asap(); runner_lock.needs_repaint.repaint_asap();
paint_if_needed(&mut runner_lock); paint_if_needed(&mut runner_lock);
drop(runner_lock);
// we rely on the resize observer to trigger the first `request_animation_frame`:
if let Err(err) = runner_ref.request_animation_frame() {
log::error!("{}", super::string_from_js_value(&err));
};
} }
} }
}) as Box<dyn FnMut(js_sys::Array)>); }) as Box<dyn FnMut(js_sys::Array)>);

3
crates/eframe/src/web/web_runner.rs
View File

@ -79,9 +79,8 @@ impl WebRunner {
events::install_color_scheme_change_event(self)?; events::install_color_scheme_change_event(self)?;
} }
// The resize observer handles calling `request_animation_frame` to start the render loop.
events::install_resize_observer(self)?; events::install_resize_observer(self)?;
self.request_animation_frame()?;
} }
Ok(()) Ok(())