makara 0.2.11

A Bevy UI simplifier that make it easy to build GUI app with bevy engine.
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

use makara::prelude::*;
use bevy::prelude::*;

// Use bevy's resource as an app state.
#[derive(Resource, Default)]
struct Count(i32);

fn main() {
    App::new()
        .add_plugins(MakaraPlugin::default())
        .insert_resource(Count(0)) // don't forget to insert resource
        .add_systems(Startup, setup)
        .run();
}

fn on_plus_click(_click: On<Clicked>, mut count: ResMut<Count>, mut text_q: TextQuery) {
    if let Some(mut text_widget) = text_q.find_by_id("#count-text") {
        count.0 += 1;
        text_widget.set_text(&format!("Count: {:?}", count.0));
    }
}

fn on_minus_click(_click: On<Clicked>, mut count: ResMut<Count>, mut text_q: TextQuery) {
    if let Some(mut text_widget) = text_q.find_by_id("#count-text") {
        count.0 -= 1;
        text_widget.set_text(&format!("Count: {:?}", count.0));
    }
}

fn setup(mut commands: Commands, count: Res<Count>) {
    commands.spawn(
        root_!(
            align_items: AlignItems::Center,
            justify_content: JustifyContent::Center;

            [
                text_!(&format!("Count: {:?}", count.0), id: "#count-text"),

                row_!(
                    justify_content: JustifyContent::Center,
                    margin_top: px(5);

                    [
                        button_!("+", class: "is-light", margin_right: px(5); on: on_plus_click),
                        button_!("-", class: "is-dark", margin_left: px(5); on: on_minus_click),
                    ]
                )
            ]
        )
    );
}