feat(Home screen): add home screen; update in settings drawer component

shell/launcher/assets/examples/settings.ron

@@ -1,4 +1,13 @@
 ({
+    "images.file.manager.app": File (
+        path: "examples/images/file-manager-app.png",
+    ),
+    "images.app.icon": File (
+        path: "examples/images/app-icon.png",
+    ),
+    "images.widget": File (
+        path: "examples/images/widget.png",
+    ),
     "fonts.primary.300": File (
         path: "fonts/SpaceGrotesk-Regular.ttf",
     ),

shell/launcher/src/components/home/mod.rs

@@ -0,0 +1,143 @@
+use bevy::{color::palettes::css::{LIGHT_BLUE, LIGHT_GREY}, prelude::*, winit::WinitSettings};
+use bevy_asset_loader::prelude::*;
+use bevy_styled_widgets::prelude::ThemeManager;
+
+use crate::{
+    StyledWidgetsPlugin,
+    settings::home::{HomeBundleType, HomeEntry, HomeScreenSettings},
+    utils::{FontAssets, Icon},
+    widgets::app_bundle::{ButtonVariant, StyledAppBundle},
+};
+mod styles;
+use styles::*;
+
+#[derive(Default, Clone, Eq, PartialEq, Debug, Hash, States)]
+enum AssetsLoadingState {
+    #[default]
+    Loading,
+    Loaded,
+}
+
+/// Loads image assets
+#[derive(AssetCollection, Resource)]
+pub struct ImageAssets {
+    #[asset(key = "images.file.manager.app")]
+    file_manager: Handle<Image>,
+
+    #[asset(key = "images.app.icon")]
+    app_icon: Handle<Image>,
+
+    #[asset(key = "images.widget")]
+    widget_icon: Handle<Image>,
+}
+
+#[derive(Component, Debug, Clone)]
+pub struct ControlName(pub String);
+
+#[derive(Default, Debug, Clone)]
+pub struct GuiSettings {
+    pub home: HomeScreenSettings,
+}
+
+pub fn run_home() {
+    App::new()
+        .add_plugins((DefaultPlugins, StyledWidgetsPlugin))
+        .insert_resource(ThemeManager::default())
+        .insert_resource(WinitSettings::desktop_app())
+        .init_state::<AssetsLoadingState>()
+        .add_loading_state(
+            LoadingState::new(AssetsLoadingState::Loading)
+                .continue_to_state(AssetsLoadingState::Loaded)
+                .with_dynamic_assets_file::<StandardDynamicAssetCollection>("examples/settings.ron")
+                .load_collection::<ImageAssets>()
+                .load_collection::<FontAssets>(),
+        )
+        .add_systems(OnEnter(AssetsLoadingState::Loaded), setup_view_root)
+        .run();
+}
+fn setup_view_root(
+    mut commands: Commands,
+    image_assets: Res<ImageAssets>,
+    font_assets: Res<FontAssets>,
+) {
+    commands.spawn(Camera2d);
+
+    let GuiSettings { home } = GuiSettings::default();
+    let HomeScreenSettings {
+        width,
+        height,
+        grid_template_columns,
+        grid_template_rows,
+        home_entries,
+    } = home;
+
+    let current_menu = "sm"; //
+    let home_entries = home_entries.get(current_menu).unwrap_or(&vec![]).clone();
+
+    // Create a root node
+    commands
+        .spawn((Node {
+            width: Val::Vw(width),
+            height: Val::Vh(height),
+            display: Display::Grid,
+            grid_template_columns: RepeatedGridTrack::flex(grid_template_columns, 1.0),
+            grid_template_rows: RepeatedGridTrack::flex(grid_template_rows, 1.0),
+            padding: ROOT_PADDING,
+            row_gap: ROW_GAP,
+            column_gap: COLUMN_GAP,
+            ..default()
+        },))
+        .with_children(
+            |parent: &mut bevy::ecs::relationship::RelatedSpawnerCommands<'_, ChildOf>| {
+                for home_entry in home_entries.clone() {
+                    spawn_menu_widget(parent, &image_assets, &home_entry);
+                }
+            },
+        );
+}
+
+fn spawn_menu_widget(
+    parent: &mut bevy::ecs::relationship::RelatedSpawnerCommands<'_, ChildOf>,
+    image_assets: &ImageAssets,
+    home_entry: &HomeEntry,
+) {
+    let HomeEntry {
+        name, bundle_type, ..
+    } = home_entry;
+
+    // kept for widget to use in future
+    let (grid_column, grid_row) = if *bundle_type == HomeBundleType::Widget {
+        (GridPlacement::span(2), GridPlacement::span(2))
+    } else {
+        (GridPlacement::span(1), GridPlacement::span(1))
+    };
+
+    let icon = match *bundle_type {
+        HomeBundleType::App => image_assets.app_icon.clone(),
+        HomeBundleType::Widget => image_assets.widget_icon.clone(),
+    };
+
+    parent.spawn((
+        Node {
+            display: Display::Grid,
+            grid_column: grid_column,
+            grid_row: grid_row,
+            padding: UiRect::all(Val::Px(4.0)),
+            align_items: AlignItems::Center,
+            justify_items: JustifyItems::Center,
+            ..Default::default()
+        }, 
+        Children::spawn(Spawn((
+            StyledAppBundle::builder()
+                .image(icon) // todo: dynamic image
+                .text(name.to_string())
+                .text_color(LIGHT_GREY.into())
+                .variant(ButtonVariant::Primary)
+                .border_radius(20.)
+                 .width(ICON_WIDTH)
+                 .height(ICON_HEIGHT)
+                .build(),
+            ControlName(name.to_string()),
+        ))),
+    ));
+}

shell/launcher/src/components/home/styles.rs

@@ -0,0 +1,11 @@
+
+use bevy::prelude::*;
+
+// medium sizes
+pub const ROOT_PADDING:UiRect =  UiRect::new(Val::Px(32.), Val::Px(32.), Val::Px(24.), Val::Px(24.));
+pub const ROW_GAP : Val=  Val::Px(4.0);
+pub const COLUMN_GAP : Val =  Val::Px(4.0);
+pub const TEXT_SIZE : f32 =  15.;
+pub const TEXT_PADDING: UiRect = UiRect::all(Val::Px(22.));
+pub const ICON_WIDTH: f32 = 84.0;
+pub const ICON_HEIGHT: f32 = 84.0;

shell/launcher/src/components/mod.rs

@@ -1,5 +1,7 @@
 pub mod status_bar;
 pub mod settings_drawer;
+pub mod home;
 
+pub use home::*;
 pub use status_bar::*;
 pub use settings_drawer::*;

shell/launcher/src/components/settings_drawer/mod.rs

@@ -5,10 +5,7 @@ use systems::control_click_system;
 mod systems;
 
 use crate::{
-    StyledWidgetsPlugin,
-    settings::settings_drawer::SettingsDrawerSettings,
-    utils::{FontAssets, Icon},
-    widgets::button::{ButtonSize, ButtonVariant, StyledButton},
+    settings::settings_drawer::SettingsDrawerSettings, utils::{FontAssets, Icon}, widgets::control_bundle::{ControlVariant, StyledControl}, StyledWidgetsPlugin
 };
 
 #[derive(Default, Clone, Eq, PartialEq, Debug, Hash, States)]
@@ -124,10 +121,10 @@ fn spawn_menu_widget(
             ..Default::default()
         },
         Children::spawn(Spawn((
-            StyledButton::builder()
+             StyledControl::builder()
                 .icon(icon)
                 .font(font_icons.clone())
-                .variant(ButtonVariant::Primary)
+                .variant(ControlVariant::Primary)
                 .border_radius(20.)
                 .on_click(click_system_id)
                 .build(),

shell/launcher/src/main.rs

@@ -1,4 +1,4 @@
-use components::{settings_drawer::run_settings_drawer, status_bar::run_status_bar};
+use components::{settings_drawer::run_settings_drawer, status_bar::run_status_bar, home::run_home};
 pub use widgets::StyledWidgetsPlugin;
 
 mod components;
@@ -7,5 +7,6 @@ mod utils;
 mod widgets;
 fn main() {
     // run_status_bar();
-    run_settings_drawer();
+    // run_settings_drawer();
+    run_home();
 }

shell/launcher/src/settings/home.rs

@@ -0,0 +1,134 @@
+use bevy::{asset::Handle, image::Image, platform::collections::HashMap};
+use bevy_asset_loader::asset_collection::AssetCollection;
+
+#[derive(Debug, Default, Clone, Copy, PartialEq, Eq, Hash)]
+pub enum HomeBundleType {
+    #[default]
+    App,
+    Widget,
+}
+
+#[derive(Debug, Clone)]
+pub struct HomeEntry {
+    pub app_id: String,
+    pub icon_name: Option<String>,
+    pub icon_path: Option<Handle<Image>>,
+    pub name: String,
+    pub bundle_type: HomeBundleType, 
+}
+
+#[derive(Debug, Clone)]
+pub struct HomeScreenSettings {
+    pub width: f32,
+    pub height: f32,
+    pub grid_template_columns: u16,
+    pub grid_template_rows: u16,
+    pub home_entries: HashMap<String, Vec<HomeEntry>>,
+}
+
+impl Default for HomeScreenSettings {
+    fn default() -> Self {
+        Self {
+            width: 100.,
+            height: 100.,
+            grid_template_columns: 4,
+            grid_template_rows: 4,
+            home_entries: HashMap::from([(
+                "sm".to_string(),
+                Vec::from([
+                    HomeEntry {
+                        app_id: "App 1".to_string(),
+                        icon_name: Some("Images".to_string()),
+                        icon_path: None,
+                        name: "App 1".to_string(),
+                        bundle_type: HomeBundleType::App,
+                    },
+                    HomeEntry {
+                        app_id: "App 2".to_string(),
+                        icon_name: None,
+                        icon_path: None,
+                        name: "App 2".to_string(),
+                        bundle_type: HomeBundleType::App,
+                    },
+                    HomeEntry {
+                        app_id: "Widget 1".to_string(),
+                        icon_name: None,
+                        icon_path: None,
+                        name: "Widget 1".to_string(),
+                        bundle_type: HomeBundleType::Widget,
+                    },
+                    HomeEntry {
+                        app_id: "App 4".to_string(),
+                        icon_name: None,
+                        icon_path: None,
+                        name: "App 4".to_string(),
+                        bundle_type: HomeBundleType::App,
+                    },
+                    HomeEntry {
+                        app_id: "App 4".to_string(),
+                        icon_name: None,
+                        icon_path: None,
+                        name: "App 4".to_string(),
+                        bundle_type: HomeBundleType::App,
+                    },
+                    HomeEntry {
+                        app_id: "App 5".to_string(),
+                        icon_name: None,
+                        icon_path: None,
+                        name: "App 5".to_string(),
+                        bundle_type: HomeBundleType::App,
+                    },
+                    HomeEntry {
+                        app_id: "App 6".to_string(),
+                        icon_name: None,
+                        icon_path: None,
+                        name: "App 6".to_string(),
+                        bundle_type: HomeBundleType::App,
+                    },
+                    HomeEntry {
+                        app_id: "App 7".to_string(),
+                        icon_name: None,
+                        icon_path: None,
+                        name: "App 7".to_string(),
+                        bundle_type: HomeBundleType::App,
+                    },
+                    HomeEntry {
+                        app_id: "App 8".to_string(),
+                        icon_name: None,
+                        icon_path: None,
+                        name: "App 8".to_string(),
+                        bundle_type: HomeBundleType::App,
+                    },
+                    HomeEntry {
+                        app_id: "App 9".to_string(),
+                        icon_name: None,
+                        icon_path: None,
+                        name: "App 9".to_string(),
+                        bundle_type: HomeBundleType::App,
+                    },
+                    HomeEntry {
+                        app_id: "App 10".to_string(),
+                        icon_name: None,
+                        icon_path: None,
+                        name: "App 10".to_string(),
+                        bundle_type: HomeBundleType::App,
+                    },
+                    HomeEntry {
+                        app_id: "App 11".to_string(),
+                        icon_name: None,
+                        icon_path: None,
+                        name: "App 11".to_string(),
+                        bundle_type: HomeBundleType::App,
+                    },
+                    HomeEntry {
+                        app_id: "App 12".to_string(),
+                        icon_name: None,
+                        icon_path: None,
+                        name: "App 12".to_string(),
+                        bundle_type: HomeBundleType::App,
+                    }
+                ]),
+            )]),
+        }
+    }
+}

shell/launcher/src/settings/mod.rs

@@ -1,2 +1,3 @@
 pub mod status_bar;
 pub mod settings_drawer;
+pub mod home;

shell/launcher/src/utils/icon.rs

@@ -43,6 +43,10 @@ pub enum Icon {
     // SignalBarsLow ,
     // NoSim ,
     // NoSignal ,
+    Folder = 0xe927,
+    Browser = 0xe928,
+    App = 0xe90a1,
+    FileManager = 0xe90f1,
 }
 
 impl Icon {