LVGL学习笔记及使用案例

置顶嵌入式DZC

已于 2025-02-25 16:54:58 修改

阅读量1.3k

点赞数 13

分类专栏： LVGL_N32 文章标签：学习笔记

于 2024-05-12 21:55:56 首次发布

本文链接：https://blog.youkuaiyun.com/daizhichaoaa/article/details/138768712

版权

LVGL_N32 专栏收录该内容

2 篇文章

订阅专栏

V8版本配置特点等lv_conf.h：

1.频率>16Mhz 指的是CPU的主频要够大

2.Flash/ROM >64 kb,建议180kb以上指的是CPU的

3.RAM >8kb,建议24kb以上刷新效果越好

4.图形缓冲区（RAM上） > 水平分辨率像素，建议大于1/10屏幕总像素（800*480*字节数）越大刷新的越快，比如800*480是需要存放到缓冲数组中 > 800*1 如果是8位就是1个字节，16（565）位色彩就是2

#define MY_DISP_HOR_RES 480
#define MY_DISP_VER_RES 272
#define DISP_ROWS 110

5.C99或更新编译器

6.减少屏幕刷新率：通过调整 LV_DISP_DEF_REFR_PERIOD 来降低屏幕的刷新频率，减少处理器的负担

7.优化显示缓冲区：调整显示缓冲区的大小 (LV_DISP_BUF_SIZE)，使其既能满足流畅渲染的需要，又不会过度占用 CPU 资源

优化LVGL运行效果方法：

1.提高主频

2.增大SRAM,提高读写速度

3.增加图形缓冲区，使用双缓冲

static lv_color_t buf_2_1[MY_DISP_HOR_RES * DISP_ROWS];
static lv_color_t buf_2_2[MY_DISP_HOR_RES * DISP_ROWS];

4.减小需要刷新的总像素，缩短图像刷新时间 LV_DISP_DEF_REFR_PERIOD

5.提高图像数据传输速度（使用DMA2D）

如果屏幕出现字符错位，卡屏，花屏等问题也可以考虑修改lcd的配置文件

通过FSMC，控制器可以通过并行的方式快速访问外部设备的内存，

lcd_timing_init_struct.asyn_data_setuptime = 100;//5; 增加这个时间

数据和地址建立时间 (asyn_data_setuptime, asyn_address_setuptime): 这些参数定义了在读/写操作中，数据和地址线需要稳定多久才能被外设正确读取。如果这些时间设置得太短，外设可能无法在数据被锁定前正确地读取数据，导致数据错误。
同步访问时钟分频系数 (syn_clk_division): 这个参数影响数据传输的速率。如果时钟分频设置不当，可能会导致数据传输速度过快或过慢，外设无法在预期的时间内完成数据读写

获取源码：

文件目录

裁剪需要保留的主要文件：

demo、example（porting）、src、lv_conf_template.h、lvgl.h

如何移植LVGL可以参考其他文章：

LVGL移植stm8.3超详细【stm32移植lvgl】_stm32f429 lvgl 8.3.5-优快云博客

分布内存情况

LVGL主要三大类

1.放置图标 screen

2.图标与按键对应 GROUP

3.按键带来的响应 event 回调事件

	KeyPadEdit = 1;
    lv_group_remove_all_objs(key_Group);
    lv_group_add_obj(key_Group, win_encode.dp[0]);
    lv_group_add_obj(key_Group, win_encode.dp[1]);
    lv_group_add_obj(key_Group, win_encode.btn);
    for(uint8_t i = 0; i < CHECKBOX_NUM; i++)
    {
        lv_group_add_obj(key_Group, win_encode.checkbox[i]);
        lv_obj_add_event_cb(win_encode.checkbox[i],checkbox_event_cb,LV_EVENT_VALUE_CHANGED,NULL);//复选框部件
        lv_obj_add_event_cb(win_encode.checkbox[i], esc_event_handler, LV_EVENT_KEY, NULL);//返回
    }
    lv_obj_add_event_cb(win_encode.btn, btn_event_cb, LV_EVENT_CLICKED, NULL);//编码按钮
    lv_obj_add_event_cb(win_encode.dp[0], dp1_event_cb, LV_EVENT_VALUE_CHANGED, NULL);//下拉部件
    lv_obj_add_event_cb(win_encode.dp[1], dp2_event_cb, LV_EVENT_VALUE_CHANGED, NULL);//下拉部件
    lv_obj_add_event_cb(win_encode.dp[0], esc_event_handler, LV_EVENT_KEY, NULL);//返回
    lv_obj_add_event_cb(win_encode.dp[1], esc_event_handler, LV_EVENT_KEY, NULL);//返回
    lv_obj_add_event_cb(win_encode.btn, esc_event_handler, LV_EVENT_KEY, NULL);//返回

