-
Notifications
You must be signed in to change notification settings - Fork 193
/
popup.rs
347 lines (321 loc) · 13.2 KB
/
popup.rs
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
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
use orbtk::{
prelude::*,
// only instantiate the `default` theme
widgets::themes::theme_orbtk::{
register_default_fonts, THEME_DEFAULT, THEME_DEFAULT_COLORS_DARK, THEME_DEFAULT_FONTS,
},
};
// German localization file.
static POPUP_DE_DE: &str = include_str!("assets/popup/popup_de_DE.ron");
static DARK_EXT: &str = include_str!("assets/popup/default_dark.ron");
static ID_BUTTON: &str = "Toggle Popup";
static ID_GRID: &str = "PopupGrid";
static ID_GRID_PLACEMENT: &str = "Selection GRID";
static ID_MAIN_VIEW: &str = "MainView";
static ID_POPUP: &str = "Popup";
static ID_POPUP_STACK: &str = "PopupStack";
static ID_PLACEMENT_COMBO_BOX: &str = "Placement Selecton Box";
static ID_PLACEMENT_OFFSET: &str = "Placement Offset";
static ID_PLACEMENT_OFFSET_LABEL: &str = "Offset";
static ID_PLACEMENT_COMBO_BOX_LABEL: &str = "Placement Label";
static ID_TARGET: &str = "Target";
/// Valid `actions` that are handled as state changes in the `MainView` widget.
#[derive(Copy, Clone)]
enum MainViewAction {
/// Toggle the visibility of the popup
TogglePopup,
/// Update the offset of the popup relative to the target
UpdateOffset,
/// Update the placement of the popup relative to the target
UpdatePlacement,
}
/// Valid `structures` that are handled inside the state of the `MainView` widget.
#[derive(AsAny, Default)]
struct MainViewState {
_action: Option<MainViewAction>,
}
/// Method definitions, that react on any given state change inside the `MainView` widget.
impl MainViewState {
fn _action(&mut self, action: impl Into<Option<MainViewAction>>) {
self._action = action.into();
}
fn toggle_popup(&mut self, ctx: &mut Context<'_>) {
let open = ctx.child(ID_POPUP).clone::<bool>("open");
if open {
Popup::open_set(&mut ctx.child(ID_POPUP), false);
Popup::visibility_set(&mut ctx.child(ID_POPUP), Visibility::Collapsed);
Button::text_set(&mut ctx.child(ID_BUTTON), "Click me to show the popup");
} else {
Popup::visibility_set(&mut ctx.child(ID_POPUP), Visibility::Visible);
Popup::open_set(&mut ctx.child(ID_POPUP), true);
Button::text_set(&mut ctx.child(ID_BUTTON), "Click me to hide the popup");
}
}
fn update_placement(&mut self, ctx: &mut Context<'_>) {
let selected_index: i32 = ctx.child(ID_PLACEMENT_COMBO_BOX).clone("selected_index");
let placement: Placement = ctx.child(ID_POPUP).clone_or_default("placement");
match selected_index {
0 => Popup::placement_set(&mut ctx.child(ID_POPUP), placement.bottom()),
1 => Popup::placement_set(&mut ctx.child(ID_POPUP), placement.left()),
2 => Popup::placement_set(&mut ctx.child(ID_POPUP), placement.right()),
3 => Popup::placement_set(&mut ctx.child(ID_POPUP), placement.top()),
_ => panic!(),
}
if cfg!(debug) {
println!(
"popup_v2: Placement {:?} (index: {:?}).",
ctx.child(ID_POPUP).get::<Placement>("placement"),
selected_index
);
}
}
fn update_offset(&mut self, ctx: &mut Context<'_>) {
let offset: f64 = ctx.child(ID_PLACEMENT_OFFSET).clone("val");
Popup::offset_set(&mut ctx.child(ID_POPUP), offset);
if cfg!(debug) {
println!(
"popup_v2: Offset {:?}.",
ctx.child(ID_POPUP).get::<f64>("offset")
);
}
}
}
/// Associated methods handled inside the `MainViewState`
impl State for MainViewState {
fn init(&mut self, _registry: &mut Registry, ctx: &mut Context) {
// initialize the popup properties
let offset: f64 = ctx.child(ID_PLACEMENT_OFFSET).clone("val");
Popup::offset_set(&mut ctx.child(ID_POPUP), offset);
Popup::open_set(&mut ctx.child(ID_POPUP), false);
Popup::visibility_set(&mut ctx.child(ID_POPUP), Visibility::Collapsed);
}
fn messages(
&mut self,
mut messages: MessageReader,
_registry: &mut Registry,
ctx: &mut Context,
) {
for message in messages.read::<MainViewAction>() {
match message {
MainViewAction::TogglePopup => {
MainViewState::toggle_popup(self, ctx);
}
MainViewAction::UpdatePlacement => {
MainViewState::update_placement(self, ctx);
}
MainViewAction::UpdateOffset => {
MainViewState::update_offset(self, ctx);
}
}
}
}
}
fn theme() -> Theme {
register_default_fonts(Theme::from_config(
ThemeConfig::from(DARK_EXT)
.extend(ThemeConfig::from(THEME_DEFAULT))
.extend(ThemeConfig::from(THEME_DEFAULT_COLORS_DARK))
.extend(ThemeConfig::from(THEME_DEFAULT_FONTS)),
))
}
// Used to define ComboBox list members
type List = Vec<String>;
// constructs the MainView
widget!(
MainView<MainViewState> {
/// Active seleced index of combo box.
selected_index: i32,
/// Acitve selected position of popup.
placements: List
}
);
/// The template implementation of the main view
/// GUI elements are styled using the "style" attribute referencing to a ron based css
impl Template for MainView {
fn template(self, id: Entity, ctx: &mut BuildContext) -> Self {
let placements = vec![
// TODO: make it sort independent
"Bottom".to_string(),
"Left".to_string(),
"Right".to_string(),
"Top".to_string(),
];
let count_placements = placements.len();
let target_container = Container::new()
.id(ID_TARGET)
.attach(Grid::row(2))
.attach(Grid::column(1))
.style("container_form")
.child(
Stack::new()
.orientation("vertical")
.spacing(16.0)
.child(
TextBlock::new()
.style("target_text_block")
.text("Target")
.build(ctx),
)
.child(
TextBlock::new()
.style("target_text_block")
.text("Target content")
.build(ctx),
)
.build(ctx),
)
.build(ctx);
let popup = Popup::new()
.id(ID_POPUP)
.name(ID_POPUP)
.style("popup_form")
// alternative: popup is target of given coordinates (Point)
//.target(Point::new(0.0, 0.0))
.height(180.0)
.open(false)
.width(180.0)
.target(target_container)
.child(
Container::new()
.child(
Stack::new()
.id(ID_POPUP_STACK)
.orientation("vertical")
.spacing(16.0)
.child(
TextBlock::new()
.style("popup_text_block")
.h_align("center")
.v_align("center")
.text("Popup Header")
.build(ctx),
)
.child(
TextBlock::new()
.style("popup_text_block")
.h_align("center")
.v_align("center")
.text("Popup content")
.build(ctx),
)
.build(ctx),
)
.build(ctx),
)
.build(ctx);
let _ = ctx.append_child_to_overlay(popup);
// Widget: MainView
self.id(ID_MAIN_VIEW)
.name(ID_MAIN_VIEW)
.margin(20.0)
.placements(placements) // vector with placement strings
.child(
Grid::new()
.id(ID_GRID)
.rows("80, 200, 200, *")
.columns("200, 200, 250")
.child(
Button::new()
.id(ID_BUTTON)
.attach(Grid::row(0))
.attach(Grid::column(1))
.text("Click me to show the popup")
.on_click(move |state, _entity| -> bool {
state.send_message(MainViewAction::TogglePopup, id);
true
})
.build(ctx),
)
.child(
Grid::new()
.id(ID_GRID_PLACEMENT)
.attach(Grid::row(0))
.attach(Grid::column(2))
.rows("auto, 4, auto")
.columns("120, 8, auto")
//.style("container_form")
.name(ID_GRID_PLACEMENT)
.child(
TextBlock::new()
.id(ID_PLACEMENT_COMBO_BOX_LABEL)
.attach(Grid::row(0))
.attach(Grid::column(0))
.h_align("end")
.text("Placement:")
.v_align("center")
.build(ctx),
)
.child(
ComboBox::new()
.id(ID_PLACEMENT_COMBO_BOX)
.attach(Grid::row(0))
.attach(Grid::column(2))
.count(count_placements)
.style("popup_combo_box")
.placement(Placement::Left)
.items_builder(move |ibc, index| {
let text = MainView::placements_ref(&ibc.get_widget(id))
[index]
.clone();
TextBlock::new().v_align("center").text(text).build(ibc)
})
.on_changed("selected_index", move |states, _entity| {
states.send_message(MainViewAction::UpdatePlacement, id);
})
.selected_index(id)
.build(ctx),
)
.child(
TextBlock::new()
.id(ID_PLACEMENT_OFFSET_LABEL)
.attach(Grid::row(2))
.attach(Grid::column(0))
.h_align("end")
.text("Offset:")
.v_align("center")
.build(ctx),
)
.child(
NumericBox::new()
.id(ID_PLACEMENT_OFFSET)
.attach(Grid::row(2))
.attach(Grid::column(2))
.style("popup_numeric_box")
.max(50)
.step(1)
.val(5)
//.water_mark("in pixel")
.on_changed("val", move |states, _entity| {
states.send_message(MainViewAction::UpdateOffset, id);
})
.build(ctx),
)
.build(ctx),
)
.child(target_container)
.build(ctx),
)
}
}
fn main() {
// if no dictionary is set for the default language
// the content of the text property will drawn.
let localization = RonLocalization::create()
.language("de_DE")
//.language("en_US")
.dictionary("de_DE", POPUP_DE_DE)
.build();
Application::new()
.localization(localization)
.theme(theme())
.window(|ctx| {
Window::new()
.title("OrbTk - Popup example")
.position((100.0, 100.0))
.size(680, 690.0)
.resizable(true)
.child(MainView::new().build(ctx))
.build(ctx)
})
.run();
}