bevy_ui 0.20.0

A custom ECS-driven UI framework built specifically for Bevy Engine
Documentation 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136

/// This module contains components that are used to track the interaction state of UI widgets.
use bevy_a11y::AccessibilityNode;
use bevy_ecs::{
    component::Component,
    lifecycle::{Add, Remove},
    observer::On,
    reflect::ReflectComponent,
    world::DeferredWorld,
};
use bevy_reflect::std_traits::ReflectDefault;
use bevy_reflect::Reflect;

/// A component indicating that a widget is disabled and should be "grayed out".
/// This is used to prevent user interaction with the widget. It should not, however, prevent
/// the widget from being updated or rendered, or from acquiring keyboard focus.
///
/// For apps which support a11y: if a widget (such as a slider) contains multiple entities,
/// the `InteractionDisabled` component should be added to the root entity of the widget - the
/// same entity that contains the `AccessibilityNode` component. This will ensure that
/// the a11y tree is updated correctly.
///
/// For developers familiar with the web and HTML, the word "disabled" as used here should be
/// interpreted as working more like the `aria-disabled` (which doesn't prevent input focus)
/// than the `disabled` attribute (which does). However, unlike `aria-disabled`, which is purely
/// advisory, this does make the widget non-operable.
///
/// In particular, this marker currently has no effect on the "click-to-focus" observer which
/// lives in [`bevy_input_focus`], as that is a lower-level crate that this one depends on.
#[derive(Component, Debug, Clone, Copy, Default, Reflect)]
#[reflect(Component, Default, Clone)]
pub struct InteractionDisabled;

pub(crate) fn on_add_disabled(add: On<Add<InteractionDisabled>>, mut world: DeferredWorld) {
    let mut entity = world.entity_mut(add.entity);
    if let Some(mut accessibility) = entity.get_mut::<AccessibilityNode>() {
        accessibility.set_disabled();
    }
}

pub(crate) fn on_remove_disabled(
    remove: On<Remove<InteractionDisabled>>,
    mut world: DeferredWorld,
) {
    let mut entity = world.entity_mut(remove.entity);
    if let Some(mut accessibility) = entity.get_mut::<AccessibilityNode>() {
        accessibility.clear_disabled();
    }
}

/// Component that indicates whether a button or widget is currently in a pressed or "held down"
/// state.
#[derive(Component, Debug, Clone, Copy, Default, Reflect)]
#[reflect(Component, Default, Clone)]
pub struct Pressed;

/// Component that indicates that a widget can be checked.
#[derive(Component, Debug, Clone, Copy, Default, Reflect)]
#[reflect(Component, Default, Clone)]
pub struct Checkable;

/// Component that indicates whether a checkbox or radio button is in a checked state.
#[derive(Component, Debug, Clone, Copy, Default, Reflect)]
#[reflect(Component, Default, Clone)]
pub struct Checked;

pub(crate) fn on_add_checkable(add: On<Add<Checkable>>, mut world: DeferredWorld) {
    let mut entity = world.entity_mut(add.entity);
    let checked = entity.get::<Checked>().is_some();
    if let Some(mut accessibility) = entity.get_mut::<AccessibilityNode>() {
        accessibility.set_toggled(match checked {
            true => accesskit::Toggled::True,
            false => accesskit::Toggled::False,
        });
    }
}

pub(crate) fn on_remove_checkable(remove: On<Remove<Checkable>>, mut world: DeferredWorld) {
    // Remove the 'toggled' attribute entirely.
    let mut entity = world.entity_mut(remove.entity);
    if let Some(mut accessibility) = entity.get_mut::<AccessibilityNode>() {
        accessibility.clear_toggled();
    }
}

pub(crate) fn on_add_checked(add: On<Add<Checked>>, mut world: DeferredWorld) {
    let mut entity = world.entity_mut(add.entity);
    if let Some(mut accessibility) = entity.get_mut::<AccessibilityNode>() {
        accessibility.set_toggled(accesskit::Toggled::True);
    }
}

pub(crate) fn on_remove_checked(remove: On<Remove<Checked>>, mut world: DeferredWorld) {
    let mut entity = world.entity_mut(remove.entity);
    if let Some(mut accessibility) = entity.get_mut::<AccessibilityNode>() {
        accessibility.set_toggled(accesskit::Toggled::False);
    }
}

/// Component that indicates that a widget can be selected. Similar to [`Checkable`], but works for
/// the ARIA "selected" state instead of "checked".
#[derive(Component, Default, Debug)]
pub struct Selectable;

/// Similar to [`Checked`], but works for the ARIA "selected" state instead of "checked".
#[derive(Component, Default, Debug, Clone)]
pub struct Selected;

pub(crate) fn on_add_selectable(add: On<Add<Selectable>>, mut world: DeferredWorld) {
    let mut entity = world.entity_mut(add.entity);
    let selected = entity.get::<Selected>().is_some();
    if let Some(mut accessibility) = entity.get_mut::<AccessibilityNode>() {
        accessibility.set_selected(selected);
    }
}

pub(crate) fn on_remove_selectable(remove: On<Remove<Selectable>>, mut world: DeferredWorld) {
    // Remove the 'toggled' attribute entirely.
    let mut entity = world.entity_mut(remove.entity);
    if let Some(mut accessibility) = entity.get_mut::<AccessibilityNode>() {
        accessibility.clear_selected();
    }
}

pub(crate) fn on_add_selected(add: On<Add<Selected>>, mut world: DeferredWorld) {
    let mut entity = world.entity_mut(add.entity);
    if let Some(mut accessibility) = entity.get_mut::<AccessibilityNode>() {
        accessibility.set_selected(true);
    }
}

pub(crate) fn on_remove_selected(remove: On<Remove<Selected>>, mut world: DeferredWorld) {
    let mut entity = world.entity_mut(remove.entity);
    if let Some(mut accessibility) = entity.get_mut::<AccessibilityNode>() {
        accessibility.set_selected(false);
    }
}