样式部件：

示例代码

标签部件：

开关按键部件：

按钮添加文本显示，并且居中

   lv_obj_t *btn_label = lv_label_create(win_encode.btn);
    lv_label_set_text(btn_label, "一键编码");
    lv_label_set_recolor(btn_label,1);
    lv_obj_center(btn_label); // 居中文本在按钮上

复选框部件：

比如，总线，选择设备需要很多复选框

如果是进制选中状态，也用禁用复选框，非点击状态

回调函数，根据事件类型，当单个复选框，值发生改变时

如果是多个复选框，那么需要判断是哪个触发源导致的，然后再判断当前复选框的状态

static void checkbox_event_cb(lv_event_t *e)
{
    lv_obj_t *target = lv_event_get_target(e);
    memset(checked, 0, sizeof(checked));
     for(int i = 0; i < CHECKBOX_NUM; i++) 
    {
        if(win_encode.checkbox[i] != target) 
        { 
            lv_obj_clear_state(win_encode.checkbox[i], LV_STATE_CHECKED);
        }
    }
    
    // 遍历所有复选框并检查它们的选中状态 
    for(int i = 0; i < CHECKBOX_NUM; i++) 
    {
        if(target == win_encode.checkbox[i]) 
        {
            checked[i] = lv_obj_has_state(win_encode.checkbox[i], LV_STATE_CHECKED);
            break;
        }
    }
}

进度条部件

先设置范围，再设置动画时间，再设置当前值

也可以指定起始点开始绘制

默认模式从最左侧绘制到当前值，也可以设置起始值

比如开机使用

如果还要增加百分比的同步显示效果，就需要增加一个定时器部件

文本部件：

加载器部件：

比如在系统自检的界面

//隐藏
lv_obj_add_flag(win_encode.spin, LV_OBJ_FLAG_HIDDEN);
lv_obj_add_flag(win_encode.label[3], LV_OBJ_FLAG_HIDDEN);
//显示
lv_obj_clear_flag(win_encode.spin, LV_OBJ_FLAG_HIDDEN);
lv_obj_clear_flag(win_encode.label[3],LV_OBJ_FLAG_HIDDEN);

LED部件

用途：屏幕控制硬件LED，同步LED的状态切换

列表部件：

用途：菜单列表，二级菜单列表，可以显示图标，可以显示菜单的文本内容等

下拉列表部件：

用途：字体字号修改，设备型号选择设置下拉的方向等

滚动部件：

用途：比如系统时间设置字体字号

获取文本内容

滑块部件：

用途：音量灯光亮度滑块调节

圆弧部件：

用途：码盘表显示，温湿度等

要会计算圆弧角度

增加百分比标签显示

线条部件：

在一组坐标点绘制一条直线

用途：画边框画横线竖线

画出一个正弦波

图片部件：

用途：主页图片，开机界面，背景优化

在LVGL官网找到

LV_IMG_DECLARE(imagetest);

代码段：

   win_many_tst.image1 = lv_img_create(win_many_tst.obj);
   lv_obj_add_flag(win_many_tst.image1, LV_OBJ_FLAG_CLICKABLE);
   lv_img_set_src(win_many_tst.image1, &imagetest);
   lv_img_set_pivot(win_many_tst.image1, 50,50);//设置轴心的位置参考点00 图片旋转使用
   lv_img_set_angle(win_many_tst.image1, 0);//旋转角度
   lv_obj_set_pos(win_many_tst.image1, 100, 50);
   lv_obj_set_size(win_many_tst.image1, 200, 200);

lv_obj_set_style_img_opa(win_many_tst.image1, 255, LV_PART_MAIN|LV_STATE_DEFAULT);

但是为什么图片出现两张呢尺寸问题