STM32+GUI Guider+Littlevgl

您所在的位置：网站首页 › stm32的gui › STM32+GUI Guider+Littlevgl

STM32+GUI Guider+Littlevgl

2023-10-08 23:03| 来源: 网络整理| 查看: 265

目录准备硬件平台：仓库地址：建立工程and移植移植文件配置keil添加demo文件头文件包含修改文件修改lv_conf.h文件修改lv_port_disp_template.c文件修改lv_port_indev_template.c文件修改lv_demo_widgets.c demo文件修改lv_ex_conf.h文件运行使用gui guider编辑控件生成代码设置按键事件移植gui guider生成代码运行

准备硬件平台：

这里采用正点原子探索者开发板

注意参考硬件平台是否满足需求编译不通过在这里插入图片描述

编译通过在这里插入图片描述

仓库地址：

lvgl github 这里也可以使用仓库导入，提升速度

在这里插入图片描述这里我使用的是7.10.1版本 my仓库地址

建立工程and移植

一开始使用的是正点原子官方提供移植好的工程，发现触摸出现问题，看视频说什么电阻屏需要校准，可我设置了校准但按下按键没有反应，我意识到我的是电容屏，然后我怀疑是源码移植有问题，我就把裸机触摸章节的代码移植到了该工程，发现也没有用，在裸机触摸屏章节是可以的，这也就排除了触摸芯片问题，然后我觉得是不是工程问题，然后我就在该工程下开始移植liteevgl。在这里插入图片描述还有就是我的是电容屏，可为什么还是执行了那句电阻屏执行代码，执行了电容屏的测试程序，不知道是原子哥写错了还是我理解错了。

移植文件

把lvgl-7.10.1中所以代码搞到/GUI/lvgl中，这里取名为lvgl是有讲究的，是为了适配nxp的gui guider软件生产的代码，改为lv_conf.h这里改名字是为了适配其他文件包含报错问题，当然你可以选择这里不改，去改大量其他文件。在这里插入图片描述

在这里插入图片描述

配置keil

配置keil环境，这里没有讲究，最好分好类，利于理解和修改，port也就是端口，到时候调用底层lcd显示函数和底层触摸函数得在这里修改。在这里插入图片描述把这里面所有的.c文件搞到lvgl_src中。

在这里插入图片描述

添加demo文件

这里新建一个存放demo实验的文件夹，移植以下内容及改名在这里插入图片描述 keil工程添加.c文件

头文件包含

在这里插入图片描述

修改文件

这里可以参考正点原子的移植手册我这里没有说明的地方都是和移植手册一样的，我只说不一样和值得注意的点。

