migrations/egui
1
0
Fork 0
mirror of https://github.com/emilk/egui.git synced 2026-08-29 04:40:03 -04:00
Code Activity

Group AccessKit nodes by Ui (#7386)

Browse Source 
* closes https://github.com/emilk/egui/issues/5674

This changes egui to create an AccessKit node for each `Ui`. I'm not
sure if this alone will directly improve accessibility, but it should
make it easier to create the correct parent / child relations (e.g.
grouping menus as children of menu buttons).
Instead of having a global stack of parent ids, they are now passed via
a parent_id field in `UiBuilder`.

If having all these `GenericContainer` nodes somehow is bad for
accessibility, the PR could also be changed to only create nodes if
there is actually some accessibility info with it (the relevant is
currently commented-out in the PR). But I think screen readers should
just ignore these nodes, so it should be fine? We could also use this as
motivation to git red of some unnecessary wrapped `Ui`s, e.g.
CentralPanel creates 3 Uis when 2 should be enough (the initial Ui and a
Frame, maybe we could even only show the `Frame` if we can give it an
UiBuilder and somehow show the Frame with `Ui::new`).

Here is a screenshot from the accessibility inspector
(https://github.com/emilk/egui/pull/7368) with this PR:

<img width="431" height="744" alt="Screenshot 2025-07-24 at 12 09 55"
src="https://github.com/user-attachments/assets/6c4e5ff6-5c38-450e-9500-0776c9018d8c"
/>

Without this PR:


https://github.com/user-attachments/assets/270e32fc-9c7a-4dad-8c90-7638c487a602
This commit is contained in:
Lucas Meurer
2025-10-08 11:30:32 +02:00
committed by GitHub
parent 6a49c9ad6b
commit 3fdc5641aa
14 changed files with 302 additions and 249 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
crates/egui_demo_app/src/accessibility_inspector.rs
View File

@@ -87,23 +87,21 @@ impl egui::Plugin for AccessibilityInspectorPlugin {
ctx.enable_accesskit();
SidePanel::right(Self::id()).show(ctx, |ui| {
let response = ui.heading("🔎 AccessKit Inspector");
ctx.with_accessibility_parent(response.id, || {
if let Some(selected_node) = self.selected_node {
TopBottomPanel::bottom(Self::id().with("details_panel"))
.frame(Frame::new())
.show_separator_line(false)
.show_inside(ui, |ui| {
self.selection_ui(ui, selected_node);
});
}
ui.heading("🔎 AccessKit Inspector");
if let Some(selected_node) = self.selected_node {
TopBottomPanel::bottom(Self::id().with("details_panel"))
.frame(Frame::new())
.show_separator_line(false)
.show_inside(ui, |ui| {
self.selection_ui(ui, selected_node);
});
}
ui.style_mut().wrap_mode = Some(TextWrapMode::Truncate);
ScrollArea::vertical().show(ui, |ui| {
if let Some(tree) = &self.tree {
Self::node_ui(ui, &tree.state().root(), &mut self.selected_node);
}
});
ui.style_mut().wrap_mode = Some(TextWrapMode::Truncate);
ScrollArea::vertical().show(ui, |ui| {
if let Some(tree) = &self.tree {
Self::node_ui(ui, &tree.state().root(), &mut self.selected_node);
}
});
});
}
@@ -157,6 +155,7 @@ impl AccessibilityInspectorPlugin {
ui.label("Children");
ui.label(RichText::new(node.children().len().to_string()).strong());
ui.end_row();
});