Implemented screen switching.

Signed-off-by: TheDudeFromCI <[email protected]>

examples/menu.rs

@@ -55,7 +55,7 @@ fn pressed_quit(ui: Query<&Interaction, (Changed<Interaction>, With<QuitButton>)
 fn ui() -> BoxedElement {
     WhCanvas::new() //
         .add_child(
-            WhScreen::new()
+            WhScreen::new(ScreenID(1))
                 .bg_img("bg.png")
                 .direction(ElementDirection::Row, Val::Px(0.0))
                 .justify(ElementAlignment::Left)

examples/screens.rs

@@ -0,0 +1,149 @@
+use bevy::log::LogPlugin;
+use bevy::prelude::*;
+use bevy_wh_elements::prelude::*;
+
+fn main() {
+    App::new()
+        .add_plugins(DefaultPlugins.set(LogPlugin {
+            level: bevy::log::Level::DEBUG,
+            ..default()
+        }))
+        .add_plugins(WhElementsPlugin)
+        .add_systems(Startup, init)
+        .add_systems(Update, (show_screen_1, show_screen_2, show_screen_3))
+        .run();
+}
+
+fn init(asset_server: Res<AssetServer>, mut commands: Commands) {
+    commands.spawn(Camera2dBundle::default());
+    ui().build(&mut commands, &asset_server);
+}
+
+pub const SCREEN_1: ScreenID = ScreenID(1);
+pub const SCREEN_2: ScreenID = ScreenID(2);
+pub const SCREEN_3: ScreenID = ScreenID(3);
+pub const SCREEN_GROUP: ScreenGroup = ScreenGroup(1);
+
+fn ui() -> BoxedElement {
+    WhCanvas::new().add_children(vec![
+        WhScreen::new(SCREEN_1)
+            .in_group(SCREEN_GROUP)
+            .bg_img("bg.png")
+            .shown()
+            .add_children(vec![
+                WhDiv::new()
+                    .bg_color(Color::rgba(0.0, 0.0, 0.0, 0.5))
+                    .border(Color::WHITE, Val::Px(2.0))
+                    .direction(ElementDirection::Column, Val::Px(10.0))
+                    .padding(UiRect::all(Val::Px(10.0)))
+                    .add_children(vec![
+                        WhText::new()
+                            .text("Screen 1")
+                            .font_size(36.0)
+                            .text_color(Color::WHITE)
+                            .margin(UiRect::all(Val::Px(20.0))),
+                        WhButton::with_flags(Screen2Button)
+                            .bg_color(Color::WHITE)
+                            .border(Color::BLACK, Val::Px(1.0))
+                            .add_child(WhText::new().text("Show Screen 2").font_size(36.0)),
+                        WhButton::with_flags(Screen3Button)
+                            .bg_color(Color::WHITE)
+                            .border(Color::BLACK, Val::Px(1.0))
+                            .add_child(WhText::new().text("Show Screen 3").font_size(36.0)),
+                    ]),
+            ]),
+        WhScreen::new(SCREEN_2)
+            .in_group(SCREEN_GROUP)
+            .bg_img("bg2.png")
+            .add_children(vec![
+                WhDiv::new()
+                    .bg_color(Color::rgba(0.0, 0.0, 0.0, 0.5))
+                    .border(Color::WHITE, Val::Px(2.0))
+                    .direction(ElementDirection::Column, Val::Px(10.0))
+                    .padding(UiRect::all(Val::Px(10.0)))
+                    .add_children(vec![
+                        WhText::new()
+                            .text("Screen 2")
+                            .font_size(36.0)
+                            .text_color(Color::WHITE)
+                            .margin(UiRect::all(Val::Px(20.0))),
+                        WhButton::with_flags(Screen1Button)
+                            .bg_color(Color::WHITE)
+                            .border(Color::BLACK, Val::Px(1.0))
+                            .add_child(WhText::new().text("Back").font_size(36.0)),
+                    ]),
+            ]),
+        WhScreen::new(SCREEN_3)
+            .in_group(SCREEN_GROUP)
+            .bg_img("bg3.png")
+            .add_children(vec![
+                WhDiv::new()
+                    .bg_color(Color::rgba(0.0, 0.0, 0.0, 0.5))
+                    .border(Color::WHITE, Val::Px(2.0))
+                    .direction(ElementDirection::Column, Val::Px(10.0))
+                    .padding(UiRect::all(Val::Px(10.0)))
+                    .add_children(vec![
+                        WhText::new()
+                            .text("Screen 3")
+                            .font_size(36.0)
+                            .text_color(Color::WHITE)
+                            .margin(UiRect::all(Val::Px(20.0))),
+                        WhButton::with_flags(Screen1Button)
+                            .bg_color(Color::WHITE)
+                            .border(Color::BLACK, Val::Px(1.0))
+                            .add_child(WhText::new().text("Back").font_size(36.0)),
+                    ]),
+            ]),
+    ])
+}
+
+#[derive(Component)]
+pub struct Screen1Button;
+
+#[derive(Component)]
+pub struct Screen2Button;
+
+#[derive(Component)]
+pub struct Screen3Button;
+
+fn show_screen_1(
+    query_screens: Query<&Interaction, (With<Screen1Button>, Changed<Interaction>)>,
+    mut toggle_screen_evs: EventWriter<SetScreenInGroup>,
+) {
+    for button_interaction in query_screens.iter() {
+        if let Interaction::Pressed = button_interaction {
+            toggle_screen_evs.send(SetScreenInGroup {
+                screen_id: SCREEN_1,
+                group: SCREEN_GROUP,
+            });
+        }
+    }
+}
+
+fn show_screen_2(
+    query_screens: Query<&Interaction, (With<Screen2Button>, Changed<Interaction>)>,
+    mut toggle_screen_evs: EventWriter<SetScreenInGroup>,
+) {
+    for button_interaction in query_screens.iter() {
+        if let Interaction::Pressed = button_interaction {
+            toggle_screen_evs.send(SetScreenInGroup {
+                screen_id: SCREEN_2,
+                group: SCREEN_GROUP,
+            });
+        }
+    }
+}
+
+fn show_screen_3(
+    query_screens: Query<&Interaction, (With<Screen3Button>, Changed<Interaction>)>,
+    mut toggle_screen_evs: EventWriter<SetScreenInGroup>,
+) {
+    for button_interaction in query_screens.iter() {
+        if let Interaction::Pressed = button_interaction {
+            toggle_screen_evs.send(SetScreenInGroup {
+                screen_id: SCREEN_3,
+                group: SCREEN_GROUP,
+            });
+        }
+    }
+}

examples/scrollpane.rs

@@ -21,7 +21,7 @@ fn init(asset_server: Res<AssetServer>, mut commands: Commands) {
 fn ui() -> BoxedElement {
     WhCanvas::new() //
         .add_child(
-            WhScreen::new() //
+            WhScreen::new(ScreenID(1)) //
                 .bg_img("bg.png")
                 .add_child(
                     WhScrollPane::new()

examples/text_input.rs

@@ -21,7 +21,7 @@ fn init(asset_server: Res<AssetServer>, mut commands: Commands) {
 fn ui() -> BoxedElement {
     WhCanvas::new() //
         .add_child(
-            WhScreen::new()
+            WhScreen::new(ScreenID(1)) //
                 .bg_img("bg.png")
                 .direction(ElementDirection::Row, Val::Px(100.0))
                 .add_children(vec![

src/components.rs

@@ -1,6 +1,6 @@
 use bevy::prelude::*;
 
-use crate::prelude::RadioButtonGroup;
+use crate::prelude::{RadioButtonGroup, ScreenGroup, ScreenID};
 
 #[derive(Debug, Default, Component)]
 pub struct ScrollPane {
@@ -45,3 +45,10 @@ pub struct BorderChangeOnActive {
     pub focused_thickness: Val,
     pub unfocused_thickness: Val,
 }
+
+#[derive(Debug, Default, Component)]
+pub struct ToggleScreen {
+    pub active: bool,
+    pub screen_id: ScreenID,
+    pub group: Option<ScreenGroup>,
+}

src/elements/screen.rs

@@ -1,35 +1,51 @@
 use bevy::prelude::*;
 
-use crate::prelude::{BoxedElement, WhElement, WhNode};
+use crate::prelude::{BoxedElement, ScreenGroup, ScreenID, ToggleScreen, WhElement, WhNode};
 use crate::{build_children_field, build_node_field};
 
 pub struct WhScreen<Flags: Bundle> {
     pub flags: Flags,
     pub node: WhNode,
     pub children: Vec<BoxedElement>,
+    pub id: ScreenID,
+    pub group: Option<ScreenGroup>,
 }
 
 impl WhScreen<()> {
-    pub fn new() -> Box<Self> {
-        Self::with_flags(())
+    pub fn new(id: ScreenID) -> Box<Self> {
+        Self::with_flags((), id)
     }
 }
 
 impl<Flags: Bundle> WhScreen<Flags> {
     build_node_field!(node);
     build_children_field!(children);
 
-    pub fn with_flags(flags: Flags) -> Box<Self> {
+    pub fn with_flags(flags: Flags, id: ScreenID) -> Box<Self> {
         Box::new(Self {
             flags,
             node: WhNode {
                 width: Val::Percent(100.0),
                 height: Val::Percent(100.0),
+                display: Display::None,
+                position_type: PositionType::Absolute,
                 ..default()
             },
             children: Default::default(),
+            id,
+            group: None,
         })
     }
+
+    pub fn shown(mut self: Box<Self>) -> Box<Self> {
+        self.node.display = Display::Flex;
+        self
+    }
+
+    pub fn in_group(mut self: Box<Self>, group: ScreenGroup) -> Box<Self> {
+        self.group = Some(group);
+        self
+    }
 }
 
 impl<Flags: Bundle> WhElement for WhScreen<Flags> {
@@ -39,8 +55,17 @@ impl<Flags: Bundle> WhElement for WhScreen<Flags> {
         loader: &AssetServer,
         parent: Option<Entity>,
     ) {
+        let shown = self.node.display == Display::Flex;
+
         let mut cmd = self.node.build_entity(commands, loader);
-        cmd.insert(self.flags);
+        cmd.insert((
+            self.flags,
+            ToggleScreen {
+                active: shown,
+                screen_id: self.id,
+                group: self.group,
+            },
+        ));
 
         if let Some(parent) = parent {
             cmd.set_parent(parent);

src/events.rs

@@ -0,0 +1,15 @@
+use bevy::prelude::*;
+
+use crate::prelude::{ScreenGroup, ScreenID};
+
+#[derive(Debug, Event)]
+pub struct SetScreenVisible {
+    pub screen_id: ScreenID,
+    pub visible: bool,
+}
+
+#[derive(Debug, Event)]
+pub struct SetScreenInGroup {
+    pub group: ScreenGroup,
+    pub screen_id: ScreenID,
+}

src/lib.rs

@@ -1,11 +1,13 @@
 use bevy::asset::load_internal_binary_asset;
 use bevy::prelude::*;
+use events::{SetScreenInGroup, SetScreenVisible};
 
 mod systems;
 
 pub mod components;
 pub mod element;
 pub mod elements;
+pub mod events;
 pub mod macros;
 pub mod node;
 pub mod properties;
@@ -15,48 +17,52 @@ pub(crate) const CURSOR_HANDLE: Handle<Font> = Handle::weak_from_u128(1048275690
 
 pub struct WhElementsPlugin;
 impl Plugin for WhElementsPlugin {
-    fn build(&self, app: &mut App) {
+    fn build(&self, app_: &mut App) {
         // Credits to `bevy_simple_text_input` for providing this custom font.
         // <https://github.com/rparrett/bevy_simple_text_input>
         load_internal_binary_asset!(
-            app,
+            app_,
             CURSOR_HANDLE,
             "../assets/fonts/cursor.ttf",
             |bytes: &[u8], _path: String| { Font::try_from_bytes(bytes.to_vec()).unwrap() }
         );
 
-        app.add_systems(
-            Update,
-            (
-                systems::focus_on_element.in_set(SystemSets::UpdateFocus),
-                systems::unfocus_elements.in_set(SystemSets::UpdateFocus),
-                systems::text_input_from_focus.in_set(SystemSets::InheritFocus),
-                systems::mouse_scroll_pane.in_set(SystemSets::UserInteraction),
-                systems::keyboard_text_input.in_set(SystemSets::UserInteraction),
-                systems::select_radio_button.in_set(SystemSets::UserInteraction),
-                systems::text_cursor_blinker.in_set(SystemSets::Animations),
-                systems::change_border_on_focus.in_set(SystemSets::Animations),
-                systems::change_border_on_radio.in_set(SystemSets::Animations),
-            ),
-        )
-        .configure_sets(
-            Update,
-            (
-                SystemSets::UpdateFocus,
-                SystemSets::InheritFocus,
-                SystemSets::UserInteraction,
+        app_.add_event::<SetScreenVisible>()
+            .add_event::<SetScreenInGroup>()
+            .add_systems(
+                Update,
+                (
+                    systems::focus_on_element.in_set(SystemSets::UpdateFocus),
+                    systems::unfocus_elements.in_set(SystemSets::UpdateFocus),
+                    systems::text_input_from_focus.in_set(SystemSets::InheritFocus),
+                    systems::mouse_scroll_pane.in_set(SystemSets::UserInteraction),
+                    systems::keyboard_text_input.in_set(SystemSets::UserInteraction),
+                    systems::select_radio_button.in_set(SystemSets::UserInteraction),
+                    systems::text_cursor_blinker.in_set(SystemSets::Animations),
+                    systems::change_border_on_focus.in_set(SystemSets::Animations),
+                    systems::change_border_on_radio.in_set(SystemSets::Animations),
+                    systems::toggle_screen_listener.in_set(SystemSets::Animations),
+                    systems::toggle_screen_group_listener.in_set(SystemSets::Animations),
+                ),
             )
-                .chain(),
-        )
-        .configure_sets(
-            Update,
-            (
-                SystemSets::Animations.ambiguous_with(SystemSets::UpdateFocus),
-                SystemSets::Animations.ambiguous_with(SystemSets::InheritFocus),
-                SystemSets::Animations.ambiguous_with(SystemSets::UserInteraction),
-                SystemSets::Animations.ambiguous_with(SystemSets::Animations),
-            ),
-        );
+            .configure_sets(
+                Update,
+                (
+                    SystemSets::UpdateFocus,
+                    SystemSets::InheritFocus,
+                    SystemSets::UserInteraction,
+                )
+                    .chain(),
+            )
+            .configure_sets(
+                Update,
+                (
+                    SystemSets::Animations.ambiguous_with(SystemSets::UpdateFocus),
+                    SystemSets::Animations.ambiguous_with(SystemSets::InheritFocus),
+                    SystemSets::Animations.ambiguous_with(SystemSets::UserInteraction),
+                    SystemSets::Animations.ambiguous_with(SystemSets::Animations),
+                ),
+            );
     }
 }
 
@@ -72,6 +78,7 @@ pub mod prelude {
     pub use super::components::*;
     pub use super::element::*;
     pub use super::elements::*;
+    pub use super::events::*;
     pub use super::node::*;
     pub use super::properties::*;
     pub use super::text::*;