1 /**
2  * @file lv_demo_widgets.c
3  *
4  */
5 
6 /*********************
7  *      INCLUDES
8  *********************/
9 #include "lv_demo_widgets.h"
10 
11 #if LV_USE_DEMO_WIDGETS
12 
13 #if LV_MEM_CUSTOM == 0 && LV_MEM_SIZE < (38ul * 1024ul)
14     #error Insufficient memory for lv_demo_widgets. Please set LV_MEM_SIZE to at least 38KB (38ul * 1024ul).  48KB is recommended.
15 #endif
16 
17 /*********************
18  *      DEFINES
19  *********************/
20 
21 /**********************
22  *      TYPEDEFS
23  **********************/
24 typedef enum {
25     DISP_SMALL,
26     DISP_MEDIUM,
27     DISP_LARGE,
28 } disp_size_t;
29 
30 /**********************
31  *  STATIC PROTOTYPES
32  **********************/
33 static void profile_create(lv_obj_t * parent);
34 static void analytics_create(lv_obj_t * parent);
35 static void shop_create(lv_obj_t * parent);
36 static void color_changer_create(lv_obj_t * parent);
37 
38 static lv_obj_t * create_meter_box(lv_obj_t * parent, const char * title, const char * text1, const char * text2,
39                                    const char * text3);
40 static lv_obj_t * create_shop_item(lv_obj_t * parent, const void * img_src, const char * name, const char * category,
41                                    const char * price);
42 
43 static void color_changer_event_cb(lv_event_t * e);
44 static void color_event_cb(lv_event_t * e);
45 static void ta_event_cb(lv_event_t * e);
46 static void birthday_event_cb(lv_event_t * e);
47 static void calendar_event_cb(lv_event_t * e);
48 static void slider_event_cb(lv_event_t * e);
49 static void chart_event_cb(lv_event_t * e);
50 static void shop_chart_event_cb(lv_event_t * e);
51 static void meter1_indic1_anim_cb(void * var, int32_t v);
52 static void meter1_indic2_anim_cb(void * var, int32_t v);
53 static void meter1_indic3_anim_cb(void * var, int32_t v);
54 static void meter2_timer_cb(lv_timer_t * timer);
55 static void meter3_anim_cb(void * var, int32_t v);
56 
57 /**********************
58  *  STATIC VARIABLES
59  **********************/
60 static disp_size_t disp_size;
61 
62 static lv_obj_t * tv;
63 static lv_obj_t * calendar;
64 static lv_style_t style_text_muted;
65 static lv_style_t style_title;
66 static lv_style_t style_icon;
67 static lv_style_t style_bullet;
68 
69 static lv_obj_t * meter1;
70 static lv_obj_t * meter2;
71 static lv_obj_t * meter3;
72 
73 static lv_obj_t * chart1;
74 static lv_obj_t * chart2;
75 static lv_obj_t * chart3;
76 
77 static lv_chart_series_t * ser1;
78 static lv_chart_series_t * ser2;
79 static lv_chart_series_t * ser3;
80 static lv_chart_series_t * ser4;
81 
82 static const lv_font_t * font_large;
83 static const lv_font_t * font_normal;
84 
85 static uint32_t session_desktop = 1000;
86 static uint32_t session_tablet = 1000;
87 static uint32_t session_mobile = 1000;
88 
89 /**********************
90  *      MACROS
91  **********************/
92 
93 /**********************
94  *   GLOBAL FUNCTIONS
95  **********************/
96 
lv_demo_widgets(void)97 void lv_demo_widgets(void)
98 {
99     if(LV_HOR_RES <= 320) disp_size = DISP_SMALL;
100     else if(LV_HOR_RES < 720) disp_size = DISP_MEDIUM;
101     else disp_size = DISP_LARGE;
102 
103     font_large = LV_FONT_DEFAULT;
104     font_normal = LV_FONT_DEFAULT;
105 
106     lv_coord_t tab_h;
107     if(disp_size == DISP_LARGE) {
108         tab_h = 70;
109 #if LV_FONT_MONTSERRAT_24
110         font_large     = &lv_font_montserrat_24;
111 #else
112         LV_LOG_WARN("LV_FONT_MONTSERRAT_24 is not enabled for the widgets demo. Using LV_FONT_DEFAULT instead.");
113 #endif
114 #if LV_FONT_MONTSERRAT_16
115         font_normal    = &lv_font_montserrat_16;
116 #else
117         LV_LOG_WARN("LV_FONT_MONTSERRAT_16 is not enabled for the widgets demo. Using LV_FONT_DEFAULT instead.");
118 #endif
119     }
120     else if(disp_size == DISP_MEDIUM) {
121         tab_h = 45;
122 #if LV_FONT_MONTSERRAT_20
123         font_large     = &lv_font_montserrat_20;
124 #else
125         LV_LOG_WARN("LV_FONT_MONTSERRAT_20 is not enabled for the widgets demo. Using LV_FONT_DEFAULT instead.");
126 #endif
127 #if LV_FONT_MONTSERRAT_14
128         font_normal    = &lv_font_montserrat_14;
129 #else
130         LV_LOG_WARN("LV_FONT_MONTSERRAT_14 is not enabled for the widgets demo. Using LV_FONT_DEFAULT instead.");
131 #endif
132     }
133     else {   /* disp_size == DISP_SMALL */
134         tab_h = 45;
135 #if LV_FONT_MONTSERRAT_18
136         font_large     = &lv_font_montserrat_18;
137 #else
138         LV_LOG_WARN("LV_FONT_MONTSERRAT_18 is not enabled for the widgets demo. Using LV_FONT_DEFAULT instead.");
139 #endif
140 #if LV_FONT_MONTSERRAT_12
141         font_normal    = &lv_font_montserrat_12;
142 #else
143         LV_LOG_WARN("LV_FONT_MONTSERRAT_12 is not enabled for the widgets demo. Using LV_FONT_DEFAULT instead.");
144 #endif
145     }
146 
147 #if LV_USE_THEME_DEFAULT
148     lv_theme_default_init(NULL, lv_palette_main(LV_PALETTE_BLUE), lv_palette_main(LV_PALETTE_RED), LV_THEME_DEFAULT_DARK,
149                           font_normal);
150 #endif
151 
152     lv_style_init(&style_text_muted);
153     lv_style_set_text_opa(&style_text_muted, LV_OPA_50);
154 
155     lv_style_init(&style_title);
156     lv_style_set_text_font(&style_title, font_large);
157 
158     lv_style_init(&style_icon);
159     lv_style_set_text_color(&style_icon, lv_theme_get_color_primary(NULL));
160     lv_style_set_text_font(&style_icon, font_large);
161 
162     lv_style_init(&style_bullet);
163     lv_style_set_border_width(&style_bullet, 0);
164     lv_style_set_radius(&style_bullet, LV_RADIUS_CIRCLE);
165 
166     tv = lv_tabview_create(lv_scr_act(), LV_DIR_TOP, tab_h);
167 
168     lv_obj_set_style_text_font(lv_scr_act(), font_normal, 0);
169 
170     if(disp_size == DISP_LARGE) {
171         lv_obj_t * tab_btns = lv_tabview_get_tab_btns(tv);
172         lv_obj_set_style_pad_left(tab_btns, LV_HOR_RES / 2, 0);
173         lv_obj_t * logo = lv_img_create(tab_btns);
174         LV_IMG_DECLARE(img_lvgl_logo);
175         lv_img_set_src(logo, &img_lvgl_logo);
176         lv_obj_align(logo, LV_ALIGN_LEFT_MID, -LV_HOR_RES / 2 + 25, 0);
177 
178         lv_obj_t * label = lv_label_create(tab_btns);
179         lv_obj_add_style(label, &style_title, 0);
180         lv_label_set_text(label, "LVGL v8");
181         lv_obj_align_to(label, logo, LV_ALIGN_OUT_RIGHT_TOP, 10, 0);
182 
183         label = lv_label_create(tab_btns);
184         lv_label_set_text(label, "Widgets demo");
185         lv_obj_add_style(label, &style_text_muted, 0);
186         lv_obj_align_to(label, logo, LV_ALIGN_OUT_RIGHT_BOTTOM, 10, 0);
187     }
188 
189     lv_obj_t * t1 = lv_tabview_add_tab(tv, "Profile");
190     lv_obj_t * t2 = lv_tabview_add_tab(tv, "Analytics");
191     lv_obj_t * t3 = lv_tabview_add_tab(tv, "Shop");
192     profile_create(t1);
193     analytics_create(t2);
194     shop_create(t3);
195 
196     color_changer_create(tv);
197 }
198 
199 /**********************
200  *   STATIC FUNCTIONS
201  **********************/
202 
profile_create(lv_obj_t * parent)203 static void profile_create(lv_obj_t * parent)
204 {
205     lv_obj_t * panel1 = lv_obj_create(parent);
206     lv_obj_set_height(panel1, LV_SIZE_CONTENT);
207 
208     LV_IMG_DECLARE(img_demo_widgets_avatar);
209     lv_obj_t * avatar = lv_img_create(panel1);
210     lv_img_set_src(avatar, &img_demo_widgets_avatar);
211 
212     lv_obj_t * name = lv_label_create(panel1);
213     lv_label_set_text(name, "Elena Smith");
214     lv_obj_add_style(name, &style_title, 0);
215 
216     lv_obj_t * dsc = lv_label_create(panel1);
217     lv_obj_add_style(dsc, &style_text_muted, 0);
218     lv_label_set_text(dsc, "This is a short description of me. Take a look at my profile!");
219     lv_label_set_long_mode(dsc, LV_LABEL_LONG_WRAP);
220 
221     lv_obj_t * email_icn = lv_label_create(panel1);
222     lv_obj_add_style(email_icn, &style_icon, 0);
223     lv_label_set_text(email_icn, LV_SYMBOL_ENVELOPE);
224 
225     lv_obj_t * email_label = lv_label_create(panel1);
226     lv_label_set_text(email_label, "elena@smith.com");
227 
228     lv_obj_t * call_icn = lv_label_create(panel1);
229     lv_obj_add_style(call_icn, &style_icon, 0);
230     lv_label_set_text(call_icn, LV_SYMBOL_CALL);
231 
232     lv_obj_t * call_label = lv_label_create(panel1);
233     lv_label_set_text(call_label, "+79 246 123 4567");
234 
235     lv_obj_t * log_out_btn = lv_btn_create(panel1);
236     lv_obj_set_height(log_out_btn, LV_SIZE_CONTENT);
237 
238     lv_obj_t * label = lv_label_create(log_out_btn);
239     lv_label_set_text(label, "Log out");
240     lv_obj_center(label);
241 
242     lv_obj_t * invite_btn = lv_btn_create(panel1);
243     lv_obj_add_state(invite_btn, LV_STATE_DISABLED);
244     lv_obj_set_height(invite_btn, LV_SIZE_CONTENT);
245 
246     label = lv_label_create(invite_btn);
247     lv_label_set_text(label, "Invite");
248     lv_obj_center(label);
249 
250     /*Create a keyboard*/
251     lv_obj_t * kb = lv_keyboard_create(lv_scr_act());
252     lv_obj_add_flag(kb, LV_OBJ_FLAG_HIDDEN);
253 
254     /*Create the second panel*/
255     lv_obj_t * panel2 = lv_obj_create(parent);
256     lv_obj_set_height(panel2, LV_SIZE_CONTENT);
257 
258     lv_obj_t * panel2_title = lv_label_create(panel2);
259     lv_label_set_text(panel2_title, "Your profile");
260     lv_obj_add_style(panel2_title, &style_title, 0);
261 
262     lv_obj_t * user_name_label = lv_label_create(panel2);
263     lv_label_set_text(user_name_label, "User name");
264     lv_obj_add_style(user_name_label, &style_text_muted, 0);
265 
266     lv_obj_t * user_name = lv_textarea_create(panel2);
267     lv_textarea_set_one_line(user_name, true);
268     lv_textarea_set_placeholder_text(user_name, "Your name");
269     lv_obj_add_event_cb(user_name, ta_event_cb, LV_EVENT_ALL, kb);
270 
271     lv_obj_t * password_label = lv_label_create(panel2);
272     lv_label_set_text(password_label, "Password");
273     lv_obj_add_style(password_label, &style_text_muted, 0);
274 
275     lv_obj_t * password = lv_textarea_create(panel2);
276     lv_textarea_set_one_line(password, true);
277     lv_textarea_set_password_mode(password, true);
278     lv_textarea_set_placeholder_text(password, "Min. 8 chars.");
279     lv_obj_add_event_cb(password, ta_event_cb, LV_EVENT_ALL, kb);
280 
281     lv_obj_t * gender_label = lv_label_create(panel2);
282     lv_label_set_text(gender_label, "Gender");
283     lv_obj_add_style(gender_label, &style_text_muted, 0);
284 
285     lv_obj_t * gender = lv_dropdown_create(panel2);
286     lv_dropdown_set_options_static(gender, "Male\nFemale\nOther");
287 
288     lv_obj_t * birthday_label = lv_label_create(panel2);
289     lv_label_set_text(birthday_label, "Birthday");
290     lv_obj_add_style(birthday_label, &style_text_muted, 0);
291 
292     lv_obj_t * birthdate = lv_textarea_create(panel2);
293     lv_textarea_set_one_line(birthdate, true);
294     lv_obj_add_event_cb(birthdate, birthday_event_cb, LV_EVENT_ALL, NULL);
295 
296     /*Create the third panel*/
297     lv_obj_t * panel3 = lv_obj_create(parent);
298     lv_obj_t * panel3_title = lv_label_create(panel3);
299     lv_label_set_text(panel3_title, "Your skills");
300     lv_obj_add_style(panel3_title, &style_title, 0);
301 
302     lv_obj_t * experience_label = lv_label_create(panel3);
303     lv_label_set_text(experience_label, "Experience");
304     lv_obj_add_style(experience_label, &style_text_muted, 0);
305 
306     lv_obj_t * slider1 = lv_slider_create(panel3);
307     lv_obj_set_width(slider1, LV_PCT(95));
308     lv_obj_add_event_cb(slider1, slider_event_cb, LV_EVENT_ALL, NULL);
309     lv_obj_refresh_ext_draw_size(slider1);
310 
311     lv_obj_t * team_player_label = lv_label_create(panel3);
312     lv_label_set_text(team_player_label, "Team player");
313     lv_obj_add_style(team_player_label, &style_text_muted, 0);
314 
315     lv_obj_t * sw1 = lv_switch_create(panel3);
316 
317     lv_obj_t * hard_working_label = lv_label_create(panel3);
318     lv_label_set_text(hard_working_label, "Hard-working");
319     lv_obj_add_style(hard_working_label, &style_text_muted, 0);
320 
321     lv_obj_t * sw2 = lv_switch_create(panel3);
322 
323     if(disp_size == DISP_LARGE) {
324         static lv_coord_t grid_main_col_dsc[] = {LV_GRID_FR(1), LV_GRID_FR(1), LV_GRID_TEMPLATE_LAST};
325         static lv_coord_t grid_main_row_dsc[] = {LV_GRID_CONTENT, LV_GRID_CONTENT, LV_GRID_TEMPLATE_LAST};
326 
327         /*Create the top panel*/
328         static lv_coord_t grid_1_col_dsc[] = {LV_GRID_CONTENT, 5, LV_GRID_CONTENT, LV_GRID_FR(2), LV_GRID_FR(1), LV_GRID_FR(1), LV_GRID_TEMPLATE_LAST};
329         static lv_coord_t grid_1_row_dsc[] = {LV_GRID_CONTENT, LV_GRID_CONTENT, 10, LV_GRID_CONTENT, LV_GRID_CONTENT, LV_GRID_TEMPLATE_LAST};
330 
331         static lv_coord_t grid_2_col_dsc[] = {LV_GRID_FR(1), LV_GRID_FR(1), LV_GRID_TEMPLATE_LAST};
332         static lv_coord_t grid_2_row_dsc[] = {
333             LV_GRID_CONTENT,  /*Title*/
334             5,                /*Separator*/
335             LV_GRID_CONTENT,  /*Box title*/
336             30,               /*Boxes*/
337             5,                /*Separator*/
338             LV_GRID_CONTENT,  /*Box title*/
339             30,               /*Boxes*/
340             LV_GRID_TEMPLATE_LAST
341         };
342 
343 
344         lv_obj_set_grid_dsc_array(parent, grid_main_col_dsc, grid_main_row_dsc);
345 
346         lv_obj_set_grid_cell(panel1, LV_GRID_ALIGN_STRETCH, 0, 2, LV_GRID_ALIGN_CENTER, 0, 1);
347 
348         lv_obj_set_grid_dsc_array(panel1, grid_1_col_dsc, grid_1_row_dsc);
349         lv_obj_set_grid_cell(avatar, LV_GRID_ALIGN_CENTER, 0, 1, LV_GRID_ALIGN_CENTER, 0, 5);
350         lv_obj_set_grid_cell(name, LV_GRID_ALIGN_START, 2, 2, LV_GRID_ALIGN_CENTER, 0, 1);
351         lv_obj_set_grid_cell(dsc, LV_GRID_ALIGN_STRETCH, 2, 4, LV_GRID_ALIGN_START, 1, 1);
352         lv_obj_set_grid_cell(email_icn, LV_GRID_ALIGN_CENTER, 2, 1, LV_GRID_ALIGN_CENTER, 3, 1);
353         lv_obj_set_grid_cell(email_label, LV_GRID_ALIGN_START, 3, 1, LV_GRID_ALIGN_CENTER, 3, 1);
354         lv_obj_set_grid_cell(call_icn, LV_GRID_ALIGN_CENTER, 2, 1, LV_GRID_ALIGN_CENTER, 4, 1);
355         lv_obj_set_grid_cell(call_label, LV_GRID_ALIGN_START, 3, 1, LV_GRID_ALIGN_CENTER, 4, 1);
356         lv_obj_set_grid_cell(log_out_btn, LV_GRID_ALIGN_STRETCH, 4, 1, LV_GRID_ALIGN_CENTER, 3, 2);
357         lv_obj_set_grid_cell(invite_btn, LV_GRID_ALIGN_STRETCH, 5, 1, LV_GRID_ALIGN_CENTER, 3, 2);
358 
359         lv_obj_set_grid_cell(panel2, LV_GRID_ALIGN_STRETCH, 0, 1, LV_GRID_ALIGN_START, 1, 1);
360         lv_obj_set_grid_dsc_array(panel2, grid_2_col_dsc, grid_2_row_dsc);
361         lv_obj_set_grid_cell(panel2_title, LV_GRID_ALIGN_START, 0, 2, LV_GRID_ALIGN_CENTER, 0, 1);
362         lv_obj_set_grid_cell(user_name, LV_GRID_ALIGN_STRETCH, 0, 1, LV_GRID_ALIGN_CENTER, 3, 1);
363         lv_obj_set_grid_cell(user_name_label, LV_GRID_ALIGN_START, 0, 1, LV_GRID_ALIGN_START, 2, 1);
364         lv_obj_set_grid_cell(password, LV_GRID_ALIGN_STRETCH, 1, 1, LV_GRID_ALIGN_CENTER, 3, 1);
365         lv_obj_set_grid_cell(password_label, LV_GRID_ALIGN_START, 1, 1, LV_GRID_ALIGN_START, 2, 1);
366         lv_obj_set_grid_cell(birthdate, LV_GRID_ALIGN_STRETCH, 1, 1, LV_GRID_ALIGN_CENTER, 6, 1);
367         lv_obj_set_grid_cell(birthday_label, LV_GRID_ALIGN_START, 1, 1, LV_GRID_ALIGN_START, 5, 1);
368         lv_obj_set_grid_cell(gender, LV_GRID_ALIGN_STRETCH, 0, 1, LV_GRID_ALIGN_CENTER, 6, 1);
369         lv_obj_set_grid_cell(gender_label, LV_GRID_ALIGN_START, 0, 1, LV_GRID_ALIGN_START, 5, 1);
370 
371 
372         lv_obj_set_grid_cell(panel3, LV_GRID_ALIGN_STRETCH, 1, 1, LV_GRID_ALIGN_STRETCH, 1, 1);
373         lv_obj_set_grid_dsc_array(panel3, grid_2_col_dsc, grid_2_row_dsc);
374         lv_obj_set_grid_cell(panel3_title, LV_GRID_ALIGN_START, 0, 2, LV_GRID_ALIGN_CENTER, 0, 1);
375         lv_obj_set_grid_cell(slider1, LV_GRID_ALIGN_CENTER, 0, 2, LV_GRID_ALIGN_CENTER, 3, 1);
376         lv_obj_set_grid_cell(experience_label, LV_GRID_ALIGN_START, 0, 1, LV_GRID_ALIGN_START, 2, 1);
377         lv_obj_set_grid_cell(sw2, LV_GRID_ALIGN_START, 1, 1, LV_GRID_ALIGN_CENTER, 6, 1);
378         lv_obj_set_grid_cell(hard_working_label, LV_GRID_ALIGN_START, 0, 1, LV_GRID_ALIGN_START, 5, 1);
379         lv_obj_set_grid_cell(sw1, LV_GRID_ALIGN_START, 0, 1, LV_GRID_ALIGN_CENTER, 6, 1);
380         lv_obj_set_grid_cell(team_player_label, LV_GRID_ALIGN_START, 1, 1, LV_GRID_ALIGN_START, 5, 1);
381     }
382     else if(disp_size == DISP_MEDIUM) {
383         static lv_coord_t grid_main_col_dsc[] = {LV_GRID_FR(1), LV_GRID_FR(1), LV_GRID_TEMPLATE_LAST};
384         static lv_coord_t grid_main_row_dsc[] = {LV_GRID_CONTENT, LV_GRID_CONTENT, LV_GRID_TEMPLATE_LAST};
385 
386 
387         /*Create the top panel*/
388         static lv_coord_t grid_1_col_dsc[] = {LV_GRID_CONTENT, 1, LV_GRID_CONTENT, LV_GRID_FR(1), LV_GRID_TEMPLATE_LAST};
389         static lv_coord_t grid_1_row_dsc[] = {
390             LV_GRID_CONTENT, /*Name*/
391             LV_GRID_CONTENT, /*Description*/
392             LV_GRID_CONTENT, /*Email*/
393             -20,
394             LV_GRID_CONTENT, /*Phone*/
395             LV_GRID_CONTENT, /*Buttons*/
396             LV_GRID_TEMPLATE_LAST
397         };
398 
399         static lv_coord_t grid_2_col_dsc[] = {LV_GRID_FR(1), LV_GRID_FR(1), LV_GRID_TEMPLATE_LAST};
400         static lv_coord_t grid_2_row_dsc[] = {
401             LV_GRID_CONTENT,  /*Title*/
402             5,                /*Separator*/
403             LV_GRID_CONTENT,  /*Box title*/
404             40,               /*Box*/
405             LV_GRID_CONTENT,  /*Box title*/
406             40,               /*Box*/
407             LV_GRID_CONTENT,  /*Box title*/
408             40,               /*Box*/
409             LV_GRID_CONTENT,  /*Box title*/
410             40,               /*Box*/
411             LV_GRID_TEMPLATE_LAST
412         };
413 
414 
415         lv_obj_set_grid_dsc_array(parent, grid_main_col_dsc, grid_main_row_dsc);
416         lv_obj_set_grid_cell(panel1, LV_GRID_ALIGN_STRETCH, 0, 2, LV_GRID_ALIGN_CENTER, 0, 1);
417 
418         lv_obj_set_width(log_out_btn, 120);
419         lv_obj_set_width(invite_btn, 120);
420 
421         lv_obj_set_grid_dsc_array(panel1, grid_1_col_dsc, grid_1_row_dsc);
422         lv_obj_set_grid_cell(avatar, LV_GRID_ALIGN_CENTER, 0, 1, LV_GRID_ALIGN_START, 0, 4);
423         lv_obj_set_grid_cell(name, LV_GRID_ALIGN_START, 2, 2, LV_GRID_ALIGN_CENTER, 0, 1);
424         lv_obj_set_grid_cell(dsc, LV_GRID_ALIGN_STRETCH, 2, 2, LV_GRID_ALIGN_START, 1, 1);
425         lv_obj_set_grid_cell(email_label, LV_GRID_ALIGN_START, 3, 1, LV_GRID_ALIGN_CENTER, 2, 1);
426         lv_obj_set_grid_cell(email_icn, LV_GRID_ALIGN_CENTER, 2, 1, LV_GRID_ALIGN_CENTER, 2, 1);
427         lv_obj_set_grid_cell(call_icn, LV_GRID_ALIGN_CENTER, 2, 1, LV_GRID_ALIGN_CENTER, 4, 1);
428         lv_obj_set_grid_cell(call_label, LV_GRID_ALIGN_START, 3, 1, LV_GRID_ALIGN_CENTER, 4, 1);
429         lv_obj_set_grid_cell(log_out_btn, LV_GRID_ALIGN_START, 1, 1, LV_GRID_ALIGN_CENTER, 5, 1);
430         lv_obj_set_grid_cell(invite_btn, LV_GRID_ALIGN_END, 3, 1, LV_GRID_ALIGN_CENTER, 5, 1);
431 
432         lv_obj_set_grid_cell(panel2, LV_GRID_ALIGN_STRETCH, 0, 1, LV_GRID_ALIGN_START, 1, 1);
433         lv_obj_set_grid_dsc_array(panel2, grid_2_col_dsc, grid_2_row_dsc);
434         lv_obj_set_grid_cell(panel2_title, LV_GRID_ALIGN_START, 0, 2, LV_GRID_ALIGN_CENTER, 0, 1);
435         lv_obj_set_grid_cell(user_name_label, LV_GRID_ALIGN_START, 0, 2, LV_GRID_ALIGN_START, 2, 1);
436         lv_obj_set_grid_cell(user_name, LV_GRID_ALIGN_STRETCH, 0, 2, LV_GRID_ALIGN_START, 3, 1);
437         lv_obj_set_grid_cell(password_label, LV_GRID_ALIGN_START, 0, 2, LV_GRID_ALIGN_START, 4, 1);
438         lv_obj_set_grid_cell(password, LV_GRID_ALIGN_STRETCH, 0, 2, LV_GRID_ALIGN_START, 5, 1);
439         lv_obj_set_grid_cell(birthday_label, LV_GRID_ALIGN_START, 0, 2, LV_GRID_ALIGN_START, 6, 1);
440         lv_obj_set_grid_cell(birthdate, LV_GRID_ALIGN_STRETCH, 0, 2, LV_GRID_ALIGN_START, 7, 1);
441         lv_obj_set_grid_cell(gender_label, LV_GRID_ALIGN_START, 0, 2, LV_GRID_ALIGN_START, 8, 1);
442         lv_obj_set_grid_cell(gender, LV_GRID_ALIGN_STRETCH, 0, 2, LV_GRID_ALIGN_START, 9, 1);
443 
444         lv_obj_set_grid_cell(panel3, LV_GRID_ALIGN_STRETCH, 1, 1, LV_GRID_ALIGN_STRETCH, 1, 1);
445         lv_obj_set_grid_dsc_array(panel3, grid_2_col_dsc, grid_2_row_dsc);
446         lv_obj_set_grid_cell(panel3_title, LV_GRID_ALIGN_START, 0, 2, LV_GRID_ALIGN_CENTER, 0, 1);
447         lv_obj_set_grid_cell(slider1, LV_GRID_ALIGN_CENTER, 0, 2, LV_GRID_ALIGN_CENTER, 3, 1);
448         lv_obj_set_grid_cell(experience_label, LV_GRID_ALIGN_START, 0, 1, LV_GRID_ALIGN_START, 2, 1);
449         lv_obj_set_grid_cell(hard_working_label, LV_GRID_ALIGN_START, 0, 1, LV_GRID_ALIGN_START, 4, 1);
450         lv_obj_set_grid_cell(sw2, LV_GRID_ALIGN_START, 0, 1, LV_GRID_ALIGN_START, 5, 1);
451         lv_obj_set_grid_cell(team_player_label, LV_GRID_ALIGN_START, 0, 1, LV_GRID_ALIGN_START, 6, 1);
452         lv_obj_set_grid_cell(sw1, LV_GRID_ALIGN_START, 0, 1, LV_GRID_ALIGN_START, 7, 1);
453     }
454     else if(disp_size == DISP_SMALL) {
455         static lv_coord_t grid_main_col_dsc[] = {LV_GRID_FR(1), LV_GRID_TEMPLATE_LAST};
456         static lv_coord_t grid_main_row_dsc[] = {LV_GRID_CONTENT, LV_GRID_CONTENT, LV_GRID_CONTENT, LV_GRID_TEMPLATE_LAST};
457         lv_obj_set_grid_dsc_array(parent, grid_main_col_dsc, grid_main_row_dsc);
458 
459 
460         /*Create the top panel*/
461         static lv_coord_t grid_1_col_dsc[] = {LV_GRID_CONTENT, LV_GRID_FR(1), LV_GRID_TEMPLATE_LAST};
462         static lv_coord_t grid_1_row_dsc[] = {LV_GRID_CONTENT, /*Avatar*/
463                                               LV_GRID_CONTENT, /*Name*/
464                                               LV_GRID_CONTENT, /*Description*/
465                                               LV_GRID_CONTENT, /*Email*/
466                                               LV_GRID_CONTENT, /*Phone number*/
467                                               LV_GRID_CONTENT, /*Button1*/
468                                               LV_GRID_CONTENT, /*Button2*/
469                                               LV_GRID_TEMPLATE_LAST
470                                              };
471 
472         lv_obj_set_grid_dsc_array(panel1, grid_1_col_dsc, grid_1_row_dsc);
473 
474 
475         static lv_coord_t grid_2_col_dsc[] = {LV_GRID_FR(1), LV_GRID_FR(1), LV_GRID_TEMPLATE_LAST};
476         static lv_coord_t grid_2_row_dsc[] = {
477             LV_GRID_CONTENT,  /*Title*/
478             5,                /*Separator*/
479             LV_GRID_CONTENT,  /*Box title*/
480             40,               /*Box*/
481             LV_GRID_CONTENT,  /*Box title*/
482             40,               /*Box*/
483             LV_GRID_CONTENT,  /*Box title*/
484             40,               /*Box*/
485             LV_GRID_CONTENT,  /*Box title*/
486             40, LV_GRID_TEMPLATE_LAST               /*Box*/
487         };
488 
489         lv_obj_set_grid_dsc_array(panel2, grid_2_col_dsc, grid_2_row_dsc);
490         lv_obj_set_grid_dsc_array(panel3, grid_2_col_dsc, grid_2_row_dsc);
491 
492         lv_obj_set_grid_cell(panel1, LV_GRID_ALIGN_STRETCH, 0, 1, LV_GRID_ALIGN_CENTER, 0, 1);
493 
494         lv_obj_set_style_text_align(dsc, LV_TEXT_ALIGN_CENTER, 0);
495 
496         lv_obj_set_grid_cell(avatar, LV_GRID_ALIGN_CENTER, 0, 2, LV_GRID_ALIGN_CENTER, 0, 1);
497         lv_obj_set_grid_cell(name, LV_GRID_ALIGN_CENTER, 0, 2, LV_GRID_ALIGN_CENTER, 1, 1);
498         lv_obj_set_grid_cell(dsc, LV_GRID_ALIGN_STRETCH, 0, 2, LV_GRID_ALIGN_START, 2, 1);
499         lv_obj_set_grid_cell(email_icn, LV_GRID_ALIGN_CENTER, 0, 1, LV_GRID_ALIGN_CENTER, 3, 1);
500         lv_obj_set_grid_cell(email_label, LV_GRID_ALIGN_START, 1, 1, LV_GRID_ALIGN_CENTER, 3, 1);
501         lv_obj_set_grid_cell(call_icn, LV_GRID_ALIGN_CENTER, 0, 1, LV_GRID_ALIGN_CENTER, 4, 1);
502         lv_obj_set_grid_cell(call_label, LV_GRID_ALIGN_START, 1, 1, LV_GRID_ALIGN_CENTER, 4, 1);
503         lv_obj_set_grid_cell(log_out_btn, LV_GRID_ALIGN_STRETCH, 0, 2, LV_GRID_ALIGN_CENTER, 5, 1);
504         lv_obj_set_grid_cell(invite_btn, LV_GRID_ALIGN_STRETCH, 0, 2, LV_GRID_ALIGN_CENTER, 6, 1);
505 
506         lv_obj_set_grid_cell(panel2, LV_GRID_ALIGN_STRETCH, 0, 1, LV_GRID_ALIGN_START, 1, 1);
507         lv_obj_set_grid_cell(panel2_title, LV_GRID_ALIGN_START, 0, 2, LV_GRID_ALIGN_CENTER, 0, 1);
508         lv_obj_set_grid_cell(user_name_label, LV_GRID_ALIGN_START, 0, 2, LV_GRID_ALIGN_START, 2, 1);
509         lv_obj_set_grid_cell(user_name, LV_GRID_ALIGN_STRETCH, 0, 2, LV_GRID_ALIGN_START, 3, 1);
510         lv_obj_set_grid_cell(password_label, LV_GRID_ALIGN_START, 0, 2, LV_GRID_ALIGN_START, 4, 1);
511         lv_obj_set_grid_cell(password, LV_GRID_ALIGN_STRETCH, 0, 2, LV_GRID_ALIGN_START, 5, 1);
512         lv_obj_set_grid_cell(birthday_label, LV_GRID_ALIGN_START, 0, 2, LV_GRID_ALIGN_START, 6, 1);
513         lv_obj_set_grid_cell(birthdate, LV_GRID_ALIGN_STRETCH, 0, 2, LV_GRID_ALIGN_START, 7, 1);
514         lv_obj_set_grid_cell(gender_label, LV_GRID_ALIGN_START, 0, 2, LV_GRID_ALIGN_START, 8, 1);
515         lv_obj_set_grid_cell(gender, LV_GRID_ALIGN_STRETCH, 0, 2, LV_GRID_ALIGN_START, 9, 1);
516 
517         lv_obj_set_height(panel3, LV_SIZE_CONTENT);
518         lv_obj_set_grid_cell(panel3, LV_GRID_ALIGN_STRETCH, 0, 1, LV_GRID_ALIGN_START, 2, 1);
519         lv_obj_set_grid_cell(panel3_title, LV_GRID_ALIGN_START, 0, 2, LV_GRID_ALIGN_CENTER, 0, 1);
520         lv_obj_set_grid_cell(experience_label, LV_GRID_ALIGN_START, 0, 1, LV_GRID_ALIGN_START, 2, 1);
521         lv_obj_set_grid_cell(slider1, LV_GRID_ALIGN_CENTER, 0, 2, LV_GRID_ALIGN_CENTER, 3, 1);
522         lv_obj_set_grid_cell(hard_working_label, LV_GRID_ALIGN_START, 0, 1, LV_GRID_ALIGN_START, 4, 1);
523         lv_obj_set_grid_cell(sw1, LV_GRID_ALIGN_START, 0, 1, LV_GRID_ALIGN_START, 5, 1);
524         lv_obj_set_grid_cell(team_player_label, LV_GRID_ALIGN_START, 1, 1, LV_GRID_ALIGN_START, 4, 1);
525         lv_obj_set_grid_cell(sw2, LV_GRID_ALIGN_START, 1, 1, LV_GRID_ALIGN_START, 5, 1);
526     }
527 }
528 
529 
analytics_create(lv_obj_t * parent)530 static void analytics_create(lv_obj_t * parent)
531 {
532     lv_obj_set_flex_flow(parent, LV_FLEX_FLOW_ROW_WRAP);
533 
534     static lv_coord_t grid_chart_row_dsc[] = {LV_GRID_CONTENT, LV_GRID_FR(1), 10, LV_GRID_TEMPLATE_LAST};
535     static lv_coord_t grid_chart_col_dsc[] = {20, LV_GRID_FR(1), LV_GRID_TEMPLATE_LAST};
536 
537     lv_obj_t * chart1_cont = lv_obj_create(parent);
538     lv_obj_set_flex_grow(chart1_cont, 1);
539     lv_obj_set_grid_dsc_array(chart1_cont, grid_chart_col_dsc, grid_chart_row_dsc);
540 
541     lv_obj_set_height(chart1_cont, LV_PCT(100));
542     lv_obj_set_style_max_height(chart1_cont, 300, 0);
543 
544     lv_obj_t * title = lv_label_create(chart1_cont);
545     lv_label_set_text(title, "Unique visitors");
546     lv_obj_add_style(title, &style_title, 0);
547     lv_obj_set_grid_cell(title, LV_GRID_ALIGN_START, 0, 2, LV_GRID_ALIGN_START, 0, 1);
548 
549     chart1 = lv_chart_create(chart1_cont);
550     lv_group_add_obj(lv_group_get_default(), chart1);
551     lv_obj_add_flag(chart1, LV_OBJ_FLAG_SCROLL_ON_FOCUS);
552     lv_obj_set_grid_cell(chart1, LV_GRID_ALIGN_STRETCH, 1, 1, LV_GRID_ALIGN_STRETCH, 1, 1);
553     lv_chart_set_axis_tick(chart1, LV_CHART_AXIS_PRIMARY_Y, 0, 0, 5, 1, true, 80);
554     lv_chart_set_axis_tick(chart1, LV_CHART_AXIS_PRIMARY_X, 0, 0, 12, 1, true, 50);
555     lv_chart_set_div_line_count(chart1, 0, 12);
556     lv_chart_set_point_count(chart1, 12);
557     lv_obj_add_event_cb(chart1, chart_event_cb, LV_EVENT_ALL, NULL);
558     if(disp_size == DISP_SMALL) lv_chart_set_zoom_x(chart1, 256 * 3);
559     else if(disp_size == DISP_MEDIUM) lv_chart_set_zoom_x(chart1, 256 * 2);
560 
561     lv_obj_set_style_border_side(chart1, LV_BORDER_SIDE_LEFT | LV_BORDER_SIDE_BOTTOM, 0);
562     lv_obj_set_style_radius(chart1, 0, 0);
563 
564     ser1 = lv_chart_add_series(chart1, lv_theme_get_color_primary(chart1), LV_CHART_AXIS_PRIMARY_Y);
565     lv_chart_set_next_value(chart1, ser1, lv_rand(10, 80));
566     lv_chart_set_next_value(chart1, ser1, lv_rand(10, 80));
567     lv_chart_set_next_value(chart1, ser1, lv_rand(10, 80));
568     lv_chart_set_next_value(chart1, ser1, lv_rand(10, 80));
569     lv_chart_set_next_value(chart1, ser1, lv_rand(10, 80));
570     lv_chart_set_next_value(chart1, ser1, lv_rand(10, 80));
571     lv_chart_set_next_value(chart1, ser1, lv_rand(10, 80));
572     lv_chart_set_next_value(chart1, ser1, lv_rand(10, 80));
573     lv_chart_set_next_value(chart1, ser1, lv_rand(10, 80));
574     lv_chart_set_next_value(chart1, ser1, lv_rand(10, 80));
575     lv_chart_set_next_value(chart1, ser1, lv_rand(10, 80));
576     lv_chart_set_next_value(chart1, ser1, lv_rand(10, 80));
577     lv_chart_set_next_value(chart1, ser1, lv_rand(10, 80));
578 
579     lv_obj_t * chart2_cont = lv_obj_create(parent);
580     lv_obj_add_flag(chart2_cont, LV_OBJ_FLAG_FLEX_IN_NEW_TRACK);
581     lv_obj_set_flex_grow(chart2_cont, 1);
582 
583     lv_obj_set_height(chart2_cont, LV_PCT(100));
584     lv_obj_set_style_max_height(chart2_cont, 300, 0);
585 
586     lv_obj_set_grid_dsc_array(chart2_cont, grid_chart_col_dsc, grid_chart_row_dsc);
587 
588     title = lv_label_create(chart2_cont);
589     lv_label_set_text(title, "Monthly revenue");
590     lv_obj_add_style(title, &style_title, 0);
591     lv_obj_set_grid_cell(title, LV_GRID_ALIGN_START, 0, 2, LV_GRID_ALIGN_START, 0, 1);
592 
593     chart2 = lv_chart_create(chart2_cont);
594     lv_group_add_obj(lv_group_get_default(), chart2);
595     lv_obj_add_flag(chart2, LV_OBJ_FLAG_SCROLL_ON_FOCUS);
596 
597     lv_obj_set_grid_cell(chart2, LV_GRID_ALIGN_STRETCH, 1, 1, LV_GRID_ALIGN_STRETCH, 1, 1);
598     lv_chart_set_axis_tick(chart2, LV_CHART_AXIS_PRIMARY_Y, 0, 0, 5, 1, true, 80);
599     lv_chart_set_axis_tick(chart2, LV_CHART_AXIS_PRIMARY_X, 0, 0, 12, 1, true, 50);
600     lv_obj_set_size(chart2, LV_PCT(100), LV_PCT(100));
601     lv_chart_set_type(chart2, LV_CHART_TYPE_BAR);
602     lv_chart_set_div_line_count(chart2, 6, 0);
603     lv_chart_set_point_count(chart2, 12);
604     lv_obj_add_event_cb(chart2, chart_event_cb, LV_EVENT_ALL, NULL);
605     lv_chart_set_zoom_x(chart2, 256 * 2);
606     lv_obj_set_style_border_side(chart2, LV_BORDER_SIDE_LEFT | LV_BORDER_SIDE_BOTTOM, 0);
607     lv_obj_set_style_radius(chart2, 0, 0);
608 
609     if(disp_size == DISP_SMALL) {
610         lv_obj_set_style_pad_gap(chart2, 0, LV_PART_ITEMS);
611         lv_obj_set_style_pad_gap(chart2, 2, LV_PART_MAIN);
612     }
613     else if(disp_size == DISP_LARGE) {
614         lv_obj_set_style_pad_gap(chart2, 16, 0);
615     }
616 
617     ser2 = lv_chart_add_series(chart2, lv_palette_lighten(LV_PALETTE_GREY, 1), LV_CHART_AXIS_PRIMARY_Y);
618     lv_chart_set_next_value(chart2, ser2, lv_rand(10, 80));
619     lv_chart_set_next_value(chart2, ser2, lv_rand(10, 80));
620     lv_chart_set_next_value(chart2, ser2, lv_rand(10, 80));
621     lv_chart_set_next_value(chart2, ser2, lv_rand(10, 80));
622     lv_chart_set_next_value(chart2, ser2, lv_rand(10, 80));
623     lv_chart_set_next_value(chart2, ser2, lv_rand(10, 80));
624     lv_chart_set_next_value(chart2, ser2, lv_rand(10, 80));
625     lv_chart_set_next_value(chart2, ser2, lv_rand(10, 80));
626     lv_chart_set_next_value(chart2, ser2, lv_rand(10, 80));
627     lv_chart_set_next_value(chart2, ser2, lv_rand(10, 80));
628     lv_chart_set_next_value(chart2, ser2, lv_rand(10, 80));
629     lv_chart_set_next_value(chart2, ser2, lv_rand(10, 80));
630     lv_chart_set_next_value(chart2, ser2, lv_rand(10, 80));
631 
632     ser3 = lv_chart_add_series(chart2, lv_theme_get_color_primary(chart1), LV_CHART_AXIS_PRIMARY_Y);
633     lv_chart_set_next_value(chart2, ser3, lv_rand(10, 80));
634     lv_chart_set_next_value(chart2, ser3, lv_rand(10, 80));
635     lv_chart_set_next_value(chart2, ser3, lv_rand(10, 80));
636     lv_chart_set_next_value(chart2, ser3, lv_rand(10, 80));
637     lv_chart_set_next_value(chart2, ser3, lv_rand(10, 80));
638     lv_chart_set_next_value(chart2, ser3, lv_rand(10, 80));
639     lv_chart_set_next_value(chart2, ser3, lv_rand(10, 80));
640     lv_chart_set_next_value(chart2, ser3, lv_rand(10, 80));
641     lv_chart_set_next_value(chart2, ser3, lv_rand(10, 80));
642     lv_chart_set_next_value(chart2, ser3, lv_rand(10, 80));
643     lv_chart_set_next_value(chart2, ser3, lv_rand(10, 80));
644     lv_chart_set_next_value(chart2, ser3, lv_rand(10, 80));
645     lv_chart_set_next_value(chart2, ser3, lv_rand(10, 80));
646 
647     lv_meter_scale_t * scale;
648     lv_meter_indicator_t * indic;
649     meter1 = create_meter_box(parent, "Monthly Target", "Revenue: 63%", "Sales: 44%", "Costs: 58%");
650     lv_obj_add_flag(lv_obj_get_parent(meter1), LV_OBJ_FLAG_FLEX_IN_NEW_TRACK);
651     scale = lv_meter_add_scale(meter1);
652     lv_meter_set_scale_range(meter1, scale, 0, 100, 270, 90);
653     lv_meter_set_scale_ticks(meter1, scale, 0, 0, 0, lv_color_black());
654 
655     lv_anim_t a;
656     lv_anim_init(&a);
657     lv_anim_set_values(&a, 20, 100);
658     lv_anim_set_repeat_count(&a, LV_ANIM_REPEAT_INFINITE);
659 
660     indic = lv_meter_add_arc(meter1, scale, 15, lv_palette_main(LV_PALETTE_BLUE), 0);
661     lv_anim_set_exec_cb(&a, meter1_indic1_anim_cb);
662     lv_anim_set_var(&a, indic);
663     lv_anim_set_time(&a, 4100);
664     lv_anim_set_playback_time(&a, 2700);
665     lv_anim_start(&a);
666 
667     indic = lv_meter_add_arc(meter1, scale, 15, lv_palette_main(LV_PALETTE_RED), -20);
668     lv_anim_set_exec_cb(&a, meter1_indic2_anim_cb);
669     lv_anim_set_var(&a, indic);
670     lv_anim_set_time(&a, 2600);
671     lv_anim_set_playback_time(&a, 3200);
672     a.user_data = indic;
673     lv_anim_start(&a);
674 
675     indic = lv_meter_add_arc(meter1, scale, 15, lv_palette_main(LV_PALETTE_GREEN), -40);
676     lv_anim_set_exec_cb(&a, meter1_indic3_anim_cb);
677     lv_anim_set_var(&a, indic);
678     lv_anim_set_time(&a, 2800);
679     lv_anim_set_playback_time(&a, 1800);
680     lv_anim_start(&a);
681 
682     meter2 = create_meter_box(parent, "Sessions", "Desktop: ", "Tablet: ", "Mobile: ");
683     if(disp_size < DISP_LARGE) lv_obj_add_flag(lv_obj_get_parent(meter2), LV_OBJ_FLAG_FLEX_IN_NEW_TRACK);
684     scale = lv_meter_add_scale(meter2);
685     lv_meter_set_scale_range(meter2, scale, 0, 100, 360, 90);
686     lv_meter_set_scale_ticks(meter2, scale, 0, 0, 0, lv_color_black());
687 
688     static lv_meter_indicator_t * meter2_indic[3];
689     meter2_indic[0] = lv_meter_add_arc(meter2, scale, 20, lv_palette_main(LV_PALETTE_RED), -10);
690     lv_meter_set_indicator_start_value(meter2, meter2_indic[0], 0);
691     lv_meter_set_indicator_end_value(meter2, meter2_indic[0], 39);
692 
693     meter2_indic[1] = lv_meter_add_arc(meter2, scale, 30, lv_palette_main(LV_PALETTE_BLUE), 0);
694     lv_meter_set_indicator_start_value(meter2, meter2_indic[1], 40);
695     lv_meter_set_indicator_end_value(meter2, meter2_indic[1], 69);
696 
697     meter2_indic[2] = lv_meter_add_arc(meter2, scale, 10, lv_palette_main(LV_PALETTE_GREEN), -20);
698     lv_meter_set_indicator_start_value(meter2, meter2_indic[2], 70);
699     lv_meter_set_indicator_end_value(meter2, meter2_indic[2], 99);
700 
701     lv_timer_create(meter2_timer_cb, 100, meter2_indic);
702 
703     meter3 = create_meter_box(parent, "Network Speed", "Low speed", "Normal Speed", "High Speed");
704     if(disp_size < DISP_LARGE) lv_obj_add_flag(lv_obj_get_parent(meter3), LV_OBJ_FLAG_FLEX_IN_NEW_TRACK);
705 
706     /*Add a special circle to the needle's pivot*/
707     lv_obj_set_style_pad_hor(meter3, 10, 0);
708     lv_obj_set_style_size(meter3, 10, LV_PART_INDICATOR);
709     lv_obj_set_style_radius(meter3, LV_RADIUS_CIRCLE, LV_PART_INDICATOR);
710     lv_obj_set_style_bg_opa(meter3, LV_OPA_COVER, LV_PART_INDICATOR);
711     lv_obj_set_style_bg_color(meter3, lv_palette_darken(LV_PALETTE_GREY, 4), LV_PART_INDICATOR);
712     lv_obj_set_style_outline_color(meter3, lv_color_white(), LV_PART_INDICATOR);
713     lv_obj_set_style_outline_width(meter3, 3, LV_PART_INDICATOR);
714     lv_obj_set_style_text_color(meter3, lv_palette_darken(LV_PALETTE_GREY, 1), LV_PART_TICKS);
715 
716     scale = lv_meter_add_scale(meter3);
717     lv_meter_set_scale_range(meter3, scale, 10, 60, 220, 360 - 220);
718     lv_meter_set_scale_ticks(meter3, scale, 21, 3, 17, lv_color_white());
719     lv_meter_set_scale_major_ticks(meter3, scale, 4, 4, 22, lv_color_white(), 15);
720 
721     indic = lv_meter_add_arc(meter3, scale, 10, lv_palette_main(LV_PALETTE_RED), 0);
722     lv_meter_set_indicator_start_value(meter3, indic, 0);
723     lv_meter_set_indicator_end_value(meter3, indic, 20);
724 
725     indic = lv_meter_add_scale_lines(meter3, scale, lv_palette_darken(LV_PALETTE_RED, 3), lv_palette_darken(LV_PALETTE_RED,
726                                                                                                             3), true, 0);
727     lv_meter_set_indicator_start_value(meter3, indic, 0);
728     lv_meter_set_indicator_end_value(meter3, indic, 20);
729 
730     indic = lv_meter_add_arc(meter3, scale, 12, lv_palette_main(LV_PALETTE_BLUE), 0);
731     lv_meter_set_indicator_start_value(meter3, indic, 20);
732     lv_meter_set_indicator_end_value(meter3, indic, 40);
733 
734     indic = lv_meter_add_scale_lines(meter3, scale, lv_palette_darken(LV_PALETTE_BLUE, 3),
735                                      lv_palette_darken(LV_PALETTE_BLUE, 3), true, 0);
736     lv_meter_set_indicator_start_value(meter3, indic, 20);
737     lv_meter_set_indicator_end_value(meter3, indic, 40);
738 
739     indic = lv_meter_add_arc(meter3, scale, 10, lv_palette_main(LV_PALETTE_GREEN), 0);
740     lv_meter_set_indicator_start_value(meter3, indic, 40);
741     lv_meter_set_indicator_end_value(meter3, indic, 60);
742 
743     indic = lv_meter_add_scale_lines(meter3, scale, lv_palette_darken(LV_PALETTE_GREEN, 3),
744                                      lv_palette_darken(LV_PALETTE_GREEN, 3), true, 0);
745     lv_meter_set_indicator_start_value(meter3, indic, 40);
746     lv_meter_set_indicator_end_value(meter3, indic, 60);
747 
748     indic = lv_meter_add_needle_line(meter3, scale, 4, lv_palette_darken(LV_PALETTE_GREY, 4), -25);
749 
750     lv_obj_t * mbps_label = lv_label_create(meter3);
751     lv_label_set_text(mbps_label, "-");
752     lv_obj_add_style(mbps_label, &style_title, 0);
753 
754     lv_obj_t * mbps_unit_label = lv_label_create(meter3);
755     lv_label_set_text(mbps_unit_label, "Mbps");
756 
757     lv_anim_init(&a);
758     lv_anim_set_values(&a, 10, 60);
759     lv_anim_set_repeat_count(&a, LV_ANIM_REPEAT_INFINITE);
760     lv_anim_set_exec_cb(&a, meter3_anim_cb);
761     lv_anim_set_var(&a, indic);
762     lv_anim_set_time(&a, 4100);
763     lv_anim_set_playback_time(&a, 800);
764     lv_anim_start(&a);
765 
766     lv_obj_update_layout(parent);
767     if(disp_size == DISP_MEDIUM) {
768         lv_obj_set_size(meter1, 200, 200);
769         lv_obj_set_size(meter2, 200, 200);
770         lv_obj_set_size(meter3, 200, 200);
771     }
772     else {
773         lv_coord_t meter_w = lv_obj_get_width(meter1);
774         lv_obj_set_height(meter1, meter_w);
775         lv_obj_set_height(meter2, meter_w);
776         lv_obj_set_height(meter3, meter_w);
777     }
778 
779     lv_obj_align(mbps_label, LV_ALIGN_TOP_MID, 10, lv_pct(55));
780     lv_obj_align_to(mbps_unit_label, mbps_label, LV_ALIGN_OUT_RIGHT_BOTTOM, 10, 0);
781 }
782 
shop_create(lv_obj_t * parent)783 void shop_create(lv_obj_t * parent)
784 {
785     lv_obj_set_flex_flow(parent, LV_FLEX_FLOW_ROW_WRAP);
786 
787     lv_obj_t * panel1 = lv_obj_create(parent);
788     lv_obj_set_size(panel1, lv_pct(100), LV_SIZE_CONTENT);
789     lv_obj_set_style_pad_bottom(panel1, 30, 0);
790 
791     lv_obj_t * title = lv_label_create(panel1);
792     lv_label_set_text(title, "Monthly Summary");
793     lv_obj_add_style(title, &style_title, 0);
794 
795     lv_obj_t * date = lv_label_create(panel1);
796     lv_label_set_text(date, "8-15 July, 2021");
797     lv_obj_add_style(date, &style_text_muted, 0);
798 
799     lv_obj_t * amount = lv_label_create(panel1);
800     lv_label_set_text(amount, "$27,123.25");
801     lv_obj_add_style(amount, &style_title, 0);
802 
803     lv_obj_t * hint = lv_label_create(panel1);
804     lv_label_set_text(hint, LV_SYMBOL_UP" 17% growth this week");
805     lv_obj_set_style_text_color(hint, lv_palette_main(LV_PALETTE_GREEN), 0);
806 
807     chart3 = lv_chart_create(panel1);
808     lv_chart_set_axis_tick(chart3, LV_CHART_AXIS_PRIMARY_Y, 0, 0, 6, 1, true, 80);
809     lv_chart_set_axis_tick(chart3, LV_CHART_AXIS_PRIMARY_X, 0, 0, 7, 1, true, 50);
810     lv_chart_set_type(chart3, LV_CHART_TYPE_BAR);
811     lv_chart_set_div_line_count(chart3, 6, 0);
812     lv_chart_set_point_count(chart3, 7);
813     lv_obj_add_event_cb(chart3, shop_chart_event_cb, LV_EVENT_ALL, NULL);
814 
815     ser4 = lv_chart_add_series(chart3, lv_theme_get_color_primary(chart3), LV_CHART_AXIS_PRIMARY_Y);
816     lv_chart_set_next_value(chart3, ser4, lv_rand(60, 90));
817     lv_chart_set_next_value(chart3, ser4, lv_rand(60, 90));
818     lv_chart_set_next_value(chart3, ser4, lv_rand(60, 90));
819     lv_chart_set_next_value(chart3, ser4, lv_rand(60, 90));
820     lv_chart_set_next_value(chart3, ser4, lv_rand(60, 90));
821     lv_chart_set_next_value(chart3, ser4, lv_rand(60, 90));
822     lv_chart_set_next_value(chart3, ser4, lv_rand(60, 90));
823     lv_chart_set_next_value(chart3, ser4, lv_rand(60, 90));
824     lv_chart_set_next_value(chart3, ser4, lv_rand(60, 90));
825     lv_chart_set_next_value(chart3, ser4, lv_rand(60, 90));
826     lv_chart_set_next_value(chart3, ser4, lv_rand(60, 90));
827     lv_chart_set_next_value(chart3, ser4, lv_rand(60, 90));
828 
829     if(disp_size == DISP_LARGE) {
830         static lv_coord_t grid1_col_dsc[] = {LV_GRID_FR(1), LV_GRID_FR(1), LV_GRID_TEMPLATE_LAST};
831         static lv_coord_t grid1_row_dsc[] = {
832             LV_GRID_CONTENT,  /*Title*/
833             LV_GRID_CONTENT,  /*Sub title*/
834             20,               /*Spacer*/
835             LV_GRID_CONTENT,  /*Amount*/
836             LV_GRID_CONTENT,  /*Hint*/
837             LV_GRID_TEMPLATE_LAST
838         };
839 
840         lv_obj_set_size(chart3, lv_pct(100), lv_pct(100));
841         lv_obj_set_style_pad_column(chart3, LV_DPX(30), 0);
842 
843 
844         lv_obj_set_grid_dsc_array(panel1, grid1_col_dsc, grid1_row_dsc);
845         lv_obj_set_grid_cell(title, LV_GRID_ALIGN_START, 0, 1, LV_GRID_ALIGN_START, 0, 1);
846         lv_obj_set_grid_cell(date, LV_GRID_ALIGN_START, 0, 1, LV_GRID_ALIGN_START, 1, 1);
847         lv_obj_set_grid_cell(amount, LV_GRID_ALIGN_START, 0, 1, LV_GRID_ALIGN_START, 3, 1);
848         lv_obj_set_grid_cell(hint, LV_GRID_ALIGN_START, 0, 1, LV_GRID_ALIGN_START, 4, 1);
849         lv_obj_set_grid_cell(chart3, LV_GRID_ALIGN_STRETCH, 1, 1, LV_GRID_ALIGN_STRETCH, 0, 5);
850     }
851     else if(disp_size == DISP_MEDIUM) {
852         static lv_coord_t grid1_col_dsc[] = {LV_GRID_FR(1), LV_GRID_FR(1), LV_GRID_TEMPLATE_LAST};
853         static lv_coord_t grid1_row_dsc[] = {
854             LV_GRID_CONTENT,  /*Title + Date*/
855             LV_GRID_CONTENT,  /*Amount + Hint*/
856             200,              /*Chart*/
857             LV_GRID_TEMPLATE_LAST
858         };
859 
860         lv_obj_update_layout(panel1);
861         lv_obj_set_width(chart3, lv_obj_get_content_width(panel1) - 20);
862         lv_obj_set_style_pad_column(chart3, LV_DPX(30), 0);
863 
864         lv_obj_set_grid_dsc_array(panel1, grid1_col_dsc, grid1_row_dsc);
865         lv_obj_set_grid_cell(title, LV_GRID_ALIGN_START, 0, 1, LV_GRID_ALIGN_CENTER, 0, 1);
866         lv_obj_set_grid_cell(date, LV_GRID_ALIGN_START, 1, 1, LV_GRID_ALIGN_CENTER, 0, 1);
867         lv_obj_set_grid_cell(amount, LV_GRID_ALIGN_START, 0, 1, LV_GRID_ALIGN_CENTER, 1, 1);
868         lv_obj_set_grid_cell(hint, LV_GRID_ALIGN_START, 1, 1, LV_GRID_ALIGN_CENTER, 1, 1);
869         lv_obj_set_grid_cell(chart3, LV_GRID_ALIGN_END, 0, 2, LV_GRID_ALIGN_STRETCH, 2, 1);
870     }
871     else if(disp_size == DISP_SMALL) {
872         static lv_coord_t grid1_col_dsc[] = {LV_GRID_FR(1), LV_GRID_TEMPLATE_LAST};
873         static lv_coord_t grid1_row_dsc[] = {
874             LV_GRID_CONTENT,  /*Title*/
875             LV_GRID_CONTENT,  /*Date*/
876             LV_GRID_CONTENT,  /*Amount*/
877             LV_GRID_CONTENT,  /*Hint*/
878             LV_GRID_CONTENT,  /*Chart*/
879             LV_GRID_TEMPLATE_LAST
880         };
881 
882         lv_obj_set_width(chart3, LV_PCT(95));
883         lv_obj_set_height(chart3, LV_VER_RES - 70);
884         lv_obj_set_style_max_height(chart3, 300, 0);
885         lv_chart_set_zoom_x(chart3, 512);
886 
887         lv_obj_set_grid_dsc_array(panel1, grid1_col_dsc, grid1_row_dsc);
888         lv_obj_set_grid_cell(title, LV_GRID_ALIGN_START, 0, 1, LV_GRID_ALIGN_START, 0, 1);
889         lv_obj_set_grid_cell(date, LV_GRID_ALIGN_START, 0, 1, LV_GRID_ALIGN_START, 1, 1);
890         lv_obj_set_grid_cell(amount, LV_GRID_ALIGN_START, 0, 1, LV_GRID_ALIGN_START, 2, 1);
891         lv_obj_set_grid_cell(hint, LV_GRID_ALIGN_START, 0, 1, LV_GRID_ALIGN_START, 3, 1);
892         lv_obj_set_grid_cell(chart3, LV_GRID_ALIGN_END, 0, 1, LV_GRID_ALIGN_START, 4, 1);
893     }
894 
895     lv_obj_t * list = lv_obj_create(parent);
896     if(disp_size == DISP_SMALL) {
897         lv_obj_add_flag(list, LV_OBJ_FLAG_FLEX_IN_NEW_TRACK);
898         lv_obj_set_height(list, LV_PCT(100));
899     }
900     else {
901         lv_obj_set_height(list, LV_PCT(100));
902         lv_obj_set_style_max_height(list, 300, 0);
903     }
904 
905     lv_obj_set_flex_flow(list, LV_FLEX_FLOW_COLUMN);
906     lv_obj_set_flex_grow(list, 1);
907     lv_obj_add_flag(list, LV_OBJ_FLAG_FLEX_IN_NEW_TRACK);
908 
909     title = lv_label_create(list);
910     lv_label_set_text(title, "Top products");
911     lv_obj_add_style(title, &style_title, 0);
912 
913     LV_IMG_DECLARE(img_clothes);
914     create_shop_item(list, &img_clothes, "Blue jeans", "Clothes", "$722");
915     create_shop_item(list, &img_clothes, "Blue jeans", "Clothes", "$411");
916     create_shop_item(list, &img_clothes, "Blue jeans", "Clothes", "$917");
917     create_shop_item(list, &img_clothes, "Blue jeans", "Clothes", "$64");
918     create_shop_item(list, &img_clothes, "Blue jeans", "Clothes", "$805");
919 
920     lv_obj_t * notifications = lv_obj_create(parent);
921     if(disp_size == DISP_SMALL) {
922         lv_obj_add_flag(notifications, LV_OBJ_FLAG_FLEX_IN_NEW_TRACK);
923         lv_obj_set_height(notifications, LV_PCT(100));
924     }
925     else  {
926         lv_obj_set_height(notifications, LV_PCT(100));
927         lv_obj_set_style_max_height(notifications, 300, 0);
928     }
929 
930     lv_obj_set_flex_flow(notifications, LV_FLEX_FLOW_COLUMN);
931     lv_obj_set_flex_grow(notifications, 1);
932 
933     title = lv_label_create(notifications);
934     lv_label_set_text(title, "Notification");
935     lv_obj_add_style(title, &style_title, 0);
936 
937     lv_obj_t * cb;
938     cb = lv_checkbox_create(notifications);
939     lv_checkbox_set_text(cb, "Item purchased");
940 
941     cb = lv_checkbox_create(notifications);
942     lv_checkbox_set_text(cb, "New connection");
943 
944     cb = lv_checkbox_create(notifications);
945     lv_checkbox_set_text(cb, "New subscriber");
946     lv_obj_add_state(cb, LV_STATE_CHECKED);
947 
948     cb = lv_checkbox_create(notifications);
949     lv_checkbox_set_text(cb, "New message");
950     lv_obj_add_state(cb, LV_STATE_DISABLED);
951 
952     cb = lv_checkbox_create(notifications);
953     lv_checkbox_set_text(cb, "Milestone reached");
954     lv_obj_add_state(cb, LV_STATE_CHECKED | LV_STATE_DISABLED);
955 
956     cb = lv_checkbox_create(notifications);
957     lv_checkbox_set_text(cb, "Out of stock");
958 
959 
960 }
961 
color_changer_create(lv_obj_t * parent)962 static void color_changer_create(lv_obj_t * parent)
963 {
964     static lv_palette_t palette[] = {
965         LV_PALETTE_BLUE, LV_PALETTE_GREEN, LV_PALETTE_BLUE_GREY,  LV_PALETTE_ORANGE,
966         LV_PALETTE_RED, LV_PALETTE_PURPLE, LV_PALETTE_TEAL, _LV_PALETTE_LAST
967     };
968 
969     lv_obj_t * color_cont = lv_obj_create(parent);
970     lv_obj_remove_style_all(color_cont);
971     lv_obj_set_flex_flow(color_cont, LV_FLEX_FLOW_ROW);
972     lv_obj_set_flex_align(color_cont, LV_FLEX_ALIGN_SPACE_EVENLY, LV_FLEX_ALIGN_CENTER, LV_FLEX_ALIGN_CENTER);
973     lv_obj_add_flag(color_cont, LV_OBJ_FLAG_FLOATING);
974 
975     lv_obj_set_style_bg_color(color_cont, lv_color_white(), 0);
976     lv_obj_set_style_pad_right(color_cont, disp_size == DISP_SMALL ? LV_DPX(47) : LV_DPX(55), 0);
977     lv_obj_set_style_bg_opa(color_cont, LV_OPA_COVER, 0);
978     lv_obj_set_style_radius(color_cont, LV_RADIUS_CIRCLE, 0);
979 
980     if(disp_size == DISP_SMALL) lv_obj_set_size(color_cont, LV_DPX(52), LV_DPX(52));
981     else lv_obj_set_size(color_cont, LV_DPX(60), LV_DPX(60));
982 
983     lv_obj_align(color_cont, LV_ALIGN_BOTTOM_RIGHT, - LV_DPX(10),  - LV_DPX(10));
984 
985     uint32_t i;
986     for(i = 0; palette[i] != _LV_PALETTE_LAST; i++) {
987         lv_obj_t * c = lv_btn_create(color_cont);
988         lv_obj_set_style_bg_color(c, lv_palette_main(palette[i]), 0);
989         lv_obj_set_style_radius(c, LV_RADIUS_CIRCLE, 0);
990         lv_obj_set_style_opa(c, LV_OPA_TRANSP, 0);
991         lv_obj_set_size(c, 20, 20);
992         lv_obj_add_event_cb(c, color_event_cb, LV_EVENT_ALL, &palette[i]);
993         lv_obj_clear_flag(c, LV_OBJ_FLAG_SCROLL_ON_FOCUS);
994     }
995 
996     lv_obj_t * btn = lv_btn_create(parent);
997     lv_obj_add_flag(btn, LV_OBJ_FLAG_FLOATING | LV_OBJ_FLAG_CLICKABLE);
998     lv_obj_set_style_bg_color(btn, lv_color_white(), LV_STATE_CHECKED);
999     lv_obj_set_style_pad_all(btn, 10, 0);
1000     lv_obj_set_style_radius(btn, LV_RADIUS_CIRCLE, 0);
1001     lv_obj_add_event_cb(btn, color_changer_event_cb, LV_EVENT_ALL, color_cont);
1002     lv_obj_set_style_shadow_width(btn, 0, 0);
1003     lv_obj_set_style_bg_img_src(btn, LV_SYMBOL_TINT, 0);
1004 
1005     if(disp_size == DISP_SMALL) {
1006         lv_obj_set_size(btn, LV_DPX(42), LV_DPX(42));
1007         lv_obj_align(btn, LV_ALIGN_BOTTOM_RIGHT, -LV_DPX(15), -LV_DPX(15));
1008     }
1009     else {
1010         lv_obj_set_size(btn, LV_DPX(50), LV_DPX(50));
1011         lv_obj_align(btn, LV_ALIGN_BOTTOM_RIGHT, -LV_DPX(15), -LV_DPX(15));
1012     }
1013 }
1014 
color_changer_anim_cb(void * var,int32_t v)1015 static void color_changer_anim_cb(void * var, int32_t v)
1016 {
1017     lv_obj_t * obj = var;
1018     lv_coord_t max_w = lv_obj_get_width(lv_obj_get_parent(obj)) - LV_DPX(20);
1019     lv_coord_t w;
1020 
1021     if(disp_size == DISP_SMALL) {
1022         w = lv_map(v, 0, 256, LV_DPX(52), max_w);
1023         lv_obj_set_width(obj, w);
1024         lv_obj_align(obj, LV_ALIGN_BOTTOM_RIGHT, - LV_DPX(10),  - LV_DPX(10));
1025     }
1026     else {
1027         w = lv_map(v, 0, 256, LV_DPX(60), max_w);
1028         lv_obj_set_width(obj, w);
1029         lv_obj_align(obj, LV_ALIGN_BOTTOM_RIGHT, - LV_DPX(10),  - LV_DPX(10));
1030     }
1031 
1032     if(v > LV_OPA_COVER) v = LV_OPA_COVER;
1033 
1034     uint32_t i;
1035     for(i = 0; i < lv_obj_get_child_cnt(obj); i++) {
1036         lv_obj_set_style_opa(lv_obj_get_child(obj, i), v, 0);
1037     }
1038 
1039 }
1040 
color_changer_event_cb(lv_event_t * e)1041 static void color_changer_event_cb(lv_event_t * e)
1042 {
1043     if(lv_event_get_code(e) == LV_EVENT_CLICKED) {
1044         lv_obj_t * color_cont = lv_event_get_user_data(e);
1045         if(lv_obj_get_width(color_cont) < LV_HOR_RES / 2) {
1046             lv_anim_t a;
1047             lv_anim_init(&a);
1048             lv_anim_set_var(&a, color_cont);
1049             lv_anim_set_exec_cb(&a, color_changer_anim_cb);
1050             lv_anim_set_values(&a, 0, 256);
1051             lv_anim_set_time(&a, 200);
1052             lv_anim_start(&a);
1053         }
1054         else {
1055             lv_anim_t a;
1056             lv_anim_init(&a);
1057             lv_anim_set_var(&a, color_cont);
1058             lv_anim_set_exec_cb(&a, color_changer_anim_cb);
1059             lv_anim_set_values(&a, 256, 0);
1060             lv_anim_set_time(&a, 200);
1061             lv_anim_start(&a);
1062         }
1063     }
1064 }
color_event_cb(lv_event_t * e)1065 static void color_event_cb(lv_event_t * e)
1066 {
1067     lv_event_code_t code = lv_event_get_code(e);
1068     lv_obj_t * obj = lv_event_get_target(e);
1069 
1070     if(code == LV_EVENT_FOCUSED) {
1071         lv_obj_t * color_cont = lv_obj_get_parent(obj);
1072         if(lv_obj_get_width(color_cont) < LV_HOR_RES / 2) {
1073             lv_anim_t a;
1074             lv_anim_init(&a);
1075             lv_anim_set_var(&a, color_cont);
1076             lv_anim_set_exec_cb(&a, color_changer_anim_cb);
1077             lv_anim_set_values(&a, 0, 256);
1078             lv_anim_set_time(&a, 200);
1079             lv_anim_start(&a);
1080         }
1081     }
1082     else if(code == LV_EVENT_CLICKED) {
1083         lv_palette_t * palette_primary = lv_event_get_user_data(e);
1084         lv_palette_t palette_secondary = (*palette_primary) + 3; /*Use another palette as secondary*/
1085         if(palette_secondary >= _LV_PALETTE_LAST) palette_secondary = 0;
1086 #if LV_USE_THEME_DEFAULT
1087         lv_theme_default_init(NULL, lv_palette_main(*palette_primary), lv_palette_main(palette_secondary),
1088                               LV_THEME_DEFAULT_DARK, font_normal);
1089 #endif
1090         lv_color_t color = lv_palette_main(*palette_primary);
1091         lv_style_set_text_color(&style_icon, color);
1092         lv_chart_set_series_color(chart1, ser1, color);
1093         lv_chart_set_series_color(chart2, ser3, color);
1094     }
1095 }
1096 
create_meter_box(lv_obj_t * parent,const char * title,const char * text1,const char * text2,const char * text3)1097 static lv_obj_t * create_meter_box(lv_obj_t * parent, const char * title, const char * text1, const char * text2,
1098                                    const char * text3)
1099 {
1100     lv_obj_t * cont = lv_obj_create(parent);
1101     lv_obj_set_height(cont, LV_SIZE_CONTENT);
1102     lv_obj_set_flex_grow(cont, 1);
1103 
1104     lv_obj_t * title_label = lv_label_create(cont);
1105     lv_label_set_text(title_label, title);
1106     lv_obj_add_style(title_label, &style_title, 0);
1107 
1108     lv_obj_t * meter = lv_meter_create(cont);
1109     lv_obj_remove_style(meter, NULL, LV_PART_MAIN);
1110     lv_obj_remove_style(meter, NULL, LV_PART_INDICATOR);
1111     lv_obj_set_width(meter, LV_PCT(100));
1112 
1113     lv_obj_t * bullet1 = lv_obj_create(cont);
1114     lv_obj_set_size(bullet1, 13, 13);
1115     lv_obj_remove_style(bullet1, NULL, LV_PART_SCROLLBAR);
1116     lv_obj_add_style(bullet1, &style_bullet, 0);
1117     lv_obj_set_style_bg_color(bullet1, lv_palette_main(LV_PALETTE_RED), 0);
1118     lv_obj_t * label1 = lv_label_create(cont);
1119     lv_label_set_text(label1, text1);
1120 
1121     lv_obj_t * bullet2 = lv_obj_create(cont);
1122     lv_obj_set_size(bullet2, 13, 13);
1123     lv_obj_remove_style(bullet2, NULL, LV_PART_SCROLLBAR);
1124     lv_obj_add_style(bullet2, &style_bullet, 0);
1125     lv_obj_set_style_bg_color(bullet2, lv_palette_main(LV_PALETTE_BLUE), 0);
1126     lv_obj_t * label2 = lv_label_create(cont);
1127     lv_label_set_text(label2, text2);
1128 
1129     lv_obj_t * bullet3 = lv_obj_create(cont);
1130     lv_obj_set_size(bullet3, 13, 13);
1131     lv_obj_remove_style(bullet3,  NULL, LV_PART_SCROLLBAR);
1132     lv_obj_add_style(bullet3, &style_bullet, 0);
1133     lv_obj_set_style_bg_color(bullet3, lv_palette_main(LV_PALETTE_GREEN), 0);
1134     lv_obj_t * label3 = lv_label_create(cont);
1135     lv_label_set_text(label3, text3);
1136 
1137     if(disp_size == DISP_MEDIUM) {
1138         static lv_coord_t grid_col_dsc[] = {LV_GRID_CONTENT, LV_GRID_FR(1), LV_GRID_CONTENT, LV_GRID_FR(8), LV_GRID_TEMPLATE_LAST};
1139         static lv_coord_t grid_row_dsc[] = {LV_GRID_CONTENT, LV_GRID_FR(1), LV_GRID_CONTENT, LV_GRID_CONTENT, LV_GRID_CONTENT, LV_GRID_FR(1), LV_GRID_TEMPLATE_LAST};
1140 
1141         lv_obj_set_grid_dsc_array(cont, grid_col_dsc, grid_row_dsc);
1142         lv_obj_set_grid_cell(title_label, LV_GRID_ALIGN_START, 0, 4, LV_GRID_ALIGN_START, 0, 1);
1143         lv_obj_set_grid_cell(meter, LV_GRID_ALIGN_START, 0, 1, LV_GRID_ALIGN_START, 1, 3);
1144         lv_obj_set_grid_cell(bullet1, LV_GRID_ALIGN_START, 2, 1, LV_GRID_ALIGN_CENTER, 2, 1);
1145         lv_obj_set_grid_cell(bullet2, LV_GRID_ALIGN_START, 2, 1, LV_GRID_ALIGN_CENTER, 3, 1);
1146         lv_obj_set_grid_cell(bullet3, LV_GRID_ALIGN_START, 2, 1, LV_GRID_ALIGN_CENTER, 4, 1);
1147         lv_obj_set_grid_cell(label1, LV_GRID_ALIGN_STRETCH, 3, 1, LV_GRID_ALIGN_CENTER, 2, 1);
1148         lv_obj_set_grid_cell(label2, LV_GRID_ALIGN_STRETCH, 3, 1, LV_GRID_ALIGN_CENTER, 3, 1);
1149         lv_obj_set_grid_cell(label3, LV_GRID_ALIGN_STRETCH, 3, 1, LV_GRID_ALIGN_CENTER, 4, 1);
1150     }
1151     else {
1152         static lv_coord_t grid_col_dsc[] = {LV_GRID_CONTENT, LV_GRID_FR(1), LV_GRID_TEMPLATE_LAST};
1153         static lv_coord_t grid_row_dsc[] = {LV_GRID_CONTENT, LV_GRID_CONTENT, LV_GRID_CONTENT, LV_GRID_CONTENT, LV_GRID_CONTENT, LV_GRID_TEMPLATE_LAST};
1154         lv_obj_set_grid_dsc_array(cont, grid_col_dsc, grid_row_dsc);
1155         lv_obj_set_grid_cell(title_label, LV_GRID_ALIGN_START, 0, 2, LV_GRID_ALIGN_START, 0, 1);
1156         lv_obj_set_grid_cell(meter, LV_GRID_ALIGN_START, 0, 2, LV_GRID_ALIGN_START, 1, 1);
1157         lv_obj_set_grid_cell(bullet1, LV_GRID_ALIGN_START, 0, 1, LV_GRID_ALIGN_START, 2, 1);
1158         lv_obj_set_grid_cell(bullet2, LV_GRID_ALIGN_START, 0, 1, LV_GRID_ALIGN_START, 3, 1);
1159         lv_obj_set_grid_cell(bullet3, LV_GRID_ALIGN_START, 0, 1, LV_GRID_ALIGN_START, 4, 1);
1160         lv_obj_set_grid_cell(label1, LV_GRID_ALIGN_STRETCH, 1, 1, LV_GRID_ALIGN_START, 2, 1);
1161         lv_obj_set_grid_cell(label2, LV_GRID_ALIGN_STRETCH, 1, 1, LV_GRID_ALIGN_START, 3, 1);
1162         lv_obj_set_grid_cell(label3, LV_GRID_ALIGN_STRETCH, 1, 1, LV_GRID_ALIGN_START, 4, 1);
1163     }
1164 
1165 
1166     return meter;
1167 
1168 }
1169 
create_shop_item(lv_obj_t * parent,const void * img_src,const char * name,const char * category,const char * price)1170 static lv_obj_t * create_shop_item(lv_obj_t * parent, const void * img_src, const char * name, const char * category,
1171                                    const char * price)
1172 {
1173     static lv_coord_t grid_col_dsc[] = {LV_GRID_CONTENT, 5, LV_GRID_FR(1), LV_GRID_FR(1), LV_GRID_TEMPLATE_LAST};
1174     static lv_coord_t grid_row_dsc[] = {LV_GRID_FR(1), LV_GRID_FR(1), LV_GRID_TEMPLATE_LAST};
1175 
1176     lv_obj_t * cont = lv_obj_create(parent);
1177     lv_obj_remove_style_all(cont);
1178     lv_obj_set_size(cont, LV_PCT(100), LV_SIZE_CONTENT);
1179     lv_obj_set_grid_dsc_array(cont, grid_col_dsc, grid_row_dsc);
1180 
1181     lv_obj_t * img = lv_img_create(cont);
1182     lv_img_set_src(img, img_src);
1183     lv_obj_set_grid_cell(img, LV_GRID_ALIGN_START, 0, 1, LV_GRID_ALIGN_START, 0, 2);
1184 
1185     lv_obj_t * label;
1186     label = lv_label_create(cont);
1187     lv_label_set_text(label, name);
1188     lv_obj_set_grid_cell(label, LV_GRID_ALIGN_START, 2, 1, LV_GRID_ALIGN_END, 0, 1);
1189 
1190     label = lv_label_create(cont);
1191     lv_label_set_text(label, category);
1192     lv_obj_add_style(label, &style_text_muted, 0);
1193     lv_obj_set_grid_cell(label, LV_GRID_ALIGN_START, 2, 1, LV_GRID_ALIGN_START, 1, 1);
1194 
1195     label = lv_label_create(cont);
1196     lv_label_set_text(label, price);
1197     lv_obj_set_grid_cell(label, LV_GRID_ALIGN_END, 3, 1, LV_GRID_ALIGN_END, 0, 1);
1198 
1199     return cont;
1200 }
1201 
ta_event_cb(lv_event_t * e)1202 static void ta_event_cb(lv_event_t * e)
1203 {
1204     lv_event_code_t code = lv_event_get_code(e);
1205     lv_obj_t * ta = lv_event_get_target(e);
1206     lv_obj_t * kb = lv_event_get_user_data(e);
1207     if(code == LV_EVENT_FOCUSED) {
1208         if(lv_indev_get_type(lv_indev_get_act()) != LV_INDEV_TYPE_KEYPAD) {
1209             lv_keyboard_set_textarea(kb, ta);
1210             lv_obj_set_style_max_height(kb, LV_HOR_RES * 2 / 3, 0);
1211             lv_obj_update_layout(tv);   /*Be sure the sizes are recalculated*/
1212             lv_obj_set_height(tv, LV_VER_RES - lv_obj_get_height(kb));
1213             lv_obj_clear_flag(kb, LV_OBJ_FLAG_HIDDEN);
1214             lv_obj_scroll_to_view_recursive(ta, LV_ANIM_OFF);
1215         }
1216     }
1217     else if(code == LV_EVENT_DEFOCUSED) {
1218         lv_keyboard_set_textarea(kb, NULL);
1219         lv_obj_set_height(tv, LV_VER_RES);
1220         lv_obj_add_flag(kb, LV_OBJ_FLAG_HIDDEN);
1221         lv_indev_reset(NULL, ta);
1222 
1223     }
1224     else if(code == LV_EVENT_READY || code == LV_EVENT_CANCEL) {
1225         lv_obj_set_height(tv, LV_VER_RES);
1226         lv_obj_add_flag(kb, LV_OBJ_FLAG_HIDDEN);
1227         lv_obj_clear_state(ta, LV_STATE_FOCUSED);
1228         lv_indev_reset(NULL, ta);   /*To forget the last clicked object to make it focusable again*/
1229     }
1230 }
1231 
birthday_event_cb(lv_event_t * e)1232 static void birthday_event_cb(lv_event_t * e)
1233 {
1234     lv_event_code_t code = lv_event_get_code(e);
1235     lv_obj_t * ta = lv_event_get_target(e);
1236 
1237     if(code == LV_EVENT_FOCUSED) {
1238         if(lv_indev_get_type(lv_indev_get_act()) == LV_INDEV_TYPE_POINTER) {
1239             if(calendar == NULL) {
1240                 lv_obj_add_flag(lv_layer_top(), LV_OBJ_FLAG_CLICKABLE);
1241                 calendar = lv_calendar_create(lv_layer_top());
1242                 lv_obj_set_style_bg_opa(lv_layer_top(), LV_OPA_50, 0);
1243                 lv_obj_set_style_bg_color(lv_layer_top(), lv_palette_main(LV_PALETTE_GREY), 0);
1244                 if(disp_size == DISP_SMALL) lv_obj_set_size(calendar, 180, 200);
1245                 else if(disp_size == DISP_MEDIUM) lv_obj_set_size(calendar, 200, 220);
1246                 else  lv_obj_set_size(calendar, 300, 330);
1247                 lv_calendar_set_showed_date(calendar, 1990, 01);
1248                 lv_obj_align(calendar, LV_ALIGN_CENTER, 0, 30);
1249                 lv_obj_add_event_cb(calendar, calendar_event_cb, LV_EVENT_ALL, ta);
1250 
1251                 lv_calendar_header_dropdown_create(calendar);
1252             }
1253         }
1254     }
1255 }
1256 
calendar_event_cb(lv_event_t * e)1257 static void calendar_event_cb(lv_event_t * e)
1258 {
1259     lv_event_code_t code = lv_event_get_code(e);
1260     lv_obj_t * ta = lv_event_get_user_data(e);
1261     lv_obj_t * obj = lv_event_get_current_target(e);
1262     if(code == LV_EVENT_VALUE_CHANGED) {
1263         lv_calendar_date_t d;
1264         lv_calendar_get_pressed_date(obj, &d);
1265         char buf[32];
1266         lv_snprintf(buf, sizeof(buf), "%02d.%02d.%d", d.day, d.month, d.year);
1267         lv_textarea_set_text(ta, buf);
1268 
1269         lv_obj_del(calendar);
1270         calendar = NULL;
1271         lv_obj_clear_flag(lv_layer_top(), LV_OBJ_FLAG_CLICKABLE);
1272         lv_obj_set_style_bg_opa(lv_layer_top(), LV_OPA_TRANSP, 0);
1273     }
1274 }
1275 
slider_event_cb(lv_event_t * e)1276 static void slider_event_cb(lv_event_t * e)
1277 {
1278     lv_event_code_t code = lv_event_get_code(e);
1279     lv_obj_t * obj = lv_event_get_target(e);
1280 
1281     if(code == LV_EVENT_REFR_EXT_DRAW_SIZE) {
1282         lv_coord_t * s = lv_event_get_param(e);
1283         *s = LV_MAX(*s, 60);
1284     }
1285     else if(code == LV_EVENT_DRAW_PART_END) {
1286         lv_obj_draw_part_dsc_t * dsc = lv_event_get_param(e);
1287         if(dsc->part == LV_PART_KNOB && lv_obj_has_state(obj, LV_STATE_PRESSED)) {
1288             char buf[8];
1289             lv_snprintf(buf, sizeof(buf), "%"LV_PRId32, lv_slider_get_value(obj));
1290 
1291             lv_point_t text_size;
1292             lv_txt_get_size(&text_size, buf, font_normal, 0, 0, LV_COORD_MAX, LV_TEXT_FLAG_NONE);
1293 
1294             lv_area_t txt_area;
1295             txt_area.x1 = dsc->draw_area->x1 + lv_area_get_width(dsc->draw_area) / 2 - text_size.x / 2;
1296             txt_area.x2 = txt_area.x1 + text_size.x;
1297             txt_area.y2 = dsc->draw_area->y1 - 10;
1298             txt_area.y1 = txt_area.y2 - text_size.y;
1299 
1300             lv_area_t bg_area;
1301             bg_area.x1 = txt_area.x1 - LV_DPX(8);
1302             bg_area.x2 = txt_area.x2 + LV_DPX(8);
1303             bg_area.y1 = txt_area.y1 - LV_DPX(8);
1304             bg_area.y2 = txt_area.y2 + LV_DPX(8);
1305 
1306             lv_draw_rect_dsc_t rect_dsc;
1307             lv_draw_rect_dsc_init(&rect_dsc);
1308             rect_dsc.bg_color = lv_palette_darken(LV_PALETTE_GREY, 3);
1309             rect_dsc.radius = LV_DPX(5);
1310             lv_draw_rect(dsc->draw_ctx, &rect_dsc, &bg_area);
1311 
1312             lv_draw_label_dsc_t label_dsc;
1313             lv_draw_label_dsc_init(&label_dsc);
1314             label_dsc.color = lv_color_white();
1315             label_dsc.font = font_normal;
1316             lv_draw_label(dsc->draw_ctx, &label_dsc, &txt_area, buf, NULL);
1317         }
1318     }
1319 }
1320 
chart_event_cb(lv_event_t * e)1321 static void chart_event_cb(lv_event_t * e)
1322 {
1323     lv_event_code_t code = lv_event_get_code(e);
1324     lv_obj_t * obj = lv_event_get_target(e);
1325 
1326     if(code == LV_EVENT_PRESSED || code == LV_EVENT_RELEASED) {
1327         lv_obj_invalidate(obj); /*To make the value boxes visible*/
1328     }
1329     else if(code == LV_EVENT_DRAW_PART_BEGIN) {
1330         lv_obj_draw_part_dsc_t * dsc = lv_event_get_param(e);
1331         /*Set the markers' text*/
1332         if(dsc->part == LV_PART_TICKS && dsc->id == LV_CHART_AXIS_PRIMARY_X) {
1333             if(lv_chart_get_type(obj) == LV_CHART_TYPE_BAR) {
1334                 const char * month[] = {"I", "II", "III", "IV", "V", "VI", "VII", "VIII", "IX", "X", "XI", "XII"};
1335                 lv_snprintf(dsc->text, dsc->text_length, "%s", month[dsc->value]);
1336             }
1337             else {
1338                 const char * month[] = {"Jan", "Febr", "March", "Apr", "May", "Jun", "July", "Aug", "Sept", "Oct", "Nov", "Dec"};
1339                 lv_snprintf(dsc->text, dsc->text_length, "%s", month[dsc->value]);
1340             }
1341         }
1342 
1343         /*Add the faded area before the lines are drawn */
1344         else if(dsc->part == LV_PART_ITEMS) {
1345 #if LV_DRAW_COMPLEX
1346             /*Add  a line mask that keeps the area below the line*/
1347             if(dsc->p1 && dsc->p2) {
1348                 lv_draw_mask_line_param_t line_mask_param;
1349                 lv_draw_mask_line_points_init(&line_mask_param, dsc->p1->x, dsc->p1->y, dsc->p2->x, dsc->p2->y,
1350                                               LV_DRAW_MASK_LINE_SIDE_BOTTOM);
1351                 int16_t line_mask_id = lv_draw_mask_add(&line_mask_param, NULL);
1352 
1353                 /*Add a fade effect: transparent bottom covering top*/
1354                 lv_coord_t h = lv_obj_get_height(obj);
1355                 lv_draw_mask_fade_param_t fade_mask_param;
1356                 lv_draw_mask_fade_init(&fade_mask_param, &obj->coords, LV_OPA_COVER, obj->coords.y1 + h / 8, LV_OPA_TRANSP,
1357                                        obj->coords.y2);
1358                 int16_t fade_mask_id = lv_draw_mask_add(&fade_mask_param, NULL);
1359 
1360                 /*Draw a rectangle that will be affected by the mask*/
1361                 lv_draw_rect_dsc_t draw_rect_dsc;
1362                 lv_draw_rect_dsc_init(&draw_rect_dsc);
1363                 draw_rect_dsc.bg_opa = LV_OPA_50;
1364                 draw_rect_dsc.bg_color = dsc->line_dsc->color;
1365 
1366                 lv_area_t obj_clip_area;
1367                 _lv_area_intersect(&obj_clip_area, dsc->draw_ctx->clip_area, &obj->coords);
1368                 const lv_area_t * clip_area_ori = dsc->draw_ctx->clip_area;
1369                 dsc->draw_ctx->clip_area = &obj_clip_area;
1370                 lv_area_t a;
1371                 a.x1 = dsc->p1->x;
1372                 a.x2 = dsc->p2->x - 1;
1373                 a.y1 = LV_MIN(dsc->p1->y, dsc->p2->y);
1374                 a.y2 = obj->coords.y2;
1375                 lv_draw_rect(dsc->draw_ctx, &draw_rect_dsc, &a);
1376                 dsc->draw_ctx->clip_area = clip_area_ori;
1377                 /*Remove the masks*/
1378                 lv_draw_mask_remove_id(line_mask_id);
1379                 lv_draw_mask_remove_id(fade_mask_id);
1380             }
1381 #endif
1382 
1383 
1384             const lv_chart_series_t * ser = dsc->sub_part_ptr;
1385 
1386             if(lv_chart_get_pressed_point(obj) == dsc->id) {
1387                 if(lv_chart_get_type(obj) == LV_CHART_TYPE_LINE) {
1388                     dsc->rect_dsc->outline_color = lv_color_white();
1389                     dsc->rect_dsc->outline_width = 2;
1390                 }
1391                 else {
1392                     dsc->rect_dsc->shadow_color = ser->color;
1393                     dsc->rect_dsc->shadow_width = 15;
1394                     dsc->rect_dsc->shadow_spread = 0;
1395                 }
1396 
1397                 char buf[8];
1398                 lv_snprintf(buf, sizeof(buf), "%"LV_PRIu32, dsc->value);
1399 
1400                 lv_point_t text_size;
1401                 lv_txt_get_size(&text_size, buf, font_normal, 0, 0, LV_COORD_MAX, LV_TEXT_FLAG_NONE);
1402 
1403                 lv_area_t txt_area;
1404                 if(lv_chart_get_type(obj) == LV_CHART_TYPE_BAR) {
1405                     txt_area.y2 = dsc->draw_area->y1 - LV_DPX(15);
1406                     txt_area.y1 = txt_area.y2 - text_size.y;
1407                     if(ser == lv_chart_get_series_next(obj, NULL)) {
1408                         txt_area.x1 = dsc->draw_area->x1 + lv_area_get_width(dsc->draw_area) / 2;
1409                         txt_area.x2 = txt_area.x1 + text_size.x;
1410                     }
1411                     else {
1412                         txt_area.x2 = dsc->draw_area->x1 + lv_area_get_width(dsc->draw_area) / 2;
1413                         txt_area.x1 = txt_area.x2 - text_size.x;
1414                     }
1415                 }
1416                 else {
1417                     txt_area.x1 = dsc->draw_area->x1 + lv_area_get_width(dsc->draw_area) / 2 - text_size.x / 2;
1418                     txt_area.x2 = txt_area.x1 + text_size.x;
1419                     txt_area.y2 = dsc->draw_area->y1 - LV_DPX(15);
1420                     txt_area.y1 = txt_area.y2 - text_size.y;
1421                 }
1422 
1423                 lv_area_t bg_area;
1424                 bg_area.x1 = txt_area.x1 - LV_DPX(8);
1425                 bg_area.x2 = txt_area.x2 + LV_DPX(8);
1426                 bg_area.y1 = txt_area.y1 - LV_DPX(8);
1427                 bg_area.y2 = txt_area.y2 + LV_DPX(8);
1428 
1429                 lv_draw_rect_dsc_t rect_dsc;
1430                 lv_draw_rect_dsc_init(&rect_dsc);
1431                 rect_dsc.bg_color = ser->color;
1432                 rect_dsc.radius = LV_DPX(5);
1433                 lv_draw_rect(dsc->draw_ctx, &rect_dsc, &bg_area);
1434 
1435                 lv_draw_label_dsc_t label_dsc;
1436                 lv_draw_label_dsc_init(&label_dsc);
1437                 label_dsc.color = lv_color_white();
1438                 label_dsc.font = font_normal;
1439                 lv_draw_label(dsc->draw_ctx, &label_dsc, &txt_area,  buf, NULL);
1440             }
1441             else {
1442                 dsc->rect_dsc->outline_width = 0;
1443                 dsc->rect_dsc->shadow_width = 0;
1444             }
1445         }
1446     }
1447 }
1448 
1449 
shop_chart_event_cb(lv_event_t * e)1450 static void shop_chart_event_cb(lv_event_t * e)
1451 {
1452     lv_event_code_t code = lv_event_get_code(e);
1453     if(code == LV_EVENT_DRAW_PART_BEGIN) {
1454         lv_obj_draw_part_dsc_t * dsc = lv_event_get_param(e);
1455         /*Set the markers' text*/
1456         if(dsc->part == LV_PART_TICKS && dsc->id == LV_CHART_AXIS_PRIMARY_X) {
1457             const char * month[] = {"Jan", "Febr", "March", "Apr", "May", "Jun", "July", "Aug", "Sept", "Oct", "Nov", "Dec"};
1458             lv_snprintf(dsc->text, dsc->text_length, "%s", month[dsc->value]);
1459         }
1460         if(dsc->part == LV_PART_ITEMS) {
1461             dsc->rect_dsc->bg_opa = LV_OPA_TRANSP; /*We will draw it later*/
1462         }
1463     }
1464     if(code == LV_EVENT_DRAW_PART_END) {
1465         lv_obj_draw_part_dsc_t * dsc = lv_event_get_param(e);
1466         /*Add the faded area before the lines are drawn */
1467         if(dsc->part == LV_PART_ITEMS) {
1468             static const uint32_t devices[10] = {32, 43, 21, 56, 29, 36, 19, 25, 62, 35};
1469             static const uint32_t clothes[10] = {12, 19, 23, 31, 27, 32, 32, 11, 21, 32};
1470             static const uint32_t services[10] = {56, 38, 56, 13, 44, 32, 49, 64, 17, 33};
1471 
1472             lv_draw_rect_dsc_t draw_rect_dsc;
1473             lv_draw_rect_dsc_init(&draw_rect_dsc);
1474 
1475             lv_coord_t h = lv_area_get_height(dsc->draw_area);
1476 
1477             lv_area_t a;
1478             a.x1 = dsc->draw_area->x1;
1479             a.x2 = dsc->draw_area->x2;
1480 
1481             a.y1 = dsc->draw_area->y1;
1482             a.y2 = a.y1 + 4 + (devices[dsc->id] * h) / 100; /*+4 to overlap the radius*/
1483             draw_rect_dsc.bg_color = lv_palette_main(LV_PALETTE_RED);
1484             draw_rect_dsc.radius = 4;
1485             lv_draw_rect(dsc->draw_ctx, &draw_rect_dsc, &a);
1486 
1487             a.y1 = a.y2 - 4;                                    /*-4 to overlap the radius*/
1488             a.y2 = a.y1 + (clothes[dsc->id] * h) / 100;
1489             draw_rect_dsc.bg_color = lv_palette_main(LV_PALETTE_BLUE);
1490             draw_rect_dsc.radius = 0;
1491             lv_draw_rect(dsc->draw_ctx, &draw_rect_dsc, &a);
1492 
1493             a.y1 = a.y2;
1494             a.y2 = a.y1 + (services[dsc->id] * h) / 100;
1495             draw_rect_dsc.bg_color = lv_palette_main(LV_PALETTE_GREEN);
1496             lv_draw_rect(dsc->draw_ctx, &draw_rect_dsc, &a);
1497         }
1498     }
1499 }
1500 
1501 
meter1_indic1_anim_cb(void * var,int32_t v)1502 static void meter1_indic1_anim_cb(void * var, int32_t v)
1503 {
1504     lv_meter_set_indicator_end_value(meter1, var, v);
1505 
1506     lv_obj_t * card = lv_obj_get_parent(meter1);
1507     lv_obj_t * label = lv_obj_get_child(card, -5);
1508     lv_label_set_text_fmt(label, "Revenue: %"LV_PRId32" %%", v);
1509 }
1510 
meter1_indic2_anim_cb(void * var,int32_t v)1511 static void meter1_indic2_anim_cb(void * var, int32_t v)
1512 {
1513     lv_meter_set_indicator_end_value(meter1, var, v);
1514 
1515     lv_obj_t * card = lv_obj_get_parent(meter1);
1516     lv_obj_t * label = lv_obj_get_child(card, -3);
1517     lv_label_set_text_fmt(label, "Sales: %"LV_PRId32" %%", v);
1518 
1519 }
1520 
meter1_indic3_anim_cb(void * var,int32_t v)1521 static void meter1_indic3_anim_cb(void * var, int32_t v)
1522 {
1523     lv_meter_set_indicator_end_value(meter1, var, v);
1524 
1525     lv_obj_t * card = lv_obj_get_parent(meter1);
1526     lv_obj_t * label = lv_obj_get_child(card, -1);
1527     lv_label_set_text_fmt(label, "Costs: %"LV_PRId32" %%", v);
1528 }
1529 
meter2_timer_cb(lv_timer_t * timer)1530 static void meter2_timer_cb(lv_timer_t * timer)
1531 {
1532     lv_meter_indicator_t ** indics = timer->user_data;
1533 
1534     static bool down1 = false;
1535     static bool down2 = false;
1536     static bool down3 = false;
1537 
1538 
1539     if(down1) {
1540         session_desktop -= 137;
1541         if(session_desktop < 1400) down1 = false;
1542     }
1543     else {
1544         session_desktop += 116;
1545         if(session_desktop > 4500) down1 = true;
1546     }
1547 
1548     if(down2) {
1549         session_tablet -= 3;
1550         if(session_tablet < 1400) down2 = false;
1551     }
1552     else {
1553         session_tablet += 9;
1554         if(session_tablet > 4500) down2 = true;
1555     }
1556 
1557     if(down3) {
1558         session_mobile -= 57;
1559         if(session_mobile < 1400) down3 = false;
1560     }
1561     else {
1562         session_mobile += 76;
1563         if(session_mobile > 4500) down3 = true;
1564     }
1565 
1566     uint32_t all = session_desktop + session_tablet + session_mobile;
1567     uint32_t pct1 = (session_desktop * 97) / all;
1568     uint32_t pct2 = (session_tablet * 97) / all;
1569 
1570     lv_meter_set_indicator_start_value(meter2, indics[0], 0);
1571     lv_meter_set_indicator_end_value(meter2, indics[0], pct1);
1572 
1573     lv_meter_set_indicator_start_value(meter2, indics[1], pct1 + 1);
1574     lv_meter_set_indicator_end_value(meter2, indics[1], pct1 + 1 + pct2);
1575 
1576     lv_meter_set_indicator_start_value(meter2, indics[2], pct1 + 1 + pct2 + 1);
1577     lv_meter_set_indicator_end_value(meter2, indics[2], 99);
1578 
1579     lv_obj_t * card = lv_obj_get_parent(meter2);
1580     lv_obj_t * label;
1581 
1582     label = lv_obj_get_child(card, -5);
1583     lv_label_set_text_fmt(label, "Desktop: %"LV_PRIu32, session_desktop);
1584 
1585     label = lv_obj_get_child(card, -3);
1586     lv_label_set_text_fmt(label, "Tablet: %"LV_PRIu32, session_tablet);
1587 
1588     label = lv_obj_get_child(card, -1);
1589     lv_label_set_text_fmt(label, "Mobile: %"LV_PRIu32, session_mobile);
1590 }
1591 
meter3_anim_cb(void * var,int32_t v)1592 static void meter3_anim_cb(void * var, int32_t v)
1593 {
1594     lv_meter_set_indicator_value(meter3, var, v);
1595 
1596     lv_obj_t * label = lv_obj_get_child(meter3, 0);
1597     lv_label_set_text_fmt(label, "%"LV_PRId32, v);
1598 }
1599 
1600 #endif
1601