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