github-code/lvgl
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

arch(draw): add parallel rendering architecture

Browse Source 
BREAKING CHANGE

This is a huge update which introduces parallel rendering. lv_conf.h needs to be updated too.
This commit is contained in:
Gabor Kiss-Vamosi
2023-07-05 13:05:19 +02:00
parent 08870996d1
commit f753265a79
637 changed files with 34425 additions and 35325 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
examples/widgets/chart/lv_example_chart_2.c
View File

@@ -1,5 +1,6 @@
#include "../../lv_examples.h"
#if LV_USE_CHART && LV_USE_DRAW_MASKS && LV_BUILD_EXAMPLES
//TODO should be a chart feature
#if LV_USE_CHART && LV_USE_DRAW_MASKS && LV_BUILD_EXAMPLES && 0
static lv_obj_t * chart1;
static lv_chart_series_t * ser1;
@@ -10,10 +11,9 @@ static void draw_event_cb(lv_event_t * e)
lv_obj_t * obj = lv_event_get_target(e);
/*Add the faded area before the lines are drawn*/
lv_obj_draw_part_dsc_t * dsc = lv_event_get_draw_part_dsc(e);
if(dsc->part == LV_PART_ITEMS) {
if(!dsc->p1 || !dsc->p2) return;
lv_draw_task_t * draw_task = lv_event_get_draw_task(e);
lv_draw_dsc_base_t * base_dsc = draw_task->draw_dsc;
if(base_dsc->part == LV_PART_ITEMS) {
/*Add a line mask that keeps the area below the line*/
lv_draw_mask_line_param_t line_mask_param;
lv_draw_mask_line_points_init(&line_mask_param, dsc->p1->x, dsc->p1->y, dsc->p2->x, dsc->p2->y,
@@ -38,7 +38,7 @@ static void draw_event_cb(lv_event_t * e)
a.x2 = dsc->p2->x - 1;
a.y1 = LV_MIN(dsc->p1->y, dsc->p2->y);
a.y2 = obj->coords.y2;
lv_draw_rect(dsc->draw_ctx, &draw_rect_dsc, &a);
lv_draw_rect(dsc->layer, &draw_rect_dsc, &a);
/*Remove the masks*/
lv_draw_mask_free_param(&line_mask_param);
@@ -111,9 +111,10 @@ void lv_example_chart_2(void)
lv_chart_set_div_line_count(chart1, 5, 7);
lv_obj_add_event(chart1, draw_event_cb, LV_EVENT_DRAW_PART_BEGIN, NULL);
lv_chart_set_update_mode(chart1, LV_CHART_UPDATE_MODE_CIRCULAR);
lv_obj_add_event(chart1, draw_event_cb, LV_EVENT_DRAW_TASK_ADDED, NULL);
lv_obj_add_flag(chart1, LV_OBJ_FLAG_SEND_DRAW_TASK_EVENTS);
lv_chart_set_update_mode(chart1, LV_CHART_UPDATE_MODE_CIRCULAR);
/*Add two data series*/
ser1 = lv_chart_add_series(chart1, lv_palette_main(LV_PALETTE_RED), LV_CHART_AXIS_PRIMARY_Y);
ser2 = lv_chart_add_series(chart1, lv_palette_main(LV_PALETTE_BLUE), LV_CHART_AXIS_SECONDARY_Y);

113
examples/widgets/chart/lv_example_chart_2.py
View File

@@ -1,112 +1 @@
def draw_event_cb(e):
obj = e.get_target_obj()
# Add the faded area before the lines are drawn
# dsc = lv.obj_draw_part_dsc_t.__cast__(e.get_param())
dsc = e.get_draw_part_dsc()
if dsc.part == lv.PART.ITEMS:
if not dsc.p1 or not dsc.p2:
return
# Add a line mask that keeps the area below the line
line_mask_param = lv.draw_mask_line_param_t()
line_mask_param.points_init(dsc.p1.x, dsc.p1.y, dsc.p2.x, dsc.p2.y, lv.DRAW_MASK_LINE_SIDE.BOTTOM)
# line_mask_id = line_mask_param.draw_mask_add(None)
line_mask_id = lv.draw_mask_add(line_mask_param, None)
# Add a fade effect: transparent bottom covering top
h = obj.get_height()
fade_mask_param = lv.draw_mask_fade_param_t()
coords = lv.area_t()
obj.get_coords(coords)
fade_mask_param.init(coords, lv.OPA.COVER, coords.y1 + h // 8, lv.OPA.TRANSP,coords.y2)
fade_mask_id = lv.draw_mask_add(fade_mask_param,None)
# Draw a rectangle that will be affected by the mask
draw_rect_dsc = lv.draw_rect_dsc_t()
draw_rect_dsc.init()
draw_rect_dsc.bg_opa = lv.OPA._20
draw_rect_dsc.bg_color = dsc.line_dsc.color
a = lv.area_t()
a.x1 = dsc.p1.x
a.x2 = dsc.p2.x - 1
a.y1 = min(dsc.p1.y, dsc.p2.y)
coords = lv.area_t()
obj.get_coords(coords)
a.y2 = coords.y2
dsc.draw_ctx.rect(draw_rect_dsc, a)
# Remove the masks
lv.draw_mask_free_param(line_mask_param);
lv.draw_mask_free_param(fade_mask_param);
lv.draw_mask_remove_id(line_mask_id)
lv.draw_mask_remove_id(fade_mask_id)
# Hook the division lines too
elif dsc.part == lv.PART.MAIN:
if dsc.line_dsc == None or dsc.p1 == None or dsc.p2 == None:
return
# Vertical line
if dsc.p1.x == dsc.p2.x:
dsc.line_dsc.color = lv.palette_lighten(lv.PALETTE.GREY, 1)
if dsc.id == 3:
dsc.line_dsc.width = 2
dsc.line_dsc.dash_gap = 0
dsc.line_dsc.dash_width = 0
else :
dsc.line_dsc.width = 1
dsc.line_dsc.dash_gap = 6
dsc.line_dsc.dash_width = 6
# Horizontal line
else :
if dsc.id == 2:
dsc.line_dsc.width = 2
dsc.line_dsc.dash_gap = 0
dsc.line_dsc.dash_width = 0
else :
dsc.line_dsc.width = 2
dsc.line_dsc.dash_gap = 6
dsc.line_dsc.dash_width = 6
if dsc.id == 1 or dsc.id == 3 :
dsc.line_dsc.color = lv.palette_main(lv.PALETTE.GREEN)
else :
dsc.line_dsc.color = lv.palette_lighten(lv.PALETTE.GREY, 1)
def add_data(timer):
# LV_UNUSED(timer);
cnt = 0
chart1.set_next_value(ser1, lv.rand(20, 90))
if cnt % 4 == 0:
chart1.set_next_value(ser2, lv.rand(40, 60))
cnt +=1
#
# Add a faded area effect to the line chart
#
# Create a chart1
chart1 = lv.chart(lv.scr_act())
chart1.set_size(200, 150)
chart1.center()
chart1.set_type(lv.chart.TYPE.LINE) # Show lines and points too
chart1.set_div_line_count(5, 7)
chart1.add_event(draw_event_cb, lv.EVENT.DRAW_PART_BEGIN, None)
chart1.set_update_mode(lv.chart.UPDATE_MODE.CIRCULAR)
# Add two data series
ser1 = chart1.add_series(lv.palette_main(lv.PALETTE.RED), lv.chart.AXIS.PRIMARY_Y)
ser2 = chart1.add_series(lv.palette_main(lv.PALETTE.BLUE), lv.chart.AXIS.SECONDARY_Y)
for i in range(10):
chart1.set_next_value(ser1, lv.rand(20, 90))
chart1.set_next_value(ser2, lv.rand(30, 70))
timer = lv.timer_create(add_data, 200, None)
pass

3
examples/widgets/chart/lv_example_chart_3.c
View File

@@ -1,5 +1,6 @@
#include "../../lv_examples.h"
#if LV_USE_CHART && LV_BUILD_EXAMPLES
//TODO when lv_scale is ready
#if LV_USE_CHART && LV_BUILD_EXAMPLES && 0
static void draw_event_cb(lv_event_t * e)
{

53
examples/widgets/chart/lv_example_chart_3.py
View File

@@ -1,52 +1 @@
def draw_event_cb(e):
dsc = lv.obj_draw_part_dsc_t.__cast__(e.get_param())
if dsc.part == lv.PART.TICKS and dsc.id == lv.chart.AXIS.PRIMARY_X:
month = ["Jan", "Febr", "March", "Apr", "May", "Jun", "July", "Aug", "Sept", "Oct", "Nov", "Dec"]
# dsc.text is defined char text[16], I must therefore convert the Python string to a byte_array
dsc.text = bytes(month[dsc.value],"ascii")
#
# Add ticks and labels to the axis and demonstrate scrolling
#
# Create a chart
chart = lv.chart(lv.scr_act())
chart.set_size(200, 150)
chart.center()
chart.set_type(lv.chart.TYPE.BAR)
chart.set_range(lv.chart.AXIS.PRIMARY_Y, 0, 100)
chart.set_range(lv.chart.AXIS.SECONDARY_Y, 0, 400)
chart.set_point_count(12)
chart.add_event(draw_event_cb, lv.EVENT.DRAW_PART_BEGIN, None)
# Add ticks and label to every axis
chart.set_axis_tick(lv.chart.AXIS.PRIMARY_X, 10, 5, 12, 3, True, 40)
chart.set_axis_tick(lv.chart.AXIS.PRIMARY_Y, 10, 5, 6, 2, True, 50)
chart.set_axis_tick(lv.chart.AXIS.SECONDARY_Y, 10, 5, 3, 4,True, 50)
# Zoom in a little in X
chart.set_zoom_x(800)
# Add two data series
ser1 = lv.chart.add_series(chart, lv.palette_lighten(lv.PALETTE.GREEN, 2), lv.chart.AXIS.PRIMARY_Y)
ser2 = lv.chart.add_series(chart, lv.palette_darken(lv.PALETTE.GREEN, 2), lv.chart.AXIS.SECONDARY_Y)
# Set the next points on 'ser1'
chart.set_next_value(ser1, 31)
chart.set_next_value(ser1, 66)
chart.set_next_value(ser1, 10)
chart.set_next_value(ser1, 89)
chart.set_next_value(ser1, 63)
chart.set_next_value(ser1, 56)
chart.set_next_value(ser1, 32)
chart.set_next_value(ser1, 35)
chart.set_next_value(ser1, 57)
chart.set_next_value(ser1, 85)
chart.set_next_value(ser1, 22)
chart.set_next_value(ser1, 58)
# Directly set points on 'ser2'
ser2.y_points = [92,71,61,15,21,35,35,58,31,53,33,73]
chart.refresh() # Required after direct set
pass

4
examples/widgets/chart/lv_example_chart_4.c
View File

@@ -45,8 +45,8 @@ static void event_cb(lv_event_t * e)
a.y1 = chart->coords.y1 + p.y - 30;
a.y2 = chart->coords.y1 + p.y - 10;
lv_draw_ctx_t * draw_ctx = lv_event_get_draw_ctx(e);
lv_draw_rect(draw_ctx, &draw_rect_dsc, &a);
lv_layer_t * layer = lv_event_get_layer(e);
lv_draw_rect(layer, &draw_rect_dsc, &a);
ser = lv_chart_get_series_next(chart, ser);
}

48
examples/widgets/chart/lv_example_chart_6.c
View File

@@ -5,52 +5,14 @@ static lv_obj_t * chart;
static lv_chart_series_t * ser;
static lv_chart_cursor_t * cursor;
static void event_cb(lv_event_t * e)
static void value_changed_event_cb(lv_event_t * e)
{
static int32_t last_id = -1;
lv_event_code_t code = lv_event_get_code(e);
lv_obj_t * obj = lv_event_get_target(e);
if(code == LV_EVENT_VALUE_CHANGED) {
last_id = lv_chart_get_pressed_point(obj);
if(last_id != LV_CHART_POINT_NONE) {
lv_chart_set_cursor_point(obj, cursor, NULL, last_id);
}
}
else if(code == LV_EVENT_DRAW_PART_END) {
lv_obj_draw_part_dsc_t * dsc = lv_event_get_draw_part_dsc(e);
if(!lv_obj_draw_part_check_type(dsc, &lv_chart_class, LV_CHART_DRAW_PART_CURSOR)) return;
if(dsc->p1 == NULL || dsc->p2 == NULL || dsc->p1->y != dsc->p2->y || last_id < 0) return;
lv_coord_t * data_array = lv_chart_get_y_array(chart, ser);
lv_coord_t v = data_array[last_id];
char buf[16];
lv_snprintf(buf, sizeof(buf), "%d", v);
lv_point_t size;
lv_txt_get_size(&size, buf, LV_FONT_DEFAULT, 0, 0, LV_COORD_MAX, LV_TEXT_FLAG_NONE);
lv_area_t a;
a.y2 = dsc->p1->y - 5;
a.y1 = a.y2 - size.y - 10;
a.x1 = dsc->p1->x + 10;
a.x2 = a.x1 + size.x + 10;
lv_draw_rect_dsc_t draw_rect_dsc;
lv_draw_rect_dsc_init(&draw_rect_dsc);
draw_rect_dsc.bg_color = lv_palette_main(LV_PALETTE_BLUE);
draw_rect_dsc.radius = 3;
lv_draw_rect(dsc->draw_ctx, &draw_rect_dsc, &a);
lv_draw_label_dsc_t draw_label_dsc;
lv_draw_label_dsc_init(&draw_label_dsc);
draw_label_dsc.color = lv_color_white();
a.x1 += 5;
a.x2 -= 5;
a.y1 += 5;
a.y2 -= 5;
lv_draw_label(dsc->draw_ctx, &draw_label_dsc, &a, buf, NULL);
last_id = lv_chart_get_pressed_point(obj);
if(last_id != LV_CHART_POINT_NONE) {
lv_chart_set_cursor_point(obj, cursor, NULL, last_id);
}
}
@@ -66,7 +28,7 @@ void lv_example_chart_6(void)
lv_chart_set_axis_tick(chart, LV_CHART_AXIS_PRIMARY_Y, 10, 5, 6, 5, true, 40);
lv_chart_set_axis_tick(chart, LV_CHART_AXIS_PRIMARY_X, 10, 5, 10, 1, true, 30);
lv_obj_add_event(chart, event_cb, LV_EVENT_ALL, NULL);
lv_obj_add_event(chart, value_changed_event_cb, LV_EVENT_VALUE_CHANGED, NULL);
lv_obj_refresh_ext_draw_size(chart);
cursor = lv_chart_add_cursor(chart, lv_palette_main(LV_PALETTE_BLUE), LV_DIR_LEFT | LV_DIR_BOTTOM);

88
examples/widgets/chart/lv_example_chart_6.py
View File

@@ -1,87 +1 @@
class ExampleChart_6():
def __init__(self):
self.last_id = -1
#
# Show cursor on the clicked point
#
chart = lv.chart(lv.scr_act())
chart.set_size(200, 150)
chart.align(lv.ALIGN.CENTER, 0, -10)
chart.set_axis_tick(lv.chart.AXIS.PRIMARY_Y, 10, 5, 6, 5, True, 40)
chart.set_axis_tick(lv.chart.AXIS.PRIMARY_X, 10, 5, 10, 1, True, 30)
chart.add_event(self.event_cb, lv.EVENT.ALL, None)
chart.refresh_ext_draw_size()
self.cursor = chart.add_cursor(lv.palette_main(lv.PALETTE.BLUE), lv.DIR.LEFT | lv.DIR.BOTTOM)
self.ser = chart.add_series(lv.palette_main(lv.PALETTE.RED), lv.chart.AXIS.PRIMARY_Y)
self.ser_p = []
for i in range(10):
self.ser_p.append(lv.rand(10,90))
self.ser.y_points = self.ser_p
newser = chart.get_series_next(None)
# print("length of data points: ",len(newser.points))
chart.set_zoom_x(500)
label = lv.label(lv.scr_act())
label.set_text("Click on a point")
label.align_to(chart, lv.ALIGN.OUT_TOP_MID, 0, -5)
def event_cb(self,e):
code = e.get_code()
chart = e.get_target_obj()
if code == lv.EVENT.VALUE_CHANGED:
# print("last_id: ",self.last_id)
self.last_id = chart.get_pressed_point()
if self.last_id != lv.CHART_POINT_NONE:
p = lv.point_t()
chart.get_point_pos_by_id(self.ser, self.last_id, p)
chart.set_cursor_point(self.cursor, None, self.last_id)
elif code == lv.EVENT.DRAW_PART_END:
# print("EVENT.DRAW_PART_END")
dsc = lv.obj_draw_part_dsc_t.__cast__(e.get_param())
# if dsc.p1 and dsc.p2:
# print("p1, p2", dsc.p1,dsc.p2)
# print("p1.y, p2.y", dsc.p1.y, dsc.p2.y)
# print("last_id: ",self.last_id)
if dsc.part == lv.PART.CURSOR and dsc.p1 and dsc.p2 and dsc.p1.y == dsc.p2.y and self.last_id >= 0:
v = self.ser_p[self.last_id]
# print("value: ",v)
value_txt = str(v)
size = lv.point_t()
lv.txt_get_size(size, value_txt, lv.font_default(), 0, 0, lv.COORD.MAX, lv.TEXT_FLAG.NONE)
a = lv.area_t()
a.y2 = dsc.p1.y - 5
a.y1 = a.y2 - size.y - 10
a.x1 = dsc.p1.x + 10
a.x2 = a.x1 + size.x + 10
draw_rect_dsc = lv.draw_rect_dsc_t()
draw_rect_dsc.init()
draw_rect_dsc.bg_color = lv.palette_main(lv.PALETTE.BLUE)
draw_rect_dsc.radius = 3
dsc.draw_ctx.rect(draw_rect_dsc,a)
draw_label_dsc = lv.draw_label_dsc_t()
draw_label_dsc.init()
draw_label_dsc.color = lv.color_white()
a.x1 += 5
a.x2 -= 5
a.y1 += 5
a.y2 -= 5
dsc.draw_ctx.label(draw_label_dsc,a,value_txt,None)
example_chart_6 = ExampleChart_6()
pass

16
examples/widgets/chart/lv_example_chart_7.c
View File

@@ -3,24 +3,27 @@
static void draw_event_cb(lv_event_t * e)
{
lv_obj_draw_part_dsc_t * dsc = lv_event_get_draw_part_dsc(e);
if(dsc->part == LV_PART_ITEMS) {
lv_draw_task_t * draw_task = lv_event_get_draw_task(e);
lv_draw_dsc_base_t * base_dsc = draw_task->draw_dsc;
if(base_dsc->part == LV_PART_INDICATOR) {
lv_obj_t * obj = lv_event_get_target(e);
lv_chart_series_t * ser = lv_chart_get_series_next(obj, NULL);
lv_draw_rect_dsc_t * rect_draw_dsc = draw_task->draw_dsc;
uint32_t cnt = lv_chart_get_point_count(obj);
/*Make older value more transparent*/
dsc->rect_dsc->bg_opa = (LV_OPA_COVER * dsc->id) / (cnt - 1);
rect_draw_dsc->bg_opa = (LV_OPA_COVER * base_dsc->id2) / (cnt - 1);
/*Make smaller values blue, higher values red*/
lv_coord_t * x_array = lv_chart_get_x_array(obj, ser);
lv_coord_t * y_array = lv_chart_get_y_array(obj, ser);
/*dsc->id is the tells drawing order, but we need the ID of the point being drawn.*/
uint32_t start_point = lv_chart_get_x_start_point(obj, ser);
uint32_t p_act = (start_point + dsc->id) % cnt; /*Consider start point to get the index of the array*/
uint32_t p_act = (start_point + base_dsc->id2) % cnt; /*Consider start point to get the index of the array*/
lv_opa_t x_opa = (x_array[p_act] * LV_OPA_50) / 200;
lv_opa_t y_opa = (y_array[p_act] * LV_OPA_50) / 1000;
dsc->rect_dsc->bg_color = lv_color_mix(lv_palette_main(LV_PALETTE_RED),
rect_draw_dsc->bg_color = lv_color_mix(lv_palette_main(LV_PALETTE_RED),
lv_palette_main(LV_PALETTE_BLUE),
x_opa + y_opa);
}
@@ -41,7 +44,8 @@ void lv_example_chart_7(void)
lv_obj_t * chart = lv_chart_create(lv_scr_act());
lv_obj_set_size(chart, 200, 150);
lv_obj_align(chart, LV_ALIGN_CENTER, 0, 0);
lv_obj_add_event(chart, draw_event_cb, LV_EVENT_DRAW_PART_BEGIN, NULL);
lv_obj_add_event(chart, draw_event_cb, LV_EVENT_DRAW_TASK_ADDED, NULL);
lv_obj_add_flag(chart, LV_OBJ_FLAG_SEND_DRAW_TASK_EVENTS);
lv_obj_set_style_line_width(chart, 0, LV_PART_ITEMS); /*Remove the lines*/
lv_chart_set_type(chart, LV_CHART_TYPE_SCATTER);

77
examples/widgets/chart/lv_example_chart_7.py
View File

@@ -1,76 +1 @@
#!/opt/bin/lv_micropython -i
import utime as time
import lvgl as lv
def draw_event_cb(e):
dsc = e.get_draw_part_dsc()
if dsc.part == lv.PART.ITEMS:
obj = e.get_target_obj()
ser = obj.get_series_next(None)
cnt = obj.get_point_count()
# print("cnt: ",cnt)
# Make older value more transparent
dsc.rect_dsc.bg_opa = (lv.OPA.COVER * dsc.id) // (cnt - 1)
# Make smaller values blue, higher values red
# x_array = chart.get_x_array(ser)
# y_array = chart.get_y_array(ser)
# dsc->id is the tells drawing order, but we need the ID of the point being drawn.
start_point = chart.get_x_start_point(ser)
# print("start point: ",start_point)
p_act = (start_point + dsc.id) % cnt # Consider start point to get the index of the array
# print("p_act", p_act)
x_opa = (x_array[p_act] * lv.OPA._50) // 200
y_opa = (y_array[p_act] * lv.OPA._50) // 1000
dsc.rect_dsc.bg_color = lv.palette_main(lv.PALETTE.RED).color_mix(
lv.palette_main(lv.PALETTE.BLUE),
x_opa + y_opa)
def add_data(timer,chart):
# print("add_data")
x = lv.rand(0,200)
y = lv.rand(0,1000)
chart.set_next_value2(ser, x, y)
# chart.set_next_value2(chart.gx, y)
x_array.pop(0)
x_array.append(x)
y_array.pop(0)
y_array.append(y)
#
# A scatter chart
#
chart = lv.chart(lv.scr_act())
chart.set_size(200, 150)
chart.align(lv.ALIGN.CENTER, 0, 0)
chart.add_event(draw_event_cb, lv.EVENT.DRAW_PART_BEGIN, None)
chart.set_style_line_width(0, lv.PART.ITEMS) # Remove the lines
chart.set_type(lv.chart.TYPE.SCATTER)
chart.set_axis_tick(lv.chart.AXIS.PRIMARY_X, 5, 5, 5, 1, True, 30)
chart.set_axis_tick(lv.chart.AXIS.PRIMARY_Y, 10, 5, 6, 5, True, 50)
chart.set_range(lv.chart.AXIS.PRIMARY_X, 0, 200)
chart.set_range(lv.chart.AXIS.PRIMARY_Y, 0, 1000)
chart.set_point_count(50)
ser = chart.add_series(lv.palette_main(lv.PALETTE.RED), lv.chart.AXIS.PRIMARY_Y)
x_array = []
y_array = []
for i in range(50):
x_array.append(lv.rand(0, 200))
y_array.append(lv.rand(0, 1000))
ser.x_points = x_array
ser.y_points = y_array
# Create an `lv_timer` to update the chart.
timer = lv.timer_create_basic()
timer.set_period(100)
timer.set_cb(lambda src: add_data(timer,chart))
pass

5
examples/widgets/chart/lv_example_chart_8.c
View File

@@ -1,5 +1,6 @@
#include "../../lv_examples.h"
#if LV_USE_CHART && LV_USE_DRAW_MASKS && LV_BUILD_EXAMPLES
//TODO Should be a chart feature
#if LV_USE_CHART && LV_USE_DRAW_MASKS && LV_BUILD_EXAMPLES && 0
/* A struct is used to keep track of the series list because later we need to draw to the series in the reverse order to which they were initialised. */
typedef struct {
@@ -40,7 +41,7 @@ static void draw_event_cb(lv_event_t * e)
a.y1 = LV_MIN(dsc->p1->y, dsc->p2->y);
a.y2 = obj->coords.y2 -
13; /* -13 cuts off where the rectangle draws over the chart margin. Without this an area of 0 doesn't look like 0 */
lv_draw_rect(dsc->draw_ctx, &draw_rect_dsc, &a);
lv_draw_rect(dsc->layer, &draw_rect_dsc, &a);
/*Remove the mask*/
lv_draw_mask_free_param(&line_mask_param);

124
examples/widgets/chart/lv_example_chart_8.py
View File

@@ -1,123 +1 @@
import lvgl as lv
# A class is used to keep track of the series list because later we
# need to draw to the series in the reverse order to which they were initialised.
class StackedAreaChart:
def __init__(self):
self.obj = None
self.series_list = [None, None, None]
stacked_area_chart = StackedAreaChart()
#
# Callback which draws the blocks of colour under the lines
#
def draw_event_cb(e):
obj = e.get_target_obj()
cont_a = lv.area_t()
obj.get_coords(cont_a)
#Add the faded area before the lines are drawn
dsc = e.get_draw_part_dsc()
if dsc.part == lv.PART.ITEMS:
if not dsc.p1 or not dsc.p2:
return
# Add a line mask that keeps the area below the line
line_mask_param = lv.draw_mask_line_param_t()
line_mask_param.points_init(dsc.p1.x, dsc.p1.y, dsc.p2.x, dsc.p2.y, lv.DRAW_MASK_LINE_SIDE.BOTTOM)
line_mask_id = lv.draw_mask_add(line_mask_param, None)
#Draw a rectangle that will be affected by the mask
draw_rect_dsc = lv.draw_rect_dsc_t()
draw_rect_dsc.init()
draw_rect_dsc.bg_opa = lv.OPA.COVER
draw_rect_dsc.bg_color = dsc.line_dsc.color
a = lv.area_t()
a.x1 = dsc.p1.x
a.x2 = dsc.p2.x
a.y1 = min(dsc.p1.y, dsc.p2.y)
a.y2 = cont_a.y2 - 13 # -13 cuts off where the rectangle draws over the chart margin. Without this an area of 0 doesn't look like 0
dsc.draw_ctx.rect(draw_rect_dsc, a)
# Remove the mask
lv.draw_mask_free_param(line_mask_param)
lv.draw_mask_remove_id(line_mask_id)
#
# Helper function to round a fixed point number
#
def round_fixed_point(n, shift):
# Create a bitmask to isolates the decimal part of the fixed point number
mask = 1
for bit_pos in range(shift):
mask = (mask << 1) + 1
decimal_part = n & mask
# Get 0.5 as fixed point
rounding_boundary = 1 << (shift - 1)
# Return either the integer part of n or the integer part + 1
if decimal_part < rounding_boundary:
return (n & ~mask)
return ((n >> shift) + 1) << shift
#
# Stacked area chart
#
def lv_example_chart_8():
#Create a stacked_area_chart.obj
stacked_area_chart.obj = lv.chart(lv.scr_act())
stacked_area_chart.obj.set_size(200, 150)
stacked_area_chart.obj.center()
stacked_area_chart.obj.set_type( lv.chart.TYPE.LINE)
stacked_area_chart.obj.set_div_line_count(5, 7)
stacked_area_chart.obj.add_event( draw_event_cb, lv.EVENT.DRAW_PART_BEGIN, None)
# Set range to 0 to 100 for percentages. Draw ticks
stacked_area_chart.obj.set_range(lv.chart.AXIS.PRIMARY_Y,0,100)
stacked_area_chart.obj.set_axis_tick(lv.chart.AXIS.PRIMARY_Y, 3, 0, 5, 1, True, 30)
#Set point size to 0 so the lines are smooth
stacked_area_chart.obj.set_style_size(0, 0, lv.PART.INDICATOR)
# Add some data series
stacked_area_chart.series_list[0] = stacked_area_chart.obj.add_series(lv.palette_main(lv.PALETTE.RED), lv.chart.AXIS.PRIMARY_Y)
stacked_area_chart.series_list[1] = stacked_area_chart.obj.add_series(lv.palette_main(lv.PALETTE.BLUE), lv.chart.AXIS.PRIMARY_Y)
stacked_area_chart.series_list[2] = stacked_area_chart.obj.add_series(lv.palette_main(lv.PALETTE.GREEN), lv.chart.AXIS.PRIMARY_Y)
for point in range(10):
# Make some random data
vals = [lv.rand(10, 20), lv.rand(20, 30), lv.rand(20, 30)]
fixed_point_shift = 5
total = vals[0] + vals[1] + vals[2]
draw_heights = [0, 0, 0]
int_sum = 0
decimal_sum = 0
# Fixed point cascade rounding ensures percentages add to 100
for series_index in range(3):
decimal_sum += int(((vals[series_index] * 100) << fixed_point_shift) // total)
int_sum += int((vals[series_index] * 100) / total)
modifier = (round_fixed_point(decimal_sum, fixed_point_shift) >> fixed_point_shift) - int_sum
# The draw heights are equal to the percentage of the total each value is + the cumulative sum of the previous percentages.
# The accumulation is how the values get "stacked"
draw_heights[series_index] = int(int_sum + modifier)
# Draw to the series in the reverse order to which they were initialised.
# Without this the higher values will draw on top of the lower ones.
# This is because the Z-height of a series matches the order it was initialised
stacked_area_chart.obj.set_next_value( stacked_area_chart.series_list[3 - series_index - 1], draw_heights[series_index])
stacked_area_chart.obj.refresh()
lv_example_chart_8()
pass