1 /**
2 * @file lv_demo_flex_layout_view_ctrl_pad.c
3 *
4 */
5
6 /*********************
7 * INCLUDES
8 *********************/
9
10 #include "lv_demo_flex_layout_main.h"
11
12 #if LV_USE_DEMO_FLEX_LAYOUT
13
14 /*********************
15 * DEFINES
16 *********************/
17
18 #define DDLIST_ALIGN_CREATE_DEF(item) \
19 do { \
20 ui->ctrl_pad.tab.align.ddlist_align_##item = \
21 ddlist_create(tab, \
22 "Align "#item" place", \
23 "start\n" \
24 "end\n" \
25 "center\n" \
26 "space evenly\n" \
27 "space around\n" \
28 "space between"); \
29 } while(0)
30
31 /**********************
32 * TYPEDEFS
33 **********************/
34
35 /**********************
36 * STATIC PROTOTYPES
37 **********************/
38
39 static void tab_flex_create(lv_obj_t * tab, view_t * ui);
40 static void tab_align_create(lv_obj_t * tab, view_t * ui);
41 static void tab_layout_create(lv_obj_t * tab, view_t * ui);
42
43 /**********************
44 * STATIC VARIABLES
45 **********************/
46
47 /**********************
48 * MACROS
49 **********************/
50
51 /**********************
52 * GLOBAL FUNCTIONS
53 **********************/
54
view_ctrl_pad_create(lv_obj_t * par,view_t * ui)55 void view_ctrl_pad_create(lv_obj_t * par, view_t * ui)
56 {
57 lv_obj_t * tv = lv_tabview_create(par);
58 lv_tabview_set_tab_bar_size(tv, 50);
59 lv_obj_set_width(tv, lv_pct(100));
60 lv_obj_set_flex_grow(tv, 1);
61 lv_obj_set_style_radius(tv, 0, 0);
62 lv_obj_set_style_bg_color(tv, lv_color_hex(0xffffff), 0);
63
64 lv_obj_t * buttons = lv_tabview_get_tab_bar(tv);
65 lv_obj_set_style_outline_width(buttons, 0, LV_PART_ITEMS | LV_STATE_FOCUS_KEY);
66 lv_obj_set_style_outline_width(buttons, 0, LV_STATE_FOCUS_KEY);
67 lv_obj_set_style_bg_color(buttons, lv_color_white(), LV_PART_ITEMS | LV_STATE_CHECKED);
68 lv_obj_set_height(buttons, 40);
69
70 ui->ctrl_pad.tab.view = tv;
71
72 ui->ctrl_pad.tab.flex.tab = lv_tabview_add_tab(tv, "Flex");
73 ui->ctrl_pad.tab.align.tab = lv_tabview_add_tab(tv, "Align");
74 ui->ctrl_pad.tab.layout.tab = lv_tabview_add_tab(tv, "Layout");
75
76 tab_flex_create(ui->ctrl_pad.tab.flex.tab, ui);
77 tab_align_create(ui->ctrl_pad.tab.align.tab, ui);
78 tab_layout_create(ui->ctrl_pad.tab.layout.tab, ui);
79 }
80
81 /**********************
82 * STATIC FUNCTIONS
83 **********************/
84
ddlist_create(lv_obj_t * par,const char * name,const char * options)85 static lv_obj_t * ddlist_create(lv_obj_t * par, const char * name, const char * options)
86 {
87 lv_obj_t * cont = lv_obj_create(par);
88 lv_obj_remove_style_all(cont);
89 lv_obj_set_size(cont, lv_pct(80), LV_SIZE_CONTENT);
90 lv_obj_set_flex_flow(cont, LV_FLEX_FLOW_COLUMN);
91
92 lv_obj_t * label = lv_label_create(cont);
93 lv_label_set_text(label, name);
94
95 lv_obj_t * ddlist = lv_dropdown_create(cont);
96 lv_obj_set_width(ddlist, lv_pct(100));
97 lv_dropdown_set_options_static(ddlist, options);
98 return ddlist;
99 }
100
tab_flex_create(lv_obj_t * tab,view_t * ui)101 static void tab_flex_create(lv_obj_t * tab, view_t * ui)
102 {
103 lv_obj_set_flex_flow(tab, LV_FLEX_FLOW_COLUMN);
104 lv_obj_set_flex_align(
105 tab,
106 LV_FLEX_ALIGN_START,
107 LV_FLEX_ALIGN_CENTER,
108 LV_FLEX_ALIGN_CENTER
109 );
110
111 ui->ctrl_pad.tab.flex.ddlist_flow = ddlist_create(
112 tab,
113 "Flow",
114 "Row\n"
115 "Column\n"
116 "Row wrap\n"
117 "Row reverse\n"
118 "Row wrap reverse\n"
119 "Column wrap\n"
120 "Column reverse\n"
121 "Column wrap reverse"
122 );
123
124 lv_obj_t * cb = lv_checkbox_create(tab);
125 lv_checkbox_set_text(cb, "Scrollable");
126 ui->ctrl_pad.tab.flex.checkbox_scrl = cb;
127 }
128
tab_align_create(lv_obj_t * tab,view_t * ui)129 static void tab_align_create(lv_obj_t * tab, view_t * ui)
130 {
131 lv_obj_set_flex_flow(tab, LV_FLEX_FLOW_COLUMN);
132 lv_obj_set_flex_align(
133 tab,
134 LV_FLEX_ALIGN_START,
135 LV_FLEX_ALIGN_CENTER,
136 LV_FLEX_ALIGN_CENTER
137 );
138
139 DDLIST_ALIGN_CREATE_DEF(main);
140 DDLIST_ALIGN_CREATE_DEF(cross);
141 DDLIST_ALIGN_CREATE_DEF(track);
142 }
143
btn_inc_event_handler(lv_event_t * e)144 static void btn_inc_event_handler(lv_event_t * e)
145 {
146 lv_obj_t * spinbox = lv_event_get_user_data(e);
147 lv_event_code_t code = lv_event_get_code(e);
148 if(code == LV_EVENT_SHORT_CLICKED || code == LV_EVENT_LONG_PRESSED_REPEAT) {
149 lv_spinbox_increment(spinbox);
150 }
151 }
152
btn_dec_event_handler(lv_event_t * e)153 static void btn_dec_event_handler(lv_event_t * e)
154 {
155 lv_obj_t * spinbox = lv_event_get_user_data(e);
156 lv_event_code_t code = lv_event_get_code(e);
157 if(code == LV_EVENT_SHORT_CLICKED || code == LV_EVENT_LONG_PRESSED_REPEAT) {
158 lv_spinbox_decrement(spinbox);
159 }
160 }
161
spinbox_ctrl_create(lv_obj_t * par,lv_style_prop_t prop,lv_obj_t ** cont_)162 static lv_obj_t * spinbox_ctrl_create(lv_obj_t * par, lv_style_prop_t prop, lv_obj_t ** cont_)
163 {
164 lv_obj_t * cont_main = par;
165 lv_obj_t * label;
166
167 lv_obj_t * cont_spinbox = lv_obj_create(cont_main);
168 if(cont_) *cont_ = cont_spinbox;
169 lv_obj_remove_style_all(cont_spinbox);
170 lv_obj_set_height(cont_spinbox, LV_SIZE_CONTENT);
171 lv_obj_set_flex_grow(cont_spinbox, 1);
172 lv_obj_set_style_radius(cont_spinbox, 5, LV_PART_MAIN);
173 lv_obj_set_style_clip_corner(cont_spinbox, true, LV_PART_MAIN);
174 lv_obj_set_style_outline_width(cont_spinbox, 2, LV_PART_MAIN);
175 lv_obj_set_style_outline_color(cont_spinbox, lv_color_hex3(0xddd), LV_PART_MAIN);
176
177 lv_obj_set_flex_flow(cont_spinbox, LV_FLEX_FLOW_ROW);
178 lv_obj_set_style_flex_main_place(cont_spinbox, LV_FLEX_ALIGN_CENTER, LV_PART_MAIN);
179
180 static lv_style_t btn_style;
181 if(btn_style.prop_cnt < 1) {
182 lv_style_init(&btn_style);
183 lv_style_set_radius(&btn_style, 0);
184 lv_style_set_outline_width(&btn_style, 1);
185 lv_style_set_outline_pad(&btn_style, 1);
186 lv_style_set_outline_color(&btn_style, lv_color_hex3(0xddd));
187 lv_style_set_shadow_width(&btn_style, 0);
188 lv_style_set_bg_color(&btn_style, lv_color_white());
189 lv_style_set_text_color(&btn_style, lv_theme_get_color_primary(par));
190 }
191
192 lv_obj_t * btn_dec = lv_button_create(cont_spinbox);
193 lv_obj_set_width(btn_dec, 30);
194 lv_obj_add_style(btn_dec, &btn_style, LV_PART_MAIN);
195 label = lv_label_create(btn_dec);
196 lv_label_set_text(label, "-");
197 lv_obj_center(label);
198
199 lv_obj_t * spinbox = lv_spinbox_create(cont_spinbox);
200 lv_obj_set_flex_grow(spinbox, 1);
201 lv_obj_set_style_shadow_width(spinbox, 0, LV_PART_MAIN);
202 lv_obj_set_style_border_width(spinbox, 0, LV_PART_MAIN);
203 lv_obj_set_style_outline_width(spinbox, 1, LV_PART_MAIN);
204 lv_obj_set_style_outline_pad(spinbox, 1, LV_PART_MAIN);
205 lv_obj_set_style_outline_color(spinbox, lv_color_hex3(0xddd), LV_PART_MAIN);
206 lv_obj_set_style_radius(spinbox, 0, LV_PART_MAIN);
207 lv_obj_set_user_data(spinbox, (void *)(lv_uintptr_t)prop);
208 lv_spinbox_set_range(spinbox, LV_COORD_MIN, LV_COORD_MAX);
209 lv_spinbox_set_digit_format(spinbox, 3, 0);
210 lv_spinbox_step_prev(spinbox);
211
212 lv_obj_t * btn_inc = lv_button_create(cont_spinbox);
213 lv_obj_set_width(btn_inc, 30);
214 lv_obj_add_style(btn_inc, &btn_style, LV_PART_MAIN);
215 label = lv_label_create(btn_inc);
216 lv_label_set_text(label, "+");
217 lv_obj_center(label);
218
219 lv_obj_add_event_cb(btn_inc, btn_inc_event_handler, LV_EVENT_ALL, spinbox);
220 lv_obj_add_event_cb(btn_dec, btn_dec_event_handler, LV_EVENT_ALL, spinbox);
221
222 return spinbox;
223 }
224
tab_layout_create(lv_obj_t * tab,view_t * ui)225 static void tab_layout_create(lv_obj_t * tab, view_t * ui)
226 {
227 lv_obj_set_flex_flow(tab, LV_FLEX_FLOW_COLUMN);
228 lv_obj_set_style_pad_gap(tab, 5, LV_PART_MAIN);
229 lv_obj_set_flex_align(
230 tab,
231 LV_FLEX_ALIGN_START,
232 LV_FLEX_ALIGN_CENTER,
233 LV_FLEX_ALIGN_CENTER
234 );
235
236 static lv_style_t group_style;
237 lv_style_init(&group_style);
238 lv_style_set_pad_all(&group_style, 2);
239 lv_style_set_border_width(&group_style, 0);
240 lv_style_set_width(&group_style, LV_PCT(100));
241 lv_style_set_height(&group_style, LV_SIZE_CONTENT);
242
243 lv_obj_t * label = lv_label_create(tab);
244 lv_obj_set_style_pad_top(label, 10, LV_PART_MAIN);
245 lv_checkbox_set_text(label, "WIDTH x HEIGHT");
246
247 lv_obj_t * temp_group = lv_obj_create(tab);
248 ui->ctrl_pad.tab.layout.group_width_and_height = temp_group;
249 lv_obj_add_style(temp_group, &group_style, LV_PART_MAIN);
250 lv_obj_set_flex_flow(temp_group, LV_FLEX_FLOW_ROW);
251 lv_obj_set_flex_align(temp_group, LV_FLEX_ALIGN_START, LV_FLEX_ALIGN_CENTER, LV_FLEX_ALIGN_CENTER);
252 ui->ctrl_pad.tab.layout.spinbox_width = spinbox_ctrl_create(temp_group, LV_STYLE_WIDTH, NULL);
253 ui->ctrl_pad.tab.layout.spinbox_height = spinbox_ctrl_create(temp_group, LV_STYLE_HEIGHT, NULL);
254
255 label = lv_label_create(tab);
256 lv_obj_set_style_pad_top(label, 10, LV_PART_MAIN);
257 lv_checkbox_set_text(label, "MIN-WIDTH x MIN-HEIGHT");
258
259 temp_group = lv_obj_create(tab);
260 ui->ctrl_pad.tab.layout.group_width_and_height_min = temp_group;
261 lv_obj_add_style(temp_group, &group_style, LV_PART_MAIN);
262 lv_obj_set_flex_flow(temp_group, LV_FLEX_FLOW_ROW);
263 lv_obj_set_flex_align(temp_group, LV_FLEX_ALIGN_START, LV_FLEX_ALIGN_CENTER, LV_FLEX_ALIGN_CENTER);
264 ui->ctrl_pad.tab.layout.spinbox_min_width = spinbox_ctrl_create(temp_group, LV_STYLE_MIN_WIDTH, NULL);
265 ui->ctrl_pad.tab.layout.spinbox_min_height = spinbox_ctrl_create(temp_group, LV_STYLE_MIN_HEIGHT, NULL);
266
267 label = lv_label_create(tab);
268 lv_obj_set_style_pad_top(label, 10, LV_PART_MAIN);
269 lv_checkbox_set_text(label, "MAX-WIDTH x MAX-HEIGHT");
270
271 temp_group = lv_obj_create(tab);
272 ui->ctrl_pad.tab.layout.group_width_and_height_max = temp_group;
273 lv_obj_add_style(temp_group, &group_style, LV_PART_MAIN);
274 lv_obj_set_flex_flow(temp_group, LV_FLEX_FLOW_ROW);
275 lv_obj_set_flex_align(temp_group, LV_FLEX_ALIGN_START, LV_FLEX_ALIGN_CENTER, LV_FLEX_ALIGN_CENTER);
276 ui->ctrl_pad.tab.layout.spinbox_max_width = spinbox_ctrl_create(temp_group, LV_STYLE_MAX_WIDTH, NULL);
277 ui->ctrl_pad.tab.layout.spinbox_max_height = spinbox_ctrl_create(temp_group, LV_STYLE_MAX_HEIGHT, NULL);
278
279 temp_group = lv_obj_create(tab);
280 ui->ctrl_pad.tab.layout.group_width_and_height_max = temp_group;
281 lv_obj_add_style(temp_group, &group_style, LV_PART_MAIN);
282 lv_obj_set_style_pad_top(temp_group, 20, LV_PART_MAIN);
283 lv_obj_set_flex_flow(temp_group, LV_FLEX_FLOW_ROW_WRAP);
284 lv_obj_set_flex_align(temp_group, LV_FLEX_ALIGN_CENTER, LV_FLEX_ALIGN_CENTER, LV_FLEX_ALIGN_CENTER);
285
286 lv_obj_t * temp_cont;
287 ui->ctrl_pad.tab.layout.spinbox_pad_top = spinbox_ctrl_create(temp_group, LV_STYLE_PAD_TOP, &temp_cont);
288 lv_obj_set_style_width(ui->ctrl_pad.tab.layout.spinbox_pad_top, 30, LV_PART_MAIN);
289 lv_obj_set_flex_grow(temp_cont, 0);
290 ui->ctrl_pad.tab.layout.spinbox_pad_left = spinbox_ctrl_create(temp_group, LV_STYLE_PAD_LEFT, &temp_cont);
291 lv_obj_add_flag(temp_cont, LV_OBJ_FLAG_FLEX_IN_NEW_TRACK);
292 label = lv_label_create(temp_group);
293 lv_checkbox_set_text(label, "PADDING");
294 ui->ctrl_pad.tab.layout.spinbox_pad_right = spinbox_ctrl_create(temp_group, LV_STYLE_PAD_RIGHT, NULL);
295 ui->ctrl_pad.tab.layout.spinbox_pad_bottom = spinbox_ctrl_create(temp_group, LV_STYLE_PAD_BOTTOM, &temp_cont);
296 lv_obj_set_flex_grow(temp_cont, 0);
297 lv_obj_add_flag(temp_cont, LV_OBJ_FLAG_FLEX_IN_NEW_TRACK);
298
299 label = lv_label_create(tab);
300 lv_obj_set_style_pad_top(label, 20, LV_PART_MAIN);
301 lv_checkbox_set_text(label, "PAD: COL x ROW x GROW");
302
303 temp_group = lv_obj_create(tab);
304 ui->ctrl_pad.tab.layout.group_width_and_height_max = temp_group;
305 lv_obj_add_style(temp_group, &group_style, LV_PART_MAIN);
306 lv_obj_set_flex_flow(temp_group, LV_FLEX_FLOW_COLUMN);
307 lv_obj_set_flex_align(temp_group, LV_FLEX_ALIGN_START, LV_FLEX_ALIGN_CENTER, LV_FLEX_ALIGN_CENTER);
308 ui->ctrl_pad.tab.layout.spinbox_pad_column = spinbox_ctrl_create(temp_group, LV_STYLE_PAD_COLUMN, NULL);
309 ui->ctrl_pad.tab.layout.spinbox_pad_row = spinbox_ctrl_create(temp_group, LV_STYLE_PAD_ROW, NULL);
310 ui->ctrl_pad.tab.layout.spinbox_flex_grow = spinbox_ctrl_create(temp_group, LV_STYLE_FLEX_GROW, NULL);
311 }
312
313 #endif
314
