【快速入门 LVGL】-- 5、Gui Guider界面移植到STM32工程

news2025/3/10 11:14:01

上篇,我们已学习:【快速入门 LVGL】-- 4、显示中文

工程中添加了两个按钮作示范。运行效果如图:

本篇:把Gui Guider设计好的界面,移植到STM32工程。

特别地:

  • 在使用Gui Guider进行界面设计时,应该尽量地完善了设计,再进行移植。
  • 本篇只添加了两个按钮就(匆忙)移植,只是为了示范如何移植。

1、复制一份已移植好LVGL底层的 STM32 工程,作为Gui Guider移植的基础工程。

     在第1篇LVGL学习中,我们已移植好了一个LVGL的STM32工程。

2、在STM32工程的 LVGL 目录下,新建文件夹

  • 在 LVGL 文件夹下,新建文件夹:myGUI。也可以使用自己喜欢的名称。

完成后,LVGL文件夹是这个样子的:

3、复制 Gui Guider 工程文件到 STM32 工程

  • 复制:Gui Guider 工程目录下的两个文件夹: custom、generated;
  • 粘贴到:STM32工程 / LVGL / myGUI 文件夹中;

完成后,LVGL /  myGUI 文件夹,是这个样子的:

特别地:

  • 在粘贴后,顺手把这两个文件下所有子文件夹的 mk、json文件,都删除,后面更省时间。

 4、打开 STM32 工程

  • 保留:硬件初始化代码、LVGL的3行初始化函数、心跳函数、任务刷新函数;
  • 删除之前测试用的控件代码;

修改后,main是下图这个样子的 (TIM中断回调函数里的心跳函数,在截图范围外了):

点击编译,确认:0 Error; 

如果有错误,先解决了再下一步。

不要嫌麻烦,每操作一个重要步骤,就编译检查一次!

5、新建文件组

  • 新建一个Group:LVGL_myGUI;

6、为 LVGL_myGUI 添加文件

注意:

  • 添加 LVGL / myGUI 目录下:所有 c、h文件;
  • 文件类型选择: All files(*.*),  才能显示h文件;
  • mk、json扩展名的文件,不用添加 (如果在第3步里已删除,这儿操作会很方便);
  • 重点:所有子文件夹里的c、h,都别漏了,如generated文件夹就的子文件夹;
  • 添加完了,点击"OK",保存。

操作过程如下:

完成后,是这个样子的:

7、添加头文件路径

     需要添加三个路径:

  • LVGL /  myGUI / custom
  • LVGL /  myGUI / generated
  • LVGL /  myGUI / generated / guider_customer_fonts

工程资源不同,需要添加的路径不尽相同,如,你的工程可能会有图片资源文件夹等。

如果怕出错:只要是有h文件的目录,你都添加它的路径,就不会产生错误。

步骤、操作如下:

8、在main.c中,添加Gui Guider的头文件引用、声明变量

  • #include "gui_guider.h"           // Gui Guider 生成的界面和控件的声明
  • #include "events_init.h"          // Gui Guider 生成的初始化事件、回调函数
  • lv_ui  guider_ui;                     // 声明 界面对象

完成后,是这个样子的:

9、添加 UI、事件 的初始化函数

main.c中,在LVGL初始化、TIM6初始化之后,调用界面UI、事件的初始化函数。

  • setup_ui(&guider_ui);           // 初始化 UI
  • events_init(&guider_ui);       // 初始化 事件

完成后,是这个样子的:

10、编译一次

当使用Gui Guider是v1.7.2版本及以上,编译后,是没有错误的。

但是,v1.7.1版本及以下,编译完成后,会有4处错误,如下图:

如何解决:

点击编译信息栏,向上滚动,依次找到:error...."lvgl/lvgl.h"  No such file or directory;

  • 双击错误提示行,将会跳转到产生错误的位置 。
  • 依次把4处路径错误: "lvgl/lvgl.h",  修改为:"lvgl.h"

再次编译:0 Error !

11、烧录

