[STM32F1] stm32移植lvgl

[复制链接]
 楼主| hudi008 发表于 2022-10-27 10:00 | 显示全部楼层 |阅读模式
1、lvgl简介
lvgl是一款全部用c语言实现的ui图形库,对硬件的要求比较低,可以较为流畅的运行在单片机上。并且完全开源,对按钮,触摸,编码器旋钮等支持的非常到位。且开发的界面较为美观,符合时下主流的审美。
目前最新版本已经更新到了8.3版本,官网地址为https://lvgl.io/。本次移植使用的是8.1版本。下载链接为https://github.com/lvgl/lvgl/releases/tag/v8.1.0
2、lvgl源码
下载完成后接下,源码根目录如下
43e0848cf67846b9ab67e4e0d78195e2.png
移植需要用的目录是src和examples文件夹。src存放的源码,examples是示例
2.1stm32工程新建lvgl文件夹
6a08e6989e1842848b5c354510ba8791.png
将lvgl8.1目录下的src examples lvgl.h lv_conf_template.h拷贝放入lvgl文件夹
0cc13aaa5738475592c68a41d43ed20e.png
lvgl文件目录如下:
330ccf17d2824a09a3095fc4c360d291.png
将lv_conf_template.h改为lv_conf.h
1dc0763f11ba4ff086a6c012392f849b.png
打开lv_config.h 将第一行#if 0 改为 #if 1,来使能lv_conf.h。
2.2porting文件夹
打开lvgl/examples/porting文件夹,这个文件夹放的是与硬件层交互的数据。
45d6b57468a14d089186068b88cfc9e5.png
将8个文件中的_template全部去掉,lv_port_disp.h中将#if 0改为#if 1。将宏定义中的_TEMP去掉。将lv_port_disp.c中的宏定义改为#include “lv_port_disp.h”。其他fs indev也依照此进行修改。
fs 是跟文件系统相关的。
indev是跟输入设备相关的,按钮,触摸屏,鼠标等相关的。
065efb8b7df8481d894f41ae3091b4d3.png
3 修改stm32工程
用keilmdk打开工程。
3.1使能c99
fab80afa2b794f6f84175d794936a46a.png
在配置界面将c99 mode选项勾选。
lvgl中结构体初始化用到了指定初始化功能,这个功能c99标准才支持。不勾选编译会出错
3.2添加lvgl 和lvgl_port组
项目下添加lvgl和lvgl_port组
63e7a4485d7a49d4b50fe79b7096c928.png
3.2添加port文件
打开组管理器,添加disp和indev,位于lvgl/examples/porting,因为没有用到文件系统,故没有添加fs
36e5e0ec21fc46ed895a1c8d2690dd78.png
3.2添加lvgl源文件
将lvgl/src目录下的core draw font hal misc widgets文件夹下的所有文件全部添加进lvgl组
cf628748d2384efba0a2dd0183b9cb04.png
将lvgl/src/extra/目录下的文件添加进lvgl组。具体为:
layouts目录下所有子目录文件
themes目录下所有子目录文件
widgets目录下所有子目录文件
lv_extra.c
80db244c922b4948a616092345ff0db0.png
3.3配置中添加source目录
将lvgl ,src,porting文件夹添加到源路径下。
aa24143a5075480b943d6e4e9cdad0b1.png
4 编译
完成上述后,编译会报错。这里就直接把要修改的地方写出来。
4.1修改lv_port_disp.h
将其中的#include改为如下
c8525a1aa3224b36aca6fc854a209939.png
4.2添加屏幕像素宏定义
在lv_conf.h中添加屏幕像素宏定义,我用的屏幕大小是320*240,按照实际填写
#define MY_DISP_HOR_RES 320
#define MY_DISP_VER_RES 240
1689933c11d2403e9a2f05e94e5a68de.png
4.3设置lvglbuffer
在lvgl_port_disp.c中有三种大小的buffer,这里选择1,lvgl默认选择的就是1。
3是全尺寸屏幕刷新,消耗的内存太大,如果使用了外部sram优选方式3,选了方式3还需要添加LV_VER_RES_MAX宏定义。
将方式2和3屏蔽掉.后续根据实际使用进行调整。
412a008ee92d4c848e9e66607863c3bf.png
然后将lvgl_port_disp.c下面两个变量值设置为如下:
disp_drv.hor_res = MY_DISP_HOR_RES;
disp_drv.ver_res = MY_DISP_VER_RES;
最后进行编译,应该是不会再出现错误了。
5、下载到stm32运行5.1修改disp_flush函数
这个函数在lv_port_disp.c中,lvgl就是通过该函数用户屏幕进行数据交互。这函数的作用是,在一块区域填充颜色。
将disp_flush修改如下
5b8eab2486eb4fe5957b7f073f5deccb.png
LCD_COLOR_FILL函数如下:可以根据实际使用的屏幕驱动进行修改。
void LCD_Color_Fill(u16 sx,u16 sy,u16 ex,u16 ey,u16 *color){          u16 height,width;        u16 i,j;        width=ex-sx+1;                         //得到填充的宽度        height=ey-sy+1;                        //高度         for(i=0;i<height;i++)        {                 LCD_SetCursor(sx,sy+i);           //设置光标位置                 LCD_WriteRAM_Prepare();     //开始写入GRAM                for(j=0;j<width;j++)LCD->LCD_RAM=color[i*width+j];//写入数据         }                  }  5.2添加lvgl tick函数
lvgl运行都要依靠1ms周期的时钟。所有需要在stm32系统时钟中断中将lvgl的tick函数添加进来。系统时钟中断一般位于xit.c中
11569c614f234a75b00d18c17148a48e.png
5.3在主循环中添加lvgl句柄函数
在主循环或者os的任务主循环中添加
lv_task_handler();
主循环的周期为10ms。
176b28e7297145bfa270b265894eac51.png
至此lvgl移植完成。
5.4运行示例
在lvgl组中添加示例文件。位于lvgl/examples/get_started文件夹
2e887c1bd4d048f8978efa9f3f0efd8d.png
进入主循环前初始化lvgl,lvglport,启动示例。
lv_init();
lv_port_disp_init();
lv_example_get_started_1();
最终任务函数为,我这里用的是freertos,lvgl放到了一个单独的任务中运行。
void lvgl_task(void *pvParameters){        lv_init();        lv_port_disp_init();        lv_example_get_started_1();        while(1)        {                lv_task_handler();                vTaskDelay(10);                }}
运行效果,会在屏幕上显示一个蓝色的按钮
402a9915b2e74f67afae8006940e3343.png

V853 发表于 2022-11-1 14:25 | 显示全部楼层
LVGL比较难移植的就是驱动部分。
朝生 发表于 2022-11-1 14:37 | 显示全部楼层
网上有个灵动岛就用了LVGL做的。
星辰大海不退缩 发表于 2022-11-1 15:00 | 显示全部楼层
讲解的很详细,LVGL移植很清晰,确实对硬件要求比较低,适用多种单片机
szt1993 发表于 2022-11-1 15:03 | 显示全部楼层
驱动移植很简单,直接FreeRTOS配合LVGL简单清晰
robincotton 发表于 2022-11-1 16:19 | 显示全部楼层
littleVGL绝对是开发图形界面最好的工具。
jtracy3 发表于 2022-11-1 16:34 | 显示全部楼层
Littlevgl教程有吗               
V853 发表于 2022-11-1 16:39 | 显示全部楼层
LVGL框架显示效果确实不错,就是不知道占用CPU如何。
mnynt121 发表于 2022-11-1 16:55 | 显示全部楼层
        LittlevGL是一个开源的图像库,具有很好的移植性。
usysm 发表于 2022-11-1 17:26 | 显示全部楼层
        lvgl就是满足轻量级GUI开发的,代码借鉴一下。   
louliana 发表于 2022-11-1 17:59 | 显示全部楼层
lvgl可以用于大型GUI开发吗
deliahouse887 发表于 2022-11-1 18:42 | 显示全部楼层
lvgl8和lvgl7区别是什么呢   
caigang13 发表于 2022-11-1 18:43 来自手机 | 显示全部楼层
LVGL的代码执行效率咋样呢?
SantaBunny 发表于 2022-11-2 17:33 | 显示全部楼层
问问Littlevgl教程
Undshing 发表于 2022-11-2 19:31 | 显示全部楼层
littleVGL开发图形界面绝对是最好的工具
Bowclad 发表于 2022-11-6 21:48 | 显示全部楼层
比较难移植的就是驱动
MessageRing 发表于 2022-11-9 20:40 | 显示全部楼层
LVGL移植很清晰,适用多种单片机
AloneKaven 发表于 2022-11-11 17:55 | 显示全部楼层
littleVGL用起来很顺手
Stahan 发表于 2022-11-11 21:15 | 显示全部楼层
直接FreeRTOS配合LVGL简单清晰
Henryko 发表于 2022-11-11 21:46 | 显示全部楼层
LVGL框架占用CPU高不高?
您需要登录后才可以回帖 登录 | 注册

本版积分规则

253

主题

9864

帖子

11

粉丝
快速回复 在线客服 返回列表 返回顶部