1 #include "../../lv_examples.h"
2 #if LV_USE_CHART && LV_DRAW_COMPLEX && LV_BUILD_EXAMPLES
3
4 static lv_obj_t * chart1;
5 static lv_chart_series_t * ser1;
6 static lv_chart_series_t * ser2;
7
draw_event_cb(lv_event_t * e)8 static void draw_event_cb(lv_event_t * e)
9 {
10 lv_obj_t * obj = lv_event_get_target(e);
11
12 /*Add the faded area before the lines are drawn*/
13 lv_obj_draw_part_dsc_t * dsc = lv_event_get_draw_part_dsc(e);
14 if(dsc->part == LV_PART_ITEMS) {
15 if(!dsc->p1 || !dsc->p2) return;
16
17 /*Add a line mask that keeps the area below the line*/
18 lv_draw_mask_line_param_t line_mask_param;
19 lv_draw_mask_line_points_init(&line_mask_param, dsc->p1->x, dsc->p1->y, dsc->p2->x, dsc->p2->y,
20 LV_DRAW_MASK_LINE_SIDE_BOTTOM);
21 int16_t line_mask_id = lv_draw_mask_add(&line_mask_param, NULL);
22
23 /*Add a fade effect: transparent bottom covering top*/
24 lv_coord_t h = lv_obj_get_height(obj);
25 lv_draw_mask_fade_param_t fade_mask_param;
26 lv_draw_mask_fade_init(&fade_mask_param, &obj->coords, LV_OPA_COVER, obj->coords.y1 + h / 8, LV_OPA_TRANSP,
27 obj->coords.y2);
28 int16_t fade_mask_id = lv_draw_mask_add(&fade_mask_param, NULL);
29
30 /*Draw a rectangle that will be affected by the mask*/
31 lv_draw_rect_dsc_t draw_rect_dsc;
32 lv_draw_rect_dsc_init(&draw_rect_dsc);
33 draw_rect_dsc.bg_opa = LV_OPA_20;
34 draw_rect_dsc.bg_color = dsc->line_dsc->color;
35
36 lv_area_t a;
37 a.x1 = dsc->p1->x;
38 a.x2 = dsc->p2->x - 1;
39 a.y1 = LV_MIN(dsc->p1->y, dsc->p2->y);
40 a.y2 = obj->coords.y2;
41 lv_draw_rect(dsc->draw_ctx, &draw_rect_dsc, &a);
42
43 /*Remove the masks*/
44 lv_draw_mask_free_param(&line_mask_param);
45 lv_draw_mask_free_param(&fade_mask_param);
46 lv_draw_mask_remove_id(line_mask_id);
47 lv_draw_mask_remove_id(fade_mask_id);
48 }
49 /*Hook the division lines too*/
50 else if(dsc->part == LV_PART_MAIN) {
51 if(dsc->line_dsc == NULL || dsc->p1 == NULL || dsc->p2 == NULL) return;
52
53 /*Vertical line*/
54 if(dsc->p1->x == dsc->p2->x) {
55 dsc->line_dsc->color = lv_palette_lighten(LV_PALETTE_GREY, 1);
56 if(dsc->id == 3) {
57 dsc->line_dsc->width = 2;
58 dsc->line_dsc->dash_gap = 0;
59 dsc->line_dsc->dash_width = 0;
60 }
61 else {
62 dsc->line_dsc->width = 1;
63 dsc->line_dsc->dash_gap = 6;
64 dsc->line_dsc->dash_width = 6;
65 }
66 }
67 /*Horizontal line*/
68 else {
69 if(dsc->id == 2) {
70 dsc->line_dsc->width = 2;
71 dsc->line_dsc->dash_gap = 0;
72 dsc->line_dsc->dash_width = 0;
73 }
74 else {
75 dsc->line_dsc->width = 2;
76 dsc->line_dsc->dash_gap = 6;
77 dsc->line_dsc->dash_width = 6;
78 }
79
80 if(dsc->id == 1 || dsc->id == 3) {
81 dsc->line_dsc->color = lv_palette_main(LV_PALETTE_GREEN);
82 }
83 else {
84 dsc->line_dsc->color = lv_palette_lighten(LV_PALETTE_GREY, 1);
85 }
86 }
87 }
88 }
89
add_data(lv_timer_t * timer)90 static void add_data(lv_timer_t * timer)
91 {
92 LV_UNUSED(timer);
93 static uint32_t cnt = 0;
94 lv_chart_set_next_value(chart1, ser1, lv_rand(20, 90));
95
96 if(cnt % 4 == 0) lv_chart_set_next_value(chart1, ser2, lv_rand(40, 60));
97
98 cnt++;
99 }
100
101 /**
102 * Add a faded area effect to the line chart and make some division lines ticker
103 */
lv_example_chart_2(void)104 void lv_example_chart_2(void)
105 {
106 /*Create a chart1*/
107 chart1 = lv_chart_create(lv_scr_act());
108 lv_obj_set_size(chart1, 200, 150);
109 lv_obj_center(chart1);
110 lv_chart_set_type(chart1, LV_CHART_TYPE_LINE); /*Show lines and points too*/
111
112 lv_chart_set_div_line_count(chart1, 5, 7);
113
114 lv_obj_add_event_cb(chart1, draw_event_cb, LV_EVENT_DRAW_PART_BEGIN, NULL);
115 lv_chart_set_update_mode(chart1, LV_CHART_UPDATE_MODE_CIRCULAR);
116
117 /*Add two data series*/
118 ser1 = lv_chart_add_series(chart1, lv_palette_main(LV_PALETTE_RED), LV_CHART_AXIS_PRIMARY_Y);
119 ser2 = lv_chart_add_series(chart1, lv_palette_main(LV_PALETTE_BLUE), LV_CHART_AXIS_SECONDARY_Y);
120
121 uint32_t i;
122 for(i = 0; i < 10; i++) {
123 lv_chart_set_next_value(chart1, ser1, lv_rand(20, 90));
124 lv_chart_set_next_value(chart1, ser2, lv_rand(30, 70));
125 }
126
127 lv_timer_create(add_data, 200, NULL);
128 }
129
130 #endif
131
