// TODO: Z-index of children should be higher than parents use bevy::prelude::*; use monologue_trees::ui::*; fn main() { App::new() .add_plugins(( DefaultPlugins.set(WindowPlugin { primary_window: Some(Window { title: "UI WTF".into(), resolution: (640., 480.).into(), ..default() }), ..default() }), GameUiPlugin, )) // .init_resource::() .add_systems(Startup, init_ui2) // .add_systems(Startup, init_ui) // .add_systems(Update, (cursors, container)) .run(); } // const CURSORS: [CursorIcon; 35] = [ // CursorIcon::Default, // CursorIcon::Crosshair, // CursorIcon::Hand, // CursorIcon::Arrow, // CursorIcon::Move, // CursorIcon::Text, // CursorIcon::Wait, // CursorIcon::Help, // CursorIcon::Progress, // CursorIcon::NotAllowed, // CursorIcon::ContextMenu, // CursorIcon::Cell, // CursorIcon::VerticalText, // CursorIcon::Alias, // CursorIcon::Copy, // CursorIcon::NoDrop, // CursorIcon::Grab, // CursorIcon::Grabbing, // CursorIcon::AllScroll, // CursorIcon::ZoomIn, // CursorIcon::ZoomOut, // CursorIcon::EResize, // CursorIcon::NResize, // CursorIcon::NeResize, // CursorIcon::NwResize, // CursorIcon::SResize, // CursorIcon::SeResize, // CursorIcon::SwResize, // CursorIcon::WResize, // CursorIcon::EwResize, // CursorIcon::NsResize, // CursorIcon::NeswResize, // CursorIcon::NwseResize, // CursorIcon::ColResize, // CursorIcon::RowResize, // ]; fn spawn_tree(parent: &mut ChildBuilder, pos: UiKitPosition) { let pos2 = match pos { UiKitPosition::Top => UiKitPosition::Left, _ => pos, }; parent .spawn(UiKitButton::new(Color::PINK)) .with_children(|parent| { parent .spawn(UiKitContainer::new(pos)) .with_children(|parent| { parent .spawn(UiKitButton::new(Color::PINK)) .with_children(|parent| { parent .spawn(UiKitContainer::new(pos2)) .with_children(|parent| { parent.spawn(UiKitButton::new(Color::PINK)); parent.spawn(UiKitButton::new(Color::PINK)); parent.spawn(UiKitButton::new(Color::PINK)); }); }); parent .spawn(UiKitButton::new(Color::PINK)) .with_children(|parent| { parent .spawn(UiKitContainer::new(pos2)) .with_children(|parent| { parent.spawn(UiKitButton::new(Color::PINK)); parent.spawn(UiKitButton::new(Color::PINK)); parent.spawn(UiKitButton::new(Color::PINK)); }); }); parent .spawn(UiKitButton::new(Color::PINK)) .with_children(|parent| { parent .spawn(UiKitContainer::new(pos2)) .with_children(|parent| { parent.spawn(UiKitButton::new(Color::PINK)); parent.spawn(UiKitButton::new(Color::PINK)); parent.spawn(UiKitButton::new(Color::PINK)); }); }); }); }); parent .spawn(UiKitButton::new(Color::PINK)) .with_children(|parent| { parent .spawn(UiKitContainer::new(pos)) .with_children(|parent| { parent .spawn(UiKitButton::new(Color::PINK)) .with_children(|parent| { parent .spawn(UiKitContainer::new(pos2)) .with_children(|parent| { parent.spawn(UiKitButton::new(Color::PINK)); parent.spawn(UiKitButton::new(Color::PINK)); parent.spawn(UiKitButton::new(Color::PINK)); }); }); parent .spawn(UiKitButton::new(Color::PINK)) .with_children(|parent| { parent .spawn(UiKitContainer::new(pos2)) .with_children(|parent| { parent.spawn(UiKitButton::new(Color::PINK)); parent.spawn(UiKitButton::new(Color::PINK)); parent.spawn(UiKitButton::new(Color::PINK)); }); }); parent .spawn(UiKitButton::new(Color::PINK)) .with_children(|parent| { parent .spawn(UiKitContainer::new(pos2)) .with_children(|parent| { parent.spawn(UiKitButton::new(Color::PINK)); parent.spawn(UiKitButton::new(Color::PINK)); parent.spawn(UiKitButton::new(Color::PINK)); }); }); }); }); parent .spawn(UiKitButton::new(Color::PINK)) .with_children(|parent| { parent .spawn(UiKitContainer::new(pos)) .with_children(|parent| { parent .spawn(UiKitButton::new(Color::PINK)) .with_children(|parent| { parent .spawn(UiKitContainer::new(pos2)) .with_children(|parent| { parent.spawn(UiKitButton::new(Color::PINK)); parent.spawn(UiKitButton::new(Color::PINK)); parent.spawn(UiKitButton::new(Color::PINK)); }); }); parent .spawn(UiKitButton::new(Color::PINK)) .with_children(|parent| { parent .spawn(UiKitContainer::new(pos2)) .with_children(|parent| { parent.spawn(UiKitButton::new(Color::PINK)); parent.spawn(UiKitButton::new(Color::PINK)); parent.spawn(UiKitButton::new(Color::PINK)); }); }); parent .spawn(UiKitButton::new(Color::PINK)) .with_children(|parent| { parent .spawn(UiKitContainer::new(pos2)) .with_children(|parent| { parent.spawn(UiKitButton::new(Color::PINK)); parent.spawn(UiKitButton::new(Color::PINK)); parent.spawn(UiKitButton::new(Color::PINK)); }); }); }); }); } fn init_ui2(mut commands: Commands) { commands.spawn(( Camera2dBundle { ..default() }, UiCameraConfig { show_ui: true }, )); commands .spawn(NodeBundle { style: Style { width: Val::Percent(100.0), height: Val::Percent(100.0), justify_content: JustifyContent::SpaceEvenly, ..default() }, background_color: BackgroundColor(Color::FUCHSIA), ..default() }) .with_children(|parent| { parent .spawn(NodeBundle { style: Style { border: UiRect::all(Val::Px(1.0)), left: Val::Px(0.0), flex_direction: FlexDirection::Column, position_type: PositionType::Absolute, align_self: AlignSelf::Center, ..default() }, background_color: BackgroundColor(Color::PURPLE), border_color: BorderColor(Color::BLACK), ..default() }) .with_children(|parent| { spawn_tree(parent, UiKitPosition::Left); }); parent .spawn(NodeBundle { style: Style { border: UiRect::all(Val::Px(1.0)), right: Val::Px(0.0), flex_direction: FlexDirection::Column, position_type: PositionType::Absolute, align_self: AlignSelf::Center, ..default() }, background_color: BackgroundColor(Color::PURPLE), border_color: BorderColor(Color::BLACK), ..default() }) .with_children(|parent| { spawn_tree(parent, UiKitPosition::Right); }); parent .spawn(NodeBundle { style: Style { border: UiRect::all(Val::Px(1.0)), top: Val::Px(0.0), flex_direction: FlexDirection::Row, position_type: PositionType::Absolute, ..default() }, background_color: BackgroundColor(Color::PURPLE), border_color: BorderColor(Color::BLACK), ..default() }) .with_children(|parent| { spawn_tree(parent, UiKitPosition::Top); }); }); } // #[derive(Debug, Component, Resource, Default)] // struct Icon(CursorIcon); // // fn init_ui(mut commands: Commands) { // commands.spawn(( // Camera2dBundle { ..default() }, // UiCameraConfig { show_ui: true }, // )); // // commands // .spawn(NodeBundle { // style: Style { // height: Val::Percent(100.0), // width: Val::Percent(100.0), // justify_content: JustifyContent::Start, // align_items: AlignItems::Start, // ..default() // }, // background_color: BackgroundColor(Color::GRAY), // ..default() // }) // .with_children(|parent| { // parent // .spawn(( // GameUiNav, // // Name::new("Game Nav"), // NodeBundle { ..default() }, // )) // .with_children(|parent| { // parent // .spawn(( // GameUiTab, // Name::new("Grow/Shrink Tab"), // NodeBundle { ..default() }, // )) // .with_children(|parent| { // parent.spawn(( // UiKitContainer::new, // GameUiSet, // // Name::new("Grow/Shrink Set"), // NodeBundle { ..default() }, // )); // }); // // parent // .spawn(( // GameUiTab, // Name::new("Cursor Icons Tab"), // NodeBundle { ..default() }, // )) // .with_children(|parent| { // parent // .spawn(( // GameUiSet, // // Name::new("Cursor Icons Set"), // NodeBundle { ..default() }, // )) // .with_children(|parent| { // CURSORS.iter().for_each(|&icon| { // parent.spawn(( // GameUiButton, // Name::new(format!("{:?}", icon)), // NodeBundle { ..default() }, // Icon(icon), // )); // }); // }); // }); // }); // }); // } // // fn cursors( // events: Query<(&Interaction, &Icon), (Changed, With