bevy_easy_ui 0.1.0

A declarative, fluent builder-pattern abstraction layer on top of Bevy's UI system.
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

use bevy::prelude::*;
use bevy_easy_ui::prelude::*;

fn main() {
  App::new()
    .add_plugins(DefaultPlugins)
    .add_systems(Startup, setup)
    .run();
}

fn hover_in(hover_in: On<Pointer<Over>>, mut commands: Commands) {
  commands
    .entity(hover_in.entity)
    .insert(BackgroundColor(LIGHT_GRAY.into()));
}

fn hover_out(hover_out: On<Pointer<Out>>, mut commands: Commands) {
  commands
    .entity(hover_out.entity)
    .insert(BackgroundColor(BLUE.into()));
}

fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
  commands.spawn(Camera2d);

  let icon = asset_server.load("bevy.png");

  EasyVerticalLayout::new()
    .with_z_index(0)
    .with_width(percent(100.))
    .with_height(percent(100.))
    .with_justify_content(JustifyContent::Center)
    .with_align_items(AlignItems::Center)
    .with_row_gap(px(20.))
    .with_child(
      EasyButton::new()
        .with_z_index(1)
        .with_background_color(BLUE.into())
        .with_border_color(DARK_BLUE.into())
        .with_border(px(2.), px(50.))
        .with_padding(px(8.))
        .with_observer(hover_in)
        .with_observer(hover_out)
        .with_child(
          EasyImage::new()
            .with_image(icon.clone())
            .with_z_index(2)
            .with_width(px(64.))
            .with_height(px(64.)),
        ),
    )
    .with_child(
      EasyButton::new()
        .with_z_index(1)
        .with_background_color(BLUE.into())
        .with_border_color(DARK_BLUE.into())
        .with_border(px(2.), px(50.))
        .with_padding(px(8.))
        .with_observer(hover_in)
        .with_observer(hover_out)
        .with_child(
          EasyImage::new()
            .with_image(icon)
            .with_z_index(2)
            .with_width(px(32.))
            .with_height(px(32.)),
        ),
    )
    .spawn(&mut commands);
}