烧录代码至板子,运行结果如下:


本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1619127.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

探索SAVI:土壤调整植被指数的意义与应用

​随着遥感技术的不断发展,植被指数成为了评估地表植被覆盖和健康状况的重要工具之一。其中,SAVI(Soil Adjusted Vegetation Index,土壤调整植被指数)作为一种针对土壤表面反射率进行调整的植被指数,在土地…

Linux内核之hook机制:call_void_hook用法实例(六十一)

简介: CSDN博客专家,专注Android/Linux系统,分享多mic语音方案、音视频、编解码等技术,与大家一起成长! 优质专栏:Audio工程师进阶系列【原创干货持续更新中……】🚀 优质专栏:多媒…

使用2023版BurpSuite半自动化Autorize进行垂直越权测试【图文教程】

本人在使用时BurpSuite v2023.12时,查阅网上资料,发现网上大多是旧版,而旧版跟新版在界面上有些许调整。故记录BurpSuite v2023.12使用教程,用于后续本人回顾。 Autorize工具安装 Extensions→BApp Store→Autorize→Download J…

HTML5+CSS3小实例:炫彩荧光线条登录框

实例:炫彩荧光线条登录框 技术栈:HTML+CSS 效果: 源码: 【HTML】 <!DOCTYPE html> <html lang="zh-CN"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-sca…

parallels desktop19.3最新版本软件新功能详细介绍

Parallels Desktop是一款运行在Mac电脑上的虚拟机软件&#xff0c;它允许用户在Mac系统上同时运行多个操作系统&#xff0c;比如Windows、Linux等。通过这款软件&#xff0c;Mac用户可以轻松地在同一台电脑上体验不同操作系统的功能和应用程序&#xff0c;而无需额外的硬件设备…

如何在 Flutter 中制作多种颜色的 TextField

TextField widget 本身并不施加任何样式。相反&#xff0c;它会要求 TextEditingController 生成一个样式化的 TextSpan 对象&#xff0c;即一段带有样式的文本。 TextField 将其样式传递给 TextEditingController &#xff0c;默认实现只是将其放入 TextSpan 对象中&#xff0…

揭开ChatGPT面纱(2):OpenAI主类源码概览

文章目录 〇、使用OpenAI的两个步骤一、初始化方法__init__()1.源码2.参数解析 二、提供的接口1.源码2.接口说明主要接口说明 OpenAI版本1.6.1 〇、使用OpenAI的两个步骤 在上一篇博客中&#xff0c;我实现并运行了一个OpenAI的demo&#xff0c;我们可以发现&#xff0c;想要使…

多商家AI智能名片商城系统(开源版)——构建高效数字化商业新生态

一、项目概述 1、项目背景 1&#xff09;起源 随着数字化时代的快速发展&#xff0c;传统名片和商城系统已经难以满足企业日益增长的需求。商家需要更高效、更智能的方式来展示自己的产品和服务&#xff0c;与消费者进行互动和交易。同时&#xff0c;开源技术的普及也为开发…

科林Linux_3 进程

一、进程基础 操作系统基础的执行单元&#xff0c;调度单位 静态数据&#xff1a;只占用磁盘空间&#xff0c;不消耗其他资源 动态数据&#xff1a;磁盘 内存 CPU 1. 编译器将源码编译成一个可执行文件.exe/.elf 2. 运行后系统生成一个同名的进程 程序是进程的静态表现&a…

用 LM Studio 1 分钟搭建可在本地运行大型语言模型平台替代 ChatGPT

&#x1f4cc; 简介 LM Studio是一个允许用户在本地离线运行大型语言模型&#xff08;LLMs&#xff09;的平台&#xff0c;它提供了一种便捷的方式来使用和测试这些先进的机器学习模型&#xff0c;而无需依赖于互联网连接。以下是LM Studio的一些关键特性&#xff1a; 脱机&am…

JavaScript:js基础2

