1 /**
2  * @file lv_demo_ebike_stats.c
3  *
4  */
5 
6 /*********************
7  *      INCLUDES
8  *********************/
9 #include "lv_demo_ebike.h"
10 #if LV_USE_DEMO_EBIKE
11 
12 #include "../../lvgl_private.h"
13 #include "translations/lv_i18n.h"
14 #include "lv_demo_ebike_stats.h"
15 #include "lv_demo_ebike_private.h"
16 
17 /*********************
18  *      DEFINES
19  *********************/
20 
21 /**********************
22  *      TYPEDEFS
23  **********************/
24 typedef enum {
25     MODE_AVG_SPEED,
26     MODE_DISTANCE,
27     MODE_TOP_SPEED,
28 } stat_mode_t;
29 
30 /**********************
31  *  STATIC PROTOTYPES
32  **********************/
33 static lv_obj_t * left_cont_create(lv_obj_t * parent);
34 static lv_obj_t * right_cont_create(lv_obj_t * parent);
35 
36 /**********************
37  *  STATIC VARIABLES
38  **********************/
39 /*Subjects used only by the statistics page to it easier to sync widgets*/
40 static lv_subject_t subject_week;
41 static lv_subject_t subject_day;
42 static lv_subject_t subject_avg_speed;
43 static lv_subject_t subject_distance;
44 static lv_subject_t subject_top_speed;
45 static lv_subject_t subject_mode;
46 static lv_obj_t * left_arrow;
47 static lv_obj_t * right_arrow;
48 
49 static int32_t top_speed_values[] = {46, 28, 42, 39, 41, 25, 49, 37, 35, 40, 33, 40, 31, 27, 45, 38, 41, 40, 27, 25, 30, 45, 31, 43, 41, 34, 47, 32, 30, 33};
50 static int32_t avg_speed_values[] = {21, 24, 27, 29, 23, 28, 28, 22, 29, 28, 24, 26, 24, 30, 25, 25, 20, 28, 24, 27, 25, 27, 20, 29, 25, 24, 23, 26, 27, 27};
51 static int32_t distance_values[] =  {87, 63, 29, 84, 27, 84, 33, 76, 77, 49, 46, 29, 67, 21, 87, 75, 40, 19, 12, 67, 66, 11, 59, 33, 51, 75, 44, 61, 53, 63};
52 
53 /**********************
54  *      MACROS
55  **********************/
56 
57 /**********************
58  *   GLOBAL FUNCTIONS
59  **********************/
60 
lv_demo_ebike_stats_init(void)61 void lv_demo_ebike_stats_init(void)
62 {
63     lv_subject_init_int(&subject_mode, MODE_DISTANCE);
64     lv_subject_init_int(&subject_week, 0);
65     lv_subject_init_int(&subject_day, 0);
66     lv_subject_init_int(&subject_top_speed, 0);
67     lv_subject_init_int(&subject_avg_speed, 0);
68     lv_subject_init_int(&subject_distance, 0);
69 }
70 
lv_demo_ebike_stats_deinit(void)71 void lv_demo_ebike_stats_deinit(void)
72 {
73     lv_subject_deinit(&subject_mode);
74     lv_subject_deinit(&subject_week);
75     lv_subject_deinit(&subject_day);
76     lv_subject_deinit(&subject_top_speed);
77     lv_subject_deinit(&subject_avg_speed);
78     lv_subject_deinit(&subject_distance);
79 }
80 
lv_demo_ebike_stats_create(lv_obj_t * parent)81 void lv_demo_ebike_stats_create(lv_obj_t * parent)
82 {
83     lv_obj_t * main_cont = lv_obj_create(parent);
84     lv_obj_set_style_bg_opa(main_cont, 0, 0);
85     lv_obj_set_size(main_cont, lv_pct(100), lv_pct(100));
86     lv_obj_set_flex_flow(main_cont, LV_DEMO_EBIKE_PORTRAIT ? LV_FLEX_FLOW_COLUMN : LV_FLEX_FLOW_ROW);
87 
88     lv_obj_t * left_cont = left_cont_create(main_cont);
89 #if LV_DEMO_EBIKE_PORTRAIT
90     lv_obj_set_size(left_cont, lv_pct(100), 120);
91 #else
92     lv_obj_set_size(left_cont, 164, lv_pct(100));
93 #endif
94 
95     lv_obj_t * right_cont = right_cont_create(main_cont);
96     lv_obj_set_size(right_cont, lv_pct(100), lv_pct(100));
97     lv_obj_set_flex_grow(right_cont, 1);
98 }
99 
100 /**********************
101  *   STATIC FUNCTIONS
102  **********************/
103 
left_cont_create(lv_obj_t * parent)104 static lv_obj_t * left_cont_create(lv_obj_t * parent)
105 {
106     lv_obj_t * left_cont = lv_obj_create(parent);
107     lv_obj_set_style_bg_opa(left_cont, 0, 0);
108     lv_obj_remove_flag(left_cont, LV_OBJ_FLAG_SCROLLABLE);
109 
110     lv_obj_t * label = lv_label_create(left_cont);
111     lv_obj_align(label, LV_ALIGN_TOP_LEFT, 24, 16);
112     lv_label_set_text(label, _("STATS"));
113     lv_obj_set_style_text_font(label, EBIKE_FONT_MEDIUM, 0);
114 
115 
116     lv_obj_t * stats_img;
117 #if LV_USE_LOTTIE
118     extern const uint8_t lottie_ebike_stats[];
119     extern const size_t lottie_ebike_stats_size;
120     stats_img = lv_lottie_create(left_cont);
121     lv_lottie_set_src_data(stats_img, lottie_ebike_stats, lottie_ebike_stats_size);
122     lv_lottie_set_draw_buf(stats_img, lv_demo_ebike_get_lottie_draw_buf());
123 #else
124     stats_img = lv_image_create(left_cont);
125     LV_IMAGE_DECLARE(img_ebike_stats_large);
126     lv_image_set_src(stats_img, &img_ebike_stats_large);
127 #endif
128 
129 #if LV_DEMO_EBIKE_PORTRAIT
130     lv_obj_align(stats_img, LV_ALIGN_BOTTOM_RIGHT, 0, 0);
131 #else
132     lv_obj_align(stats_img, LV_ALIGN_BOTTOM_MID, 0, 0);
133 #endif
134     return left_cont;
135 }
tabs_click_event_cb(lv_event_t * e)136 static void tabs_click_event_cb(lv_event_t * e)
137 {
138     lv_obj_t * btnm = lv_event_get_target(e);
139     lv_subject_set_int(&subject_mode, lv_buttonmatrix_get_selected_button(btnm));
140 }
141 
tabs_create(lv_obj_t * parent)142 static lv_obj_t * tabs_create(lv_obj_t * parent)
143 {
144     lv_obj_t * btnm = lv_buttonmatrix_create(parent);
145 #if LV_DEMO_EBIKE_PORTRAIT
146     lv_obj_set_size(btnm, lv_pct(100), 40);
147 #else
148     lv_obj_set_size(btnm, lv_pct(100), 24);
149 #endif
150     lv_obj_set_style_bg_opa(btnm, 0, 0);
151     lv_obj_set_style_bg_opa(btnm, 0, LV_PART_ITEMS);
152     lv_obj_set_style_border_width(btnm, 1, LV_PART_ITEMS);
153     lv_obj_set_style_border_width(btnm, 2, LV_PART_ITEMS | LV_STATE_FOCUSED);
154     lv_obj_set_style_border_side(btnm, LV_BORDER_SIDE_BOTTOM, LV_PART_ITEMS);
155     lv_obj_set_style_border_color(btnm, EBIKE_COLOR_TURQUOISE, LV_PART_ITEMS);
156     lv_obj_set_style_border_opa(btnm, LV_OPA_20, LV_PART_ITEMS);
157     lv_obj_set_style_border_opa(btnm, LV_OPA_COVER, LV_PART_ITEMS | LV_STATE_FOCUSED);
158     lv_obj_set_style_text_font(btnm, EBIKE_FONT_SMALL, LV_PART_ITEMS);
159     lv_obj_set_style_text_color(btnm, lv_color_white(), LV_PART_ITEMS);
160     lv_obj_set_style_text_color(btnm, EBIKE_COLOR_TURQUOISE, LV_PART_ITEMS | LV_STATE_FOCUSED);
161     static const char * texts[4];
162     texts[0] = _("Avg. speed");
163     texts[1] = _("Distance");
164     texts[2] = _("Top speed");
165 
166     lv_buttonmatrix_set_map(btnm, texts);
167 
168     lv_obj_add_event_cb(btnm, tabs_click_event_cb, LV_EVENT_VALUE_CHANGED, NULL);
169     lv_buttonmatrix_set_selected_button(btnm, lv_subject_get_int(&subject_mode));
170 
171     return btnm;
172 }
173 
left_click_event_cb(lv_event_t * e)174 static void left_click_event_cb(lv_event_t * e)
175 {
176     LV_UNUSED(e);
177     int32_t week = lv_subject_get_int(&subject_week);
178     if(week > 0) {
179         week--;
180         lv_subject_set_int(&subject_week, week);
181     }
182 }
183 
right_click_event_cb(lv_event_t * e)184 static void right_click_event_cb(lv_event_t * e)
185 {
186     LV_UNUSED(e);
187     int32_t week = lv_subject_get_int(&subject_week);
188     if(week < 3) {
189         week++;
190         lv_subject_set_int(&subject_week, week);
191     }
192 
193 }
194 
current_week_observer_cb(lv_observer_t * observer,lv_subject_t * subject)195 static void current_week_observer_cb(lv_observer_t * observer, lv_subject_t * subject)
196 {
197     LV_UNUSED(subject);
198     lv_obj_t * label = lv_observer_get_target_obj(observer);
199     int32_t week = lv_subject_get_int(&subject_week);
200     lv_label_set_text_fmt(label, _("March %d - March %d"), week * 7 + 1, week * 7 + 7);
201 
202 
203     if(week == 0) lv_obj_set_style_image_opa(left_arrow, LV_OPA_50, 0);
204     else lv_obj_set_style_image_opa(left_arrow, LV_OPA_100, 0);
205 
206     if(week == 3) lv_obj_set_style_image_opa(right_arrow, LV_OPA_50, 0);
207     else lv_obj_set_style_image_opa(right_arrow, LV_OPA_100, 0);
208 }
209 
current_data_objserver_cb(lv_observer_t * observer,lv_subject_t * subject)210 static void current_data_objserver_cb(lv_observer_t * observer, lv_subject_t * subject)
211 {
212     LV_UNUSED(subject);
213     lv_obj_t * label = lv_observer_get_target_obj(observer);
214     stat_mode_t mode = lv_subject_get_int(&subject_mode);
215     int32_t day = lv_subject_get_int(&subject_day);
216     switch(mode) {
217         case MODE_AVG_SPEED:
218             lv_label_set_text_fmt(label, "%dkm/h", avg_speed_values[day]);
219             break;
220         case MODE_TOP_SPEED:
221             lv_label_set_text_fmt(label, "%dkm/h", top_speed_values[day]);
222             break;
223         case MODE_DISTANCE:
224             lv_label_set_text_fmt(label, "%dkm", distance_values[day]);
225             break;
226     }
227 }
228 
data_cont_create(lv_obj_t * parent)229 static lv_obj_t * data_cont_create(lv_obj_t * parent)
230 {
231     lv_obj_t * cont = lv_obj_create(parent);
232     lv_obj_set_style_bg_opa(cont, 0, 0);
233     lv_obj_set_size(cont, lv_pct(100), LV_SIZE_CONTENT);
234     lv_obj_set_style_text_color(cont, lv_color_white(), 0);
235     lv_obj_set_flex_flow(cont, LV_FLEX_FLOW_COLUMN);
236     lv_obj_set_style_flex_main_place(cont, LV_FLEX_ALIGN_CENTER, 0);
237     lv_obj_set_style_flex_cross_place(cont, LV_FLEX_ALIGN_CENTER, 0);
238     lv_obj_set_style_flex_track_place(cont, LV_FLEX_ALIGN_SPACE_BETWEEN, 0);
239 
240     LV_IMAGE_DECLARE(img_ebike_arrow_left_2);
241     LV_IMAGE_DECLARE(img_ebike_arrow_right_2);
242 
243     left_arrow = lv_image_create(cont);
244     lv_image_set_src(left_arrow, &img_ebike_arrow_left_2);
245     lv_obj_set_ext_click_area(left_arrow, 32);
246     lv_obj_set_size(left_arrow, 40, 40);
247     lv_obj_add_flag(left_arrow, LV_OBJ_FLAG_CLICKABLE);
248     lv_obj_add_event_cb(left_arrow, left_click_event_cb, LV_EVENT_CLICKED, NULL);
249 
250     lv_obj_t * label = lv_label_create(cont);
251     lv_label_set_text(label, "138km");
252     lv_obj_set_style_text_font(label, EBIKE_FONT_LARGE, 0);
253     lv_obj_add_flag(label, LV_OBJ_FLAG_FLEX_IN_NEW_TRACK);
254     lv_subject_add_observer_obj(&subject_mode, current_data_objserver_cb, label, NULL);
255     lv_subject_add_observer_obj(&subject_day, current_data_objserver_cb, label, NULL);
256 
257     label = lv_label_create(cont);
258     lv_label_set_text(label, "March 18 - March 25");
259     lv_obj_set_style_text_font(label, EBIKE_FONT_SMALL, 0);
260 
261     right_arrow = lv_image_create(cont);
262     lv_image_set_src(right_arrow, &img_ebike_arrow_right_2);
263     lv_obj_set_ext_click_area(right_arrow, 32);
264     lv_obj_set_size(right_arrow, 40, 40);
265     lv_obj_add_flag(right_arrow, LV_OBJ_FLAG_FLEX_IN_NEW_TRACK);
266     lv_obj_add_flag(right_arrow, LV_OBJ_FLAG_CLICKABLE);
267     lv_obj_add_event_cb(right_arrow, right_click_event_cb, LV_EVENT_CLICKED, NULL);
268 
269     lv_subject_add_observer_obj(&subject_week, current_week_observer_cb, label, NULL);
270 
271     return cont;
272 }
273 
274 static uint32_t day_pressed;
chart_value_changed_event_cb(lv_event_t * e)275 static void chart_value_changed_event_cb(lv_event_t * e)
276 {
277     lv_obj_t * chart = lv_event_get_target(e);
278     day_pressed = lv_chart_get_pressed_point(chart);
279     if(day_pressed == 0) return;
280 
281 
282 }
chart_released_event_cb(lv_event_t * e)283 static void chart_released_event_cb(lv_event_t * e)
284 {
285     LV_UNUSED(e);
286     lv_subject_set_int(&subject_day, day_pressed);
287 }
288 
289 
chart_draw_event_cb(lv_event_t * e)290 static void chart_draw_event_cb(lv_event_t * e)
291 {
292     lv_obj_t * chart = lv_event_get_target(e);
293     lv_obj_t * cont = lv_obj_get_parent(chart);
294     lv_draw_rect_dsc_t rect_dsc;
295     lv_draw_rect_dsc_init(&rect_dsc);
296     rect_dsc.bg_grad.dir = LV_GRAD_DIR_VER;
297     rect_dsc.bg_grad.stops_count = 2;
298     rect_dsc.bg_grad.stops[0].color = lv_color_hex(0x00C3BC);
299     rect_dsc.bg_grad.stops[0].opa = LV_OPA_0;
300     rect_dsc.bg_grad.stops[0].frac = 50;
301     rect_dsc.bg_grad.stops[1].color = lv_color_hex(0x8968B6);
302     rect_dsc.bg_grad.stops[1].opa = LV_OPA_100;
303     rect_dsc.bg_grad.stops[1].frac = 200;
304 
305     uint32_t day = lv_subject_get_int(&subject_day);
306 
307     lv_point_t p;
308     lv_chart_get_point_pos_by_id(chart, lv_chart_get_series_next(chart, NULL), day, &p);
309     lv_coord_t w = lv_obj_get_width(cont) / 7;
310     lv_area_t a;
311     a.x1 = chart->coords.x1 + p.x - w / 2;
312     a.x2 = chart->coords.x1 + p.x + w / 2;
313     a.y1 = chart->coords.y1;
314     a.y2 = chart->coords.y2;
315     lv_draw_rect(lv_event_get_layer(e), &rect_dsc, &a);
316 
317     char buf[32];
318     lv_snprintf(buf, sizeof(buf), _("March %d"), lv_subject_get_int(&subject_day));
319     lv_draw_label_dsc_t label_dsc;
320     lv_draw_label_dsc_init(&label_dsc);
321     label_dsc.font = EBIKE_FONT_SMALL;
322     label_dsc.color = lv_color_white();
323     label_dsc.text = buf;
324     label_dsc.text_local = 1;
325     label_dsc.align = LV_TEXT_ALIGN_CENTER;
326 
327     a.x1 = chart->coords.x1 + p.x - 100;
328     a.x2 = chart->coords.x1 + p.x + 100;
329     a.y1 = chart->coords.y2 + 5;
330     a.y2 = chart->coords.y2 + 20;
331     lv_draw_label(lv_event_get_layer(e), &label_dsc, &a);
332 }
333 
chart_refr_ext_draw(lv_event_t * e)334 static void chart_refr_ext_draw(lv_event_t * e)
335 {
336 #if LV_DEMO_EBIKE_PORTRAIT
337     lv_event_set_ext_draw_size(e, 48);
338 #else
339     lv_event_set_ext_draw_size(e, 32);
340 #endif
341 }
342 
chart_draw_task_event_cb(lv_event_t * e)343 static void chart_draw_task_event_cb(lv_event_t * e)
344 {
345     lv_draw_task_t * draw_task = lv_event_get_draw_task(e);
346     lv_draw_dsc_base_t * base_dsc = draw_task->draw_dsc;
347 
348     if(base_dsc->part != LV_PART_ITEMS || draw_task->type != LV_DRAW_TASK_TYPE_LINE) return;
349 
350     lv_obj_t * obj = lv_event_get_target(e);
351 
352     /*Draw a triangle below the line witch some opacity gradient*/
353     lv_draw_line_dsc_t * draw_line_dsc = draw_task->draw_dsc;
354     lv_draw_triangle_dsc_t tri_dsc;
355 
356     lv_draw_triangle_dsc_init(&tri_dsc);
357     tri_dsc.p[0].x = draw_line_dsc->p1.x;
358     tri_dsc.p[0].y = draw_line_dsc->p1.y;
359     tri_dsc.p[1].x = draw_line_dsc->p2.x;
360     tri_dsc.p[1].y = draw_line_dsc->p2.y;
361     tri_dsc.p[2].x = draw_line_dsc->p1.y < draw_line_dsc->p2.y ? draw_line_dsc->p1.x : draw_line_dsc->p2.x;
362     tri_dsc.p[2].y = LV_MAX(draw_line_dsc->p1.y, draw_line_dsc->p2.y);
363     tri_dsc.bg_grad.dir = LV_GRAD_DIR_VER;
364 
365     int32_t full_h = lv_obj_get_height(obj);
366     int32_t fract_upper = (int32_t)(LV_MIN(draw_line_dsc->p1.y, draw_line_dsc->p2.y) - obj->coords.y1) * 255 / full_h;
367     int32_t fract_lower = (int32_t)(LV_MAX(draw_line_dsc->p1.y, draw_line_dsc->p2.y) - obj->coords.y1) * 255 / full_h;
368     tri_dsc.bg_grad.stops[0].color = lv_color_hex(0x3987CF);
369     tri_dsc.bg_grad.stops[0].opa = 200 * (255 - fract_upper) / 256;
370     tri_dsc.bg_grad.stops[0].frac = 0;
371     tri_dsc.bg_grad.stops[1].color = lv_color_hex(0x3987CF);
372     tri_dsc.bg_grad.stops[1].opa = 200 * (255 - fract_lower) / 256;
373     tri_dsc.bg_grad.stops[1].frac = 255;
374 
375     lv_draw_triangle(base_dsc->layer, &tri_dsc);
376 
377     /*Draw rectangle below the triangle*/
378     lv_draw_rect_dsc_t rect_dsc;
379     lv_draw_rect_dsc_init(&rect_dsc);
380     rect_dsc.bg_grad.dir = LV_GRAD_DIR_VER;
381     rect_dsc.bg_grad.stops[0].color = lv_color_hex(0x3987CF);
382     rect_dsc.bg_grad.stops[0].frac = 0;
383     rect_dsc.bg_grad.stops[0].opa = 200 * (255 - fract_lower) / 256;
384     rect_dsc.bg_grad.stops[1].color = lv_color_hex(0x3987CF);
385     rect_dsc.bg_grad.stops[1].frac = 255;
386     rect_dsc.bg_grad.stops[1].opa = 0;
387 
388     lv_area_t rect_area;
389     rect_area.x1 = (int32_t)draw_line_dsc->p1.x;
390     rect_area.x2 = (int32_t)draw_line_dsc->p2.x - 1;
391     rect_area.y1 = (int32_t)LV_MAX(draw_line_dsc->p1.y, draw_line_dsc->p2.y);
392     rect_area.y2 = (int32_t)obj->coords.y2;
393     lv_draw_rect(base_dsc->layer, &rect_dsc, &rect_area);
394 }
395 
chart_gesture_event_cb(lv_event_t * e)396 static void chart_gesture_event_cb(lv_event_t * e)
397 {
398     LV_UNUSED(e);
399     lv_dir_t d = lv_indev_get_gesture_dir(lv_indev_active());
400 
401     int32_t week = lv_subject_get_int(&subject_week);
402     if(d == LV_DIR_RIGHT) {
403         if(week > 0) week--;
404     }
405     else if(d == LV_DIR_LEFT) {
406         if(week < 3) week++;
407     }
408     else {
409         return;
410     }
411 
412     lv_indev_wait_release(lv_indev_active());
413     lv_subject_set_int(&subject_week, week);
414 }
415 
chart_week_observer_cb(lv_observer_t * observer,lv_subject_t * subject)416 static void chart_week_observer_cb(lv_observer_t * observer, lv_subject_t * subject)
417 {
418     LV_UNUSED(subject);
419     int32_t week = lv_subject_get_int(&subject_week);
420     lv_subject_set_int(&subject_day, week * 7 + 1);
421 
422     lv_obj_t * chart = lv_observer_get_target_obj(observer);
423     lv_obj_t * cont = lv_obj_get_parent(chart);
424 
425     lv_point_t p;
426     lv_chart_get_point_pos_by_id(chart, lv_chart_get_series_next(chart, NULL), week * 7, &p);
427     lv_obj_scroll_to_x(cont,  p.x, LV_ANIM_ON);
428 }
429 
chart_mode_observer_cb(lv_observer_t * observer,lv_subject_t * subject)430 static void chart_mode_observer_cb(lv_observer_t * observer, lv_subject_t * subject)
431 {
432     LV_UNUSED(subject);
433     lv_obj_t * chart = lv_observer_get_target_obj(observer);
434     lv_chart_series_t * ser = lv_chart_get_series_next(chart, NULL);
435 
436     switch(lv_subject_get_int(&subject_mode)) {
437         case MODE_AVG_SPEED:
438             lv_chart_set_range(chart, LV_CHART_AXIS_PRIMARY_Y, 0, 30);
439             lv_chart_set_ext_y_array(chart, ser, avg_speed_values);
440             break;
441         case MODE_TOP_SPEED:
442             lv_chart_set_range(chart, LV_CHART_AXIS_PRIMARY_Y, 0, 50);
443             lv_chart_set_ext_y_array(chart, ser, top_speed_values);
444             break;
445         case MODE_DISTANCE:
446             lv_chart_set_range(chart, LV_CHART_AXIS_PRIMARY_Y, 0, 90);
447             lv_chart_set_ext_y_array(chart, ser, distance_values);
448             break;
449         default:
450             break;
451     }
452 }
453 
chart_day_observer_cb(lv_observer_t * observer,lv_subject_t * subject)454 static void chart_day_observer_cb(lv_observer_t * observer, lv_subject_t * subject)
455 {
456     LV_UNUSED(subject);
457     lv_obj_t * chart = lv_observer_get_target_obj(observer);
458 
459     int32_t day = lv_subject_get_int(&subject_day);
460 
461     lv_subject_set_int(&subject_avg_speed, avg_speed_values[day]);
462     lv_subject_set_int(&subject_distance, distance_values[day]);
463     lv_subject_set_int(&subject_top_speed, top_speed_values[day]);
464 
465     lv_obj_invalidate(chart);
466 }
467 
chart_create(lv_obj_t * parent)468 static lv_obj_t * chart_create(lv_obj_t * parent)
469 {
470     lv_obj_t * cont = lv_obj_create(parent);
471     lv_obj_set_width(cont, lv_pct(100));
472     lv_obj_set_flex_grow(cont, 1);
473     lv_obj_set_style_bg_opa(cont, 0, 0);
474     lv_obj_remove_flag(cont, LV_OBJ_FLAG_SCROLLABLE);
475 
476     lv_obj_t * chart = lv_chart_create(cont);
477     lv_obj_set_flex_grow(chart, 1);
478     lv_obj_set_size(chart, lv_pct(370), lv_pct(100));
479     lv_chart_set_update_mode(chart, LV_CHART_UPDATE_MODE_CIRCULAR);
480     lv_chart_set_point_count(chart, 30);
481     lv_chart_set_div_line_count(chart, 0, 0);
482     lv_obj_remove_flag(chart, LV_OBJ_FLAG_GESTURE_BUBBLE);
483     lv_obj_set_style_line_width(chart, 3, LV_PART_ITEMS);
484     lv_obj_set_style_size(chart, 10, 10, LV_PART_INDICATOR);
485     lv_obj_set_style_bg_opa(chart, LV_OPA_COVER, LV_PART_INDICATOR);
486     lv_obj_set_style_bg_color(chart, lv_color_black(), LV_PART_INDICATOR);
487     lv_obj_set_style_radius(chart, LV_RADIUS_CIRCLE, LV_PART_INDICATOR);
488     lv_obj_set_style_border_color(chart, lv_color_black(), LV_PART_INDICATOR);
489     lv_obj_set_style_border_width(chart, 2, LV_PART_INDICATOR);
490     lv_obj_set_style_border_width(chart, 1, 0);
491     lv_obj_set_style_border_side(chart, LV_BORDER_SIDE_BOTTOM, 0);
492     lv_obj_set_style_bg_opa(chart, 0, 0);
493     lv_obj_set_style_margin_bottom(chart, 24, 0);
494     lv_obj_set_style_max_height(chart, 260, 0);
495 
496     lv_obj_add_event_cb(chart, chart_value_changed_event_cb, LV_EVENT_VALUE_CHANGED, NULL);
497     lv_obj_add_event_cb(chart, chart_released_event_cb, LV_EVENT_RELEASED, NULL);
498     lv_obj_add_event_cb(chart, chart_draw_event_cb, LV_EVENT_DRAW_MAIN_BEGIN, NULL);
499     lv_obj_add_event_cb(chart, chart_refr_ext_draw, LV_EVENT_REFR_EXT_DRAW_SIZE, NULL);
500     lv_obj_add_event_cb(chart, chart_draw_task_event_cb, LV_EVENT_DRAW_TASK_ADDED, NULL);
501     lv_obj_add_event_cb(chart, chart_gesture_event_cb, LV_EVENT_GESTURE, NULL);
502     lv_obj_add_flag(chart, LV_OBJ_FLAG_SEND_DRAW_TASK_EVENTS);
503 
504     lv_chart_series_t * ser = lv_chart_add_series(chart, lv_color_white(), 0);
505     lv_chart_set_next_value(chart, ser, 30);
506     lv_chart_set_next_value(chart, ser, 60);
507     lv_chart_set_next_value(chart, ser, 22);
508     lv_chart_set_next_value(chart, ser, 40);
509     lv_chart_set_next_value(chart, ser, 48);
510     lv_chart_set_next_value(chart, ser, 30);
511     lv_chart_set_next_value(chart, ser, 69);
512     lv_chart_set_next_value(chart, ser, 21);
513     lv_chart_set_next_value(chart, ser, 60);
514 
515     lv_subject_add_observer_obj(&subject_week, chart_week_observer_cb, chart, NULL);
516     lv_subject_add_observer_obj(&subject_mode, chart_mode_observer_cb, chart, NULL);
517     lv_subject_add_observer_obj(&subject_day, chart_day_observer_cb, chart, NULL);
518 
519     return chart;
520 }
521 
stat_card_create(lv_obj_t * parent,const char * name,lv_subject_t * subject,const char * fmt)522 static lv_obj_t * stat_card_create(lv_obj_t * parent, const char * name, lv_subject_t * subject, const char * fmt)
523 {
524     lv_obj_t * cont = lv_obj_create(parent);
525     lv_obj_set_flex_flow(cont, LV_FLEX_FLOW_COLUMN);
526     lv_obj_set_style_flex_track_place(cont, LV_FLEX_ALIGN_CENTER, 0);
527     lv_obj_set_flex_grow(cont, 1);
528     lv_obj_set_height(cont, LV_SIZE_CONTENT);
529     lv_obj_set_style_bg_opa(cont, 0, 0);
530 
531     lv_obj_t * label = lv_label_create(cont);
532     lv_label_set_text(label, name);
533     lv_obj_set_style_text_font(label, EBIKE_FONT_SMALL, 0);
534 
535     label = lv_label_create(cont);
536     lv_obj_set_style_text_font(label, EBIKE_FONT_MEDIUM, 0);
537     lv_label_bind_text(label, subject, fmt);
538 
539     return cont;
540 }
541 
stat_cont_create(lv_obj_t * parent)542 static lv_obj_t * stat_cont_create(lv_obj_t * parent)
543 {
544     lv_obj_t * cont = lv_obj_create(parent);
545     lv_obj_set_style_bg_opa(cont, 0, 0);
546     lv_obj_set_size(cont, lv_pct(100), LV_SIZE_CONTENT);
547     lv_obj_set_flex_flow(cont, LV_FLEX_FLOW_ROW);
548 
549     stat_card_create(cont, _("Avg. speed"), &subject_avg_speed, "%dkm/h");
550     stat_card_create(cont, _("Distance"), &subject_distance, "%dkm");
551     stat_card_create(cont, _("Top speed"), &subject_top_speed, "%dkm/h");
552 
553     return cont;
554 }
555 
right_cont_create(lv_obj_t * parent)556 static lv_obj_t * right_cont_create(lv_obj_t * parent)
557 {
558     lv_obj_t * right_cont = lv_obj_create(parent);
559     lv_obj_set_style_bg_opa(right_cont, 0, 0);
560     lv_obj_set_flex_flow(right_cont, LV_FLEX_FLOW_COLUMN);
561     lv_obj_set_style_flex_main_place(right_cont, LV_FLEX_ALIGN_SPACE_BETWEEN, 0);
562     lv_obj_set_style_pad_ver(right_cont, 12, 0);
563     lv_obj_set_style_pad_right(right_cont, 8, 0);
564     lv_obj_set_style_pad_row(right_cont, 8, 0);
565     lv_obj_set_height(right_cont, lv_pct(100));
566 
567     tabs_create(right_cont);
568     data_cont_create(right_cont);
569     chart_create(right_cont);
570     stat_cont_create(right_cont);
571 
572     return right_cont;
573 }
574 
575 #endif /*LV_USE_DEMO_EBIKE*/
576