事件回调函数
static void event_cb(lv_event_t* e)
{
lv_event_code_t code = lv_event_get_code(e); //获取产生事件对象的事件码
lv_obj_t* chart = lv_event_get_target(e); //获取产生事件的对象
if (code == LV_EVENT_VALUE_CHANGED) { //值已改变事件
lv_obj_invalidate(chart); // 刷新CHART显示
}
if (code == LV_EVENT_REFR_EXT_DRAW_SIZE) { //LV_EVENT_REFR_EXT_DRAW_SIZE事件
lv_coord_t* s = lv_event_get_param(e); // 获取事件对象的size数据
*s = LV_MAX(*s, 20); //得到最大值,且最大值限制在20以上
}
else if (code == LV_EVENT_DRAW_POST_END) { // LV_EVENT_DRAW_POST_END事件
int32_t id = lv_chart_get_pressed_point(chart); // 获取CHART上被点击的点ID
if (id == LV_CHART_POINT_NONE) return; // 不是CHART上的点,则不处理,直接返回
LV_LOG_USER("Selected point %d", (int)id); //打印点ID值
lv_chart_series_t* ser = lv_chart_get_series_next(chart, NULL); // 获取第一条ser线
while (ser) {
lv_point_t p;
lv_chart_get_point_pos_by_id(chart, ser, id, &p); // 通过CHART的点ID获取其在CHART上的位置值并保存在p中
lv_coord_t* y_array = lv_chart_get_y_array(chart, ser); // 获取CHART的ser对应点值的数组集合
lv_coord_t value = y_array[id]; //获取ID对应的ser的点数值
char buf[16];
lv_snprintf(buf, sizeof(buf), LV_SYMBOL_DUMMY"$%d", value); //ser的点值转成字串到buf
lv_draw_rect_dsc_t draw_rect_dsc;
lv_draw_rect_dsc_init(&draw_rect_dsc);
draw_rect_dsc.bg_color = lv_color_black(); /黑色背景
draw_rect_dsc.bg_opa = LV_OPA_50; // 50%透明度
draw_rect_dsc.radius = 3; // 圆角半径为3
draw_rect_dsc.bg_img_src = buf; // 显示数据指向buf
draw_rect_dsc.bg_img_recolor = lv_color_white(); //重新着色为白色
lv_area_t a;
a.x1 = chart->coords.x1 + p.x - 20;
a.x2 = chart->coords.x1 + p.x + 20;
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); //绘制点数值到a矩形区
ser = lv_chart_get_series_next(chart, ser); //获取下一条ser线
}
}
else if (code == LV_EVENT_RELEASED) { //点击松手事件
lv_obj_invalidate(chart); // 刷新CHART显示
}
}
创建CHART
/**
* Show the value of the pressed points
*/
static void lv_example_chart_4(void)
{
/*Create a chart*/
lv_obj_t* chart;
chart = lv_chart_create(lv_scr_act()); // 创建CHART对象
lv_obj_set_size(chart, 200, 150); //设置大小
lv_obj_center(chart); // 居中显示
lv_obj_add_event_cb(chart, event_cb, LV_EVENT_ALL, NULL); //添加所有事件
lv_obj_refresh_ext_draw_size(chart); // 调用该对象的祖先事件处理程序来刷新扩展绘制大小的值
/*Zoom in a little in X*/
lv_chart_set_zoom_x(chart, 800); //X方向放大CHART到800
/*Add two data series*/
lv_chart_series_t* ser1 = lv_chart_add_series(chart, lv_palette_main(LV_PALETTE_RED), LV_CHART_AXIS_PRIMARY_Y); //创建第一条ser线
lv_chart_series_t* ser2 = lv_chart_add_series(chart, lv_palette_main(LV_PALETTE_GREEN), LV_CHART_AXIS_PRIMARY_Y); //创建第二第ser线
uint32_t i;
for (i = 0; i
关注
打赏
最近更新
- 深拷贝和浅拷贝的区别(重点)
- 【Vue】走进Vue框架世界
- 【云服务器】项目部署—搭建网站—vue电商后台管理系统
- 【React介绍】 一文带你深入React
- 【React】React组件实例的三大属性之state,props,refs(你学废了吗)
- 【脚手架VueCLI】从零开始,创建一个VUE项目
- 【React】深入理解React组件生命周期----图文详解(含代码)
- 【React】DOM的Diffing算法是什么?以及DOM中key的作用----经典面试题
- 【React】1_使用React脚手架创建项目步骤--------详解(含项目结构说明)
- 【React】2_如何使用react脚手架写一个简单的页面?