BOM Browser Object Model浏览器对象模型 允许JavaScript与浏览器进行对话 Js将浏览器的各个组成部分封装为对象 可以通过操作BOM对象来实现操作浏览器中的部分 location.href "" //操作浏览器地址栏中的地址BOM中包含了以下对象 window:浏览器窗口对象 Navi…

Leetcode算法训练日记 | day34

专题九 贪心算法 一、K次取反后最大化的数组和 1.题目 Leetcode&#xff1a;第 1005 题 给你一个整数数组 nums 和一个整数 k &#xff0c;按以下方法修改该数组&#xff1a; 选择某个下标 i 并将 nums[i] 替换为 -nums[i] 。 重复这个过程恰好 k 次。可以多次选择同一个…

python爬虫 - 爬取html中的script数据(36kr.com新闻信息)

文章目录 1. 分析页面内容数据格式2. 使用re.findall方法&#xff0c;爬取新闻3. 使用re.search 方法&#xff0c;爬取新闻 1. 分析页面内容数据格式 打开 https://36kr.com/ 按F12&#xff08;或 在网页上右键 --> 检查&#xff08;Inspect&#xff09;&#xff09; 找…

HarmonyOS开发案例:【相机开发】

基本概念 相机是OpenHarmony多媒体进程提供的服务之一&#xff0c;提供了相机的录像、预览、拍照功能&#xff0c;支持多用户并发取流。 在进行应用的开发前&#xff0c;开发者应了解以下基本概念&#xff1a; 视频帧 视频流指的是将一系列图片数据按照固定时间间隔排列形成的…

开发日志(20240422):一次以为是跨域但并不是跨域的问题排查记录

1. 日志 在前后端联调的时候&#xff0c;遇到了报错&#xff0c;如下图所示&#xff08;现在再看感觉非常简单了&#xff09;&#xff0c;发现前一个请求通过了&#xff0c;但是第二个请求报错&#xff0c;然后看到 strict-origin-when-cross-origin 条件反射的认为是跨域配置…

iOS - 多线程-GCD-队列组

文章目录 iOS - 多线程-GCD-队列组1. 队列组1.1 基本使用步骤 iOS - 多线程-GCD-队列组 开发过程中&#xff0c;有时候想实现这样的效果 多个任务并发执行所有任务执行完成后&#xff0c;进行下一步处理&#xff08;比如回到主线程刷新UI&#xff09; 1. 队列组 可以使用GC…

探索开源的容器引擎--------------Docker容器操作

目录 一、Docker 容器操作 1.1容器创建 1.2查看容器的运行状态 1.3启动容器 1.4创建并启动容器 1.4.1当利用 docker run 来创建容器时&#xff0c; Docker 在后台的标准运行过程是&#xff1a; 1.4.2在后台持续运行 docker run 创建的容器 1.4.3创建容器并持续运行容器…

Swift-27-类的初始化与销毁

Swift的初始化是一个有大量规则的固定过程。初始化是设置类型实例的操作&#xff0c;包括给每个存储属性初始值&#xff0c;以及一些其他准备工作。完成这个过程后&#xff0c;实例就可以使用了。 简单来讲就是类的构造函数&#xff0c;基本语法如下&#xff1a; 注意&#xff…

3节点ubuntu24.04服务器docker-compose方式部署高可用elk+kafka日志系统并接入nginx日志

一&#xff1a;系统版本: 二&#xff1a;部署环境&#xff1a; 节点名称 IP 部署组件及版本 配置文件路径 机器CPU 机器内存 机器存储 Log-001 10.10.100.1 zookeeper:3.4.13 kafka:2.8.1 elasticsearch:7.7.0 logstash:7.7.0 kibana:7.7.0 zookeeper:/data/zookeep…

贪心算法在单位时间任务调度问题中的应用

贪心算法在单位时间任务调度问题中的应用 一、引言二、问题描述与算法设计三、算法证明四、算法实现与效率分析五、C语言实现示例六、结论 一、引言 单位时间任务调度问题是一类经典的优化问题&#xff0c;旨在分配任务到不同的时间槽中&#xff0c;使得某种性能指标达到最优。…