修改lv_conf.h文件 #define LV_HOR_RES_MAX (480) #define LV_VER_RES_MAX (800) #define LV_COLOR_DEPTH 16 #define LV_DPI 60 /*[px]*/ 这里我没有按正点原子的修改 # define LV_MEM_SIZE (32U * 1024U) lvgl 7的版本我就修改了这几项，可以参考正点原子移植手册，正点原子6的版本有些修改配置是没有的，没有就不管。修改lv_port_disp_template.c文件 /* Example for 1) */ static lv_disp_buf_t draw_buf_dsc_1; static lv_color_t draw_buf_1[LV_HOR_RES_MAX * 10]; /*A buffer for 10 rows*/ lv_disp_buf_init(&draw_buf_dsc_1, draw_buf_1, NULL, LV_HOR_RES_MAX * 10); /*Initialize the display buffer*/ // /* Example for 2) */ // static lv_disp_buf_t draw_buf_dsc_2; // static lv_color_t draw_buf_2_1[LV_HOR_RES_MAX * 10]; /*A buffer for 10 rows*/ // static lv_color_t draw_buf_2_1[LV_HOR_RES_MAX * 10]; /*An other buffer for 10 rows*/ // lv_disp_buf_init(&draw_buf_dsc_2, draw_buf_2_1, draw_buf_2_1, LV_HOR_RES_MAX * 10); /*Initialize the display buffer*/ // /* Example for 3) */ // static lv_disp_buf_t draw_buf_dsc_3; // static lv_color_t draw_buf_3_1[LV_HOR_RES_MAX * LV_VER_RES_MAX]; /*A screen sized buffer*/ // static lv_color_t draw_buf_3_1[LV_HOR_RES_MAX * LV_VER_RES_MAX]; /*An other screen sized buffer*/ // lv_disp_buf_init(&draw_buf_dsc_3, draw_buf_3_1, draw_buf_3_2, LV_HOR_RES_MAX * LV_VER_RES_MAX); /*Initialize the display buffer*/ /*----------------------------------- * Register the display in LVGL *----------------------------------*/ lv_disp_drv_t disp_drv; /*Descriptor of a display driver*/ lv_disp_drv_init(&disp_drv); /*Basic initialization*/ /*Set up the functions to access to your display*/ 主要修改这里，实现动态获取屏幕大小 /*Set the resolution of the display*/ disp_drv.hor_res = lcddev.width; disp_drv.ver_res = lcddev.height; /*Used to copy the buffer's content to the display*/ disp_drv.flush_cb = disp_flush; 因为这里有调用，所以最开始Example for 1我没有注释，你也可以尝试把这里注释，把Example for 1也注释。 /*Set a display buffer*/ disp_drv.buffer = &draw_buf_dsc_1; static void disp_flush(lv_disp_drv_t * disp_drv, const lv_area_t * area, lv_color_t * color_p) { /*The most simple case (but also the slowest) to put all pixels to the screen one-by-one*/ 这里就是调用最底层lcd显示函数了，不管移植啥开源上层库都会调用驱动库中最底层函数，注意包含lcd驱动头文件 //把指定区域的显示缓冲区内容写入到屏幕 LCD_Color_Fill(area->x1,area->y1,area->x2,area->y2,(u16*)color_p); /* IMPORTANT!!! * Inform the graphics library that you are ready with the flushing*/ lv_disp_flush_ready(disp_drv); } 修改lv_port_indev_template.c文件 lv_port_indev_init函数只保留这些其他注释。 void lv_port_indev_init(void) { /* Here you will find example implementation of input devices supported by LittelvGL: * - Touchpad * - Mouse (with cursor support) * - Keypad (supports GUI usage only with key) * - Encoder (supports GUI usage only with: left, right, push) * - Button (external buttons to press points on the screen) * * The `..._read()` function are only examples. * You should shape them according to your hardware */ lv_indev_drv_t indev_drv; /*------------------ * Touchpad * -----------------*/ /*Initialize your touchpad if you have*/ touchpad_init(); /*Register a touchpad input device*/ lv_indev_drv_init(&indev_drv); indev_drv.type = LV_INDEV_TYPE_POINTER; indev_drv.read_cb = touchpad_read; indev_touchpad = lv_indev_drv_register(&indev_drv); 触摸最底层函数 static bool touchpad_read(lv_indev_drv_t * indev_drv, lv_indev_data_t * data) { static uint16_t last_x = 0; static uint16_t last_y = 0; if(tp_dev.sta&TP_PRES_DOWN)//触摸按下了 { last_x = tp_dev.x[0]; last_y = tp_dev.y[0]; data->point.x = last_x; data->point.y = last_y; data->state = LV_INDEV_STATE_PR; }else{//触摸松开了 data->point.x = last_x; data->point.y = last_y; data->state = LV_INDEV_STATE_REL; } //返回 false 代表没有缓冲的数据 return false; } 修改lv_demo_widgets.c demo文件这也就是为什么我移植app demo的时候要带上它的原因 #include "../../lv_examples.h" #include "lv_demo_widgets.h" 反正调用demo文件就得包含它 #include "lv_ex_conf.h" 包含改文件是 #include LV_THEME_DEFAULT_INCLUDE 报错 #include "lvgl.h" #include LV_THEME_DEFAULT_INCLUDE 修改lv_ex_conf.h文件 /*Show some widget*/ #define LV_USE_DEMO_WIDGETS 1 #if LV_USE_DEMO_WIDGETS #define LV_DEMO_WIDGETS_SLIDESHOW 0 #endif 运行

这里定时器啥的通过lvgl节拍自行添加

#include "lvgl.h" #include "lv_port_disp_template.h" #include "lv_port_indev_template.h" #include "lv_demo_widgets.h" lv_init(); lv_port_disp_init(); lv_port_indev_init(); lv_demo_widgets(); while(1) { tp_dev.scan(0); lv_task_handler(); }

这样你的第一个demo应该就可以跑起来了。

使用gui guider

安装包，gui guider安装包及java 链接: https://pan.baidu.com/s/1sNRjr_azmKR-ieDo67cVNA?pwd=gyqt 提取码: gyqt 复制这段内容后打开百度网盘手机App，操作更方便哦

java下载地址

安装啥的就无脑下一步，这里gui guider文件需要jdk java环境在这里插入图片描述设置中文