【DigiKey“智造万物，快乐不停”创意大赛】STM32H7B3的LVGL初体验

Tristan_C

【DigiKey“智造万物，快乐不停”创意大赛】STM32H7B3的LVGL初体验 [复制链接]

 

STM32H7B3的LVGL初体验

因为使用的开发板是STM32H7B3的主控，并配备了一块4.3寸，480*272分辨率的LCD屏幕，加上项目是要进行天气时钟站的开发，因此UI界面的开发便逃不开了。虽然自己也没什么界面美工细胞，做不来很漂亮的界面，但这次就先把界面的基本功能先打好基础。因为也是第一次用，也第一次做UI类的东西，因此一开始也比较期待能成功。

先看一段用STM32H7B3做的Benchmark的测试视频

 

H7B3是一颗非常强劲的主控，其存储和外设资源及其适合及逆行图形开发，连LVGL官方的DEMO也已经先对这块板子做了支持。也就是下图的所谓官方认证开发板。

因此，先将LVGL官方的代码拉下来

链接已隐藏，如需查看请登录或者注册

可以看到这个其实是一个完整的功能，包含了STM32H7芯片的底层驱动，以及lvgl相关的全部代码。

工程是使用ST官方的IDE工具CubeIDE进行开发的，因此需要事先安装该软件。在从github下载下来之后，就将其导入CubeIDE中。

要注意此处最好选择拷贝一份代码到workspace中，以便备份原始代码。

导入成功之后可看到如下代码结构。

编译如下

还能看到具体的代码的资源使用信息

如果是手动下载代码包的方式，仓库的引用lvgl仓库是不会一起下载。

因此该文件夹为空

需要到lvgl的仓库中单独在下载，并解压到上述文件夹中。

点击run按钮

下载过程log如下

正常运行即可看到如下UI示例界面。在界面的左下角可以看到存储资源使用情况，在右下角则可以看到刷新帧率以及CPU使用率情况。

还支持了输入法，简直方便极了

下面还可以跑一下benchmark，将main函数中的lv_demo_benchmark功能打开

同时需要注意lv_conf.h文件中这个定义需要为1，即打开该功能

编译下载运行

最后就是跑分结果了

具体情况还可以看视频。

接下来可以自己再做一段简单的显示功能了，这里就写了一个简单的label显示，如下代码

显示效果如下（实际会滚动显示）

如果要测试其它的DEMO功能，需要将对应的宏定义更改，再行编译下载运行。

最后我们再尝试一下SquareLine Studio，这是LVGL官方推荐的UI设计平台，可以便捷地设计界面并一键生成代码导出。导出的代码在模拟器和嵌入式设备上都适用。目前支持的LVGL版本为8.2和8.3。对个人而言，注册即可免费使用。

软件可以从如下链接主页下载

https://squareline.io/

安装完之后，可以根据例程新建功臣

这里就直接新建Create一个新的工程，其中右下侧选择正确的屏幕配置

放置了几个label以及两个按钮

其中的两个按钮功能上，实现更新其中的一个label的内容，如下

使用如下的Export->Export UI Files操作生成代码。代码可以存放在另外的路径，也可以直接生成存放在前面的工程中。

Refresh工程即可看到添加的文件夹了

接下来还得配置一下工程的路径等

增加头文件，并在main函数中调用初始化函数

编译下载运行

点击左侧按钮

点击右侧按钮

总结：这是第一次使用高性能的单片机，也是第一次进行ui的开发尝试，以前总觉得ui设计特别麻烦，这次体验下来，其实基础的工具已经做得非常好了，包括界面的设计，代码的生成导出，以及应用的开发，都非常方便了。当然，最终还是得靠产品的整体设计，去做出更好更有吸引力的东西。

lugl4313820

哇，好强大的开发板，与强大的设计神器，期待大佬能出更加优秀的作品！

Tristan_C

lugl4313820 发表于 2023-12-12 09:29 哇，好强大的开发板，与强大的设计神器，期待大佬能出更加优秀的作品！

不太会搞界面，也是第一次弄，学习中……大佬多指点

trucy

显示的帧率只有33

Tristan_C

trucy 发表于 2023-12-13 08:24 显示的帧率只有33

是的，代码里面的宏定义把这个配置成了30，有没有啥需要改进或者问题请多多提点

#define LV_DISP_DEF_REFR_PERIOD 30

trucy

Tristan_C 发表于 2023-12-13 08:53 是的，代码里面的宏定义把这个配置成了30，有没有啥需要改进或者问题请多多提点 #define LV_DISP_DEF_ ...

一般目前显示屏使用都设置在50-60的区间，不知道H7B3能支持到多少

Tristan_C

trucy 发表于 2023-12-14 09:19 一般目前显示屏使用都设置在50-60的区间，不知道H7B3能支持到多少

好的，我回头再研究研究，第一次学习ui类，多谢指教

SeasonMay

看到屏幕能亮起来会很兴奋开心哈哈，博主加油呀，期待后续作品

Tristan_C

SeasonMay 发表于 2023-12-14 21:55 看到屏幕能亮起来会很兴奋开心哈哈，博主加油呀，期待后续作品

哈哈，是的，阶段性成果，比较有成就感收获感

HonestQiao

这板子的显示效果不错。

要是能够跑一个界面更丰富的案例，就更好了！

Tristan_C

HonestQiao 发表于 2023-12-16 21:23 这板子的显示效果不错。 要是能够跑一个界面更丰富的案例，就更好了！

好的乔帮主。第一次做gui类的东西，还在学习中，趁着这次活动研究研究 

lugl4313820

这个展是多少寸的呀，感觉这开发板是不是自己还要加点钱才能买到吧。

Tristan_C

lugl4313820 发表于 2023-12-18 07:36 这个展是多少寸的呀，感觉这开发板是不是自己还要加点钱才能买到吧。

是的，太喜欢了，自己添了一点点，超出600预算了。是一块4.3寸的屏

lugl4313820

Tristan_C 发表于 2023-12-18 12:01 是的，太喜欢了，自己添了一点点，超出600预算了。是一块4.3寸的屏

我买的U585开发板，传感器是多，就是没有屏，不好玩。

Tristan_C

lugl4313820 发表于 2023-12-18 12:37 我买的U585开发板，传感器是多，就是没有屏，不好玩。

自己加一块玩玩呢……