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