Newer
Older
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
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
use bevy::prelude::*;
use kayak_ui::prelude::{widgets::*, *};
use crate::TodoList;
#[derive(Component, Default, Clone, PartialEq, Eq)]
pub struct TodoInputProps;
impl Widget for TodoInputProps {}
#[derive(Bundle)]
pub struct TodoInputBundle {
pub widget: TodoInputProps,
pub focusable: Focusable,
pub styles: KStyle,
pub computed_styles: ComputedStyles,
pub widget_name: WidgetName,
}
impl Default for TodoInputBundle {
fn default() -> Self {
Self {
widget: TodoInputProps,
focusable: Default::default(),
styles: KStyle::default(),
computed_styles: ComputedStyles(KStyle {
render_command: StyleProp::Value(RenderCommand::Layout),
// height: StyleProp::Value(Units::Stretch(1.0)),
height: StyleProp::Value(Units::Auto),
width: StyleProp::Value(Units::Stretch(1.0)),
bottom: StyleProp::Value(Units::Pixels(20.0)),
..KStyle::default()
}),
widget_name: TodoInputProps.get_name(),
}
}
}
pub fn render_todo_input(
In(entity): In<Entity>,
widget_context: Res<KayakWidgetContext>,
mut commands: Commands,
todo_list: Res<TodoList>,
) -> bool {
let on_change = OnChange::new(
move |In((_, value)): In<(Entity, String)>, mut todo_list: ResMut<TodoList>| {
todo_list.new_item = value;
},
);
let handle_click = OnEvent::new(
move |In(_entity): In<Entity>, event: Res<KEvent>, mut todo_list: ResMut<TodoList>| {
if let EventType::Click(..) = event.event_type {
if !todo_list.new_item.is_empty() {
let value = todo_list.new_item.clone();
todo_list.items.push(value);
todo_list.new_item.clear();
}
}
},
);
let parent_id = Some(entity);
rsx! {
<ElementBundle
id={"element_bundle"}
styles={KStyle {
layout_type: StyleProp::Value(LayoutType::Row),
height: StyleProp::Value(Units::Pixels(32.0)),
cursor: StyleProp::Value(KCursorIcon(CursorIcon::Text)),
..Default::default()
}}
>
{
// You can spawn whatever you want on UI widgets this way! :)
commands.entity(element_bundle).insert(Focusable);
}
<TextBoxBundle
styles={KStyle {
// bottom: StyleProp::Value(Units::Stretch(1.0)),
// top: StyleProp::Value(Units::Stretch(1.0)),
..Default::default()
}}
text_box={TextBoxProps {
value: todo_list.new_item.clone(),
placeholder: Some("Add item here..".into()),
..Default::default()
}}
on_change={on_change}
/>
<KButtonBundle
styles={KStyle {
width: StyleProp::Value(Units::Pixels(32.0)),
height: StyleProp::Value(Units::Pixels(32.0)),
left: StyleProp::Value(Units::Pixels(5.0)),
..Default::default()
}}
button={KButton {
text: "+".into(),
}}
on_event={handle_click}
/>
</ElementBundle>
};
true
}