monologue-trees/bin/ui-wtf.rs

use bevy::{
    input::{keyboard::KeyboardInput, ButtonState},
    prelude::*,
    window::PrimaryWindow,
};

fn main() {
    App::new()
        .add_plugins(DefaultPlugins.set(WindowPlugin {
            primary_window: Some(Window {
                title: "UI WTF".into(),
                resolution: (640., 480.).into(),
                ..default()
            }),
            ..default()
        }))
        .init_resource::<Icon>()
        .add_systems(Startup, (init, init_cursors, init_container))
        .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,
];

#[derive(Debug, Component, Resource, Default)]
struct Icon(CursorIcon);

fn init(mut commands: Commands) {
    info!("Spawning camera");
    commands.spawn((
        Camera2dBundle { ..default() },
        UiCameraConfig { show_ui: true },
    ));
}

fn init_cursors(mut commands: Commands) {
    info!("Spawning Cursor Icons");
    commands
        .spawn(NodeBundle {
            style: Style {
                flex_direction: FlexDirection::Column,
                ..default()
            },
            background_color: BackgroundColor(Color::BLACK),
            ..default()
        })
        .with_children(|parent| {
            parent.spawn(
                TextBundle::from_section("Cursor Icons", TextStyle { ..default() })
                    .with_style(Style {
                        max_width: Val::Percent(100.0),
                        justify_self: JustifySelf::Stretch,
                        ..default()
                    })
                    .with_background_color(Color::PINK),
            );

            parent
                .spawn(NodeBundle {
                    style: Style {
                        align_items: AlignItems::FlexStart,
                        flex_direction: FlexDirection::Column,
                        flex_wrap: FlexWrap::Wrap,
                        ..default()
                    },
                    ..default()
                })
                .with_children(|parent| {
                    CURSORS.iter().for_each(|&icon| {
                        parent
                            .spawn((
                                ButtonBundle {
                                    style: Style {
                                        padding: UiRect::all(Val::Px(5.0)),
                                        margin: UiRect::all(Val::Px(5.0)),
                                        border: UiRect::all(Val::Px(2.0)),
                                        ..default()
                                    },
                                    background_color: BackgroundColor(Color::GRAY),
                                    border_color: BorderColor(Color::WHITE),
                                    ..default()
                                },
                                Icon(icon),
                            ))
                            .with_children(|parent| {
                                parent.spawn(TextBundle::from_section(
                                    format!("{:?}", icon),
                                    TextStyle { ..default() },
                                ));
                            });
                    });
                });
        });
}

fn cursors(
    events: Query<(&Interaction, &Icon), (Changed<Interaction>, With<Button>)>,
    mut primary_window: Query<&mut Window, With<PrimaryWindow>>,
    mut curr: ResMut<Icon>,
) {
    events.iter().for_each(|(&interaction, &ref icon)| {
        let mut window = primary_window.single_mut();

        match interaction {
            Interaction::Hovered => {
                (*window).cursor.icon = icon.0.clone();
            }
            Interaction::Pressed => {
                curr.0 = icon.0.clone();
            }
            Interaction::None => {
                (*window).cursor.icon = curr.0.clone();
            }
        }
    })
}

#[derive(Debug, Component)]
struct Container;

fn init_container(mut commands: Commands) {
    commands
        .spawn(NodeBundle {
            style: Style {
                flex_direction: FlexDirection::Column,
                ..default()
            },
            ..default()
        })
        .with_children(|parent| {
            parent.spawn(
                TextBundle::from_section("Grow/Shrink Container", TextStyle { ..default() })
                    .with_background_color(Color::PURPLE),
            );
            parent.spawn((
                Container,
                NodeBundle {
                    style: Style {
                        flex_direction: FlexDirection::Row,
                        flex_wrap: FlexWrap::Wrap,
                        max_width: Val::Px(250.0),
                        ..default()
                    },
                    background_color: BackgroundColor(Color::PINK),
                    ..default()
                },
            ));
        });
}

fn container(
    mut events: EventReader<KeyboardInput>,
    mut commands: Commands,
    root: Query<Entity, With<Container>>,
    children: Query<&Children, With<Container>>,
) {
    events.iter().for_each(
        |KeyboardInput {
             key_code, state, ..
         }| {
            match (key_code, state) {
                (Some(KeyCode::Up), ButtonState::Pressed) => {
                    commands.entity(root.single()).with_children(|parent| {
                        parent.spawn(NodeBundle {
                            style: Style {
                                width: Val::Px(10.0),
                                height: Val::Px(10.0),
                                padding: UiRect::all(Val::Px(10.0)),
                                margin: UiRect::all(Val::Px(10.0)),
                                ..default()
                            },
                            background_color: BackgroundColor(Color::PURPLE),
                            ..default()
                        });
                    });
                }
                (Some(KeyCode::Down), ButtonState::Pressed) => {
                    children.single().iter().last().iter().for_each(|&&child| {
                        commands.entity(child).despawn_recursive();
                    });
                }
                _ => (),
            }
        },
    )
}