Insert title here

开源LittleVGL移植到stm32f103vet6中在st7789的1.14寸屏幕上显示例程开发过程,无触摸

最近发现这个开源的GUI特别有意思,网上的资料还比较少,在这里记录一下我的整个开发过程

首先使用的IC是f103vet6

屏幕是淘宝的1.14寸LCD,分辨率135*240

第一步先去lvgl的github上面下载它的源码还有例程源码

我这里使用的版本是lvgl的7.6.0,刚刚上去看居然发现一个小时前更新了v7.6.1,啊这

 

lvgl源码:https://github.com/lvgl/lvgl

lvgl演示例程源码:https://github.com/lvgl/lv_examples

 

下载好了我们先放起来,等会移植的时候要用的上

 

 

第二步我们现在需要一个显示LCD的例程,这里我直接用淘宝卖家提供的显示代码了

 

 

 

 

 还挺多的啊,这里我就选中的的STM32F103ZET6_Software_SPI的了

因为我用的是vet6,这款的FLASH好像是相同大小的,直接在keil里面改芯片都省的移植了

 

 

那么我们现在有这些东西了,把第一个工程的名字改成stm32_test吧,现在这名字也太长了

 

我们打开stm32_test的工程先看一下,就是一个测试LCD功能的代码,测试了一下GUI.c的画点画圆啥的

 

 

 

LCD的接线方法最顶上的注释也给出来了,省的我们找LCD的IO口去一个个翻了,好评!

 

 

 

下面那个触摸屏接线的注释我们直接忽略吧,1.14寸的LCD不配拥有触摸

 

编译测试可以正常使用,这里就不贴测试图了直接进入下一步

 

我们在stm32_test工程的里面新建两个文件夹,LittleVGL和

 

LittleVGL用来放lvgl从github上面下载来的源码吧,LittleVGL_APP用来放一下我们自己写的GUI界面

现在这两个文件夹是空的,下面来说说在里面放啥东西

 

 

 

 

我们先解压一下刚刚在github下载的lvgl的源码

 

 

我们得到了一个这个

 

 

 

点进来看看里面有啥东西

 

 

 

看不懂不管了,继续下一步操作

 那我们就把这个解压出来的lvgl-master复制放在我们工程刚刚新建的LittleVGL里面

 

 

给它改一下名字吧,就叫lvgl简单一点

 

 

放好了就从它里面拿出点东西来用,我们进入lvgl中找到lv_conf_template.h

 

 

 

哟,刚进来就看到你了,把它复制带出去,把名字改成lv_conf.h,这里面代码等下再说,就先放在和lvgl同级吧

 

 

 

 我们在这个目录下在新建一个文件夹吧,就叫lvgl_driver

 

 

 

 

这个lvgl_driver肚子里面空空的,我们在lvgl里面再复制点东西出来放进去

第一步先进去lvgl

 

 

 再进去里面的examples里面

 

 

 

哟,这里居然还有一个arduino的代码,无视他我们继续进去porting

 

 

找到了我们需要的代码

 

 

 这里面说一下,我红框框起来的两个是lvgl的显示代码,下面那个lv_port_indev_template.c和.h是触摸的代码

因为我们这里比较卑微没有触摸,我就只复制了我框起来的两个,中间那个fs啥的不知道,也没有时间去看

带走!!!

 

把这两放在lvgl_driver里面吧,让他们重新做.c和.h文件,重新做文件首先第一步把名字改了先

 

 

 名字改好了

 

 

上面全部工作准备好了,我们开始干正事了,准备移植手术!!!!!!

 

再keil5工程里面把他们的头文件先包含进来先

就是上面图里面的三个路径,我看lvgl源码里面找头文件好多都是通过这里去找的

 

keil工程里面也加入几个文件夹吧,整理起来好看一点

 

 

 

 

 

 

那么我们现在也加入一下.c文件进来

 

LittleVGL_Driver就拉一个就行了

 

 

 

 

接下来LittleVGL拉的才多

 

需要把lvgl / src /路径里面全部文件夹里面的.c文件导入进去

出了一个lv_GPU文件里面的不用,其他都导入进去

 

 

 

还挺多东西的,最后都点OK确认吧

 

这个LittleVGL_APP就不放东西了吧,这个是放我们自己写的界面,现在也没有东西放

 

 

 

别急着编译,现在编译肯定几千个错误,我们先选型一个芯片再写BUG

 

 

 

 

 

对了,这个C99 Mode的钩一定要打上,lvgl用到了

 

 

 

 

 好了,那么现在就编译看看吧,不忍直视

 

 

 才区区2000多个错误,看不起谁呢

 

好了,我们找到lv_conf.h来修改一些参数,就是我们从lvgl搬出来那个

 

 下面直接说改那行不做太多解释了

 

 

 

 

 

 

 

 

 

 好了,下面没啥东西需要修改了

 下面我们修改一下lvgl显示的代码

 

 

 

 我们走到141的函数disp_flush,一路下来错误还挺多的

 

 

 

这个代码里面我们添加一个画点函数,再我们的GUI.c里面有,看英文也能明白它缺少一个画点的显示

当然也可以把他们全部替换成画矩形的代码,但是下面那个lv_disp_flush_ready的那个代码不要动它

 

 

 

 

 再这代码里还有一个问题,我们选择一种缓存的方式,测试的话那就选最简单的吧

 

 

 

把另外两个注释掉

 

 

我们再打开"lv_port_disp.h"里面修改一些东西

 

 "lv_port_disp.h"里面声明一下lv_port_disp_init函数

 

 

 那么现在再编译一次

 

 

 居然还有30个错误,看这些错误都是同一个问题,我去看看怎么回事

 嗷就是没有定义u16,可以把u16换成uint16_t,不过为了省事这里直接添加一个sys.h

 

 

 

 

再次编译一下,成功通过

 

 

 

不过还没结束

我们这里要使用lvgl还需要给它提供一个1ms的心跳节拍

 可以使用Systick或者定时器来提供

我看这里的工程样式好像是正点原子的,那么我们直接从正点原子的定时器例程里面弄一个TIM过来

这里就不写啥移植TIM过程了,直接拉过来就是用

 

再代码中加入.c,在魔术棒里面加入它的头文件路径

 

 

 

 

还要在这里加入

 

 

 躲在tim.c的TIM3中断里面添加一个lv_tick_inc(1);这里中断在主函数配置成了1ms等会在看看

 

 

 

 现在我们先编译一下

 

 还要5个警告啊,我们不用管他了,随便它警告吧继续下一步

 

在主函数中添加一些代码

首先加入头文件

 main中添加初始化

刚刚发现一个有意思的情况:

我在main并没有配置TIM3为1ms,也没有调用TIM的头文件,难道其实不用心跳节拍也能用?

这个之后我研究研究,可能是我配置了没有看到?

 

 在下面的while循环里面加一个lvgl的句柄

 

 

我们在while循环之前就可以放入我们的界面了,先测试一个手写的显示按键吧

 

 

 编译通过写入stm32里面试试

写入的过程是比一般的例程时间久一些

我们看看屏幕显示效果

 

 

 

我裂开了,屏幕白光太亮了,拍照不清晰,之后调整PWM调整背光我在重新拍一下

不知道小伙伴能不能看清中间有个蓝色的BUTTON

 

好了过程就写到这里,之后抽时间把代码链接放出来

下一个随笔也是接这篇lvgl的内容,主要是说明一下如何使用lvgl提供的demo例程

 

就到这里吧

 

 

 

posted @ 2020-10-10 00:12  这一切足够了  阅读(3981)  评论(1编辑  收藏  举报
复制代码