mirror of
https://github.com/emilk/egui.git
synced 2026-08-30 13:20:05 -04:00
eframe web: ignore keyboard events unless canvas has focus (#4718)
* Fixes https://github.com/rerun-io/rerun/issues/6638 * Related? https://github.com/emilk/egui/issues/4563 This improves how an eframe canvas works inside of a larger web page, and how it works when there are multiple eframe apps in the same page. `eframe` will set `tabindex="0"` on the canvas automatically, making it focusable. It will also set `outline: none` on the CSS, so the focused canvas won't have an ugly outline. ## Breaking changes You may wanna add this to your `index.html` to give the canvas focus on startup: ```js document.getElementById("the_canvas_id").focus(); ``` ## Test setup ```sh ./scripts/build_demo_web.sh ./scripts/start_server.sh open http://localhost:8888/multiple_apps.html ``` Then open the "Input Event History" and "Text Edit" windows ## Tested * Chromium * [x] drag-and-drop of files * Test both when a `TextEdit` is focused and when it is not: * [x] `Event::Key` * [x] `Event::Text` * [x] copy-cut-paste * [x] Wheel scroll * [x] `Event::PointerGone` * [x] Mouse drag * [x] Mouse click * [x] Mouse right-click * [x] Defocus all eframe canvas, and then start typing text * [x] Firefox (all of the above) * [x] Desktop Safari (all of the above) * [x] Mobile Safari ## Future work (pre-existing issues) * https://github.com/emilk/egui/issues/4723 * https://github.com/emilk/egui/issues/4724 * https://github.com/emilk/egui/issues/4725 * https://github.com/emilk/egui/issues/4726
This commit is contained in:
@@ -187,6 +187,10 @@ impl AppRunner {
|
||||
///
|
||||
/// The result can be painted later with a call to [`Self::run_and_paint`] or [`Self::paint`].
|
||||
pub fn logic(&mut self) {
|
||||
// We sometimes miss blur/focus events due to the text agent, so let's just poll each frame:
|
||||
self.input
|
||||
.set_focus(super::has_focus(self.canvas()) || self.text_agent.has_focus());
|
||||
|
||||
let canvas_size = super::canvas_size_in_points(self.canvas(), self.egui_ctx());
|
||||
let mut raw_input = self.input.new_frame(canvas_size);
|
||||
|
||||
|
||||
Reference in New Issue
Block a user