当前位置: 首页 > news >正文

ESP32-IDF LVGL UI 设计工具的使用

概述

本文首先会简单讲解一下LVGL的特点以及两款常见的UI设计工具,本文主要讲解的是恩智浦开发的GUI-Guider软件,另外一个lvgl官网开发的SquareLine Studio软件本文不做讲解。
UI设计软件:Gui-Guider
LVGL版本:8.3.10
平台:ESP32-S3
IDE:ESP32-IDF

简介

LVGL 简介

官网文档:LVGL官网参考文档
LVGL是由Gabor Kiss-Vamosi在2016年创建的一个开源项目。LVGL是用C语言编写的,支持多种操作系统,例如Linux、Window、RTOS等。随着越来越多的志愿者参与到该项目中,LVGL开始提供更多的语言绑定,例如Python、Micropython等,以及多种开发工具。
LVGL主要特点:
轻量级:只需要少量的记忆体和运算资源,可以在低端的微控制器上运行。
跨平台:可以在不同的硬件和软件平台上运行
开发简单:采用了面向对象的设计,可以方便创建和管理GUI的组件和属性。
软硬件需求
1)16、32或64位微控制器或处理器
2)运行主时钟速率 >16MHz
3)Flash/Rom基本要求 >64KB(推荐:>180KB)
4)RAM基本要求:
5)堆栈:>2KB(建议>8KB)
6)动态数据(堆):>4KB(如果使用对象过多,建议>32KB。
7)显示缓冲区: >“水平分辨率”像素(推荐:> 10 X“水平分辨率”)

UI设计工具

目前常用的LVGL UI设计工具有两个,第一个是恩智浦(NXP)官网提供的GUI-Guider,第二个是LVGL官网提供的SquareLine Studio。

GUI-Guider

截至本文编写时,软件版本已经更新到1.9.1版本,下载使用该软件需要NXP账号。软件初始化页面如下图所示,Gui-Guider支持lvgl源码版本为9.2.1和8.3.10。
在这里插入图片描述

SquareLine Studio

截至本文编写时,软件版本为1.5.3版本。该设计工具的优势在于比NXP的组件更多,示例更更富。缺点就是个人学习使用免费,不得用于商业。不登陆账号直接使用可以试用30天,之后需要登陆账号获取许可证才能继续使用。软件初始化界面如下图示,SquareLine Studio支持的lvgl版本有8.3、9.1、9.2。由于示例的程序不一样,所以其支持的详细版本也不一样。
在这里插入图片描述

Gui-Guider 软件使用

由于NXP提供的Gui-Guider 软件是免费使用的 所以笔者也直接果断的选择了该软件来设计UI页面,设计好的UI页面编译成功后会直接生成lvgl源码,只需要将生成的源码移植到lvgl工程中即可。

创建工程

点击“创建新项目->v8.3.10->Simulator->EmptyUI->选择对应工程目录和配置点击创建”,最有一项的配置需要根据屏幕驱动IC和软件驱动去修改,不同屏幕选项不同笔者在这里不做过多描述。笔者的屏幕为240X240的分辨率且为圆屏,色彩深度为16bit。
在这里插入图片描述
如何修改背景形状可以拖拽该标志,向上拖拽增加弧度,向下增加角度。
在这里插入图片描述
在这里插入图片描述
然后根据需求修改和增加组件和图形,增加后如图所示两个页面main和control。无需和笔者一样,可以自由添加组件。
在这里插入图片描述
在这里插入图片描述
按照想法修改UI后点击右上角的编译选项并选择c语言,等待编译后切换到代码编辑页面就可以看到生成的源码。
在这里插入图片描述
在这里插入图片描述
将custom文件夹下的文件和Generated文件夹下的文件全部复制到lvgl工程中去,然后修改cmake添加编译链接。编译后烧录即可。
在这里插入图片描述

http://www.dtcms.com/a/286392.html

相关文章:

  • 海森矩阵(Hessian Matrix)在SLAM图优化和点云配准中的应用介绍
  • Go 的热重载工具 Air 详解
  • 深入理解 Spring:事务管理与事件机制全解析
  • 域名WHOIS信息查询免费API使用指南
  • 【CF】⭐Day104——Codeforces Round 840 (Div. 2) CE (思维 + 分类讨论 | 思维 + 图论 + DP)
  • 【LVGL】Linux LVGL程序几十分钟后UI卡死
  • ubuntu 安装zabbix6 agent2
  • AI进入自动驾驶时代:OpenAI发布革命性ChatGPT Agent
  • 生成式引擎优化(GEO)核心解析:下一代搜索技术的演进与落地策略
  • OpenAI最强ChatGPT智能体发布:技术突破与应用前景分析
  • 脉冲神经网络(Spiking Neural Network, SNN)与知识蒸馏(Knowledge Distillation, KD)
  • 有好内容,如何做好知识变现?
  • BIST会对锁步核做什么?
  • 深入了解直播美颜SDK:GPU加速下的美白滤镜功能实现?
  • 解决 IDEA 中 XML 文件的 “URI is not registered” 报错
  • html5+css3+canvas纯前端4字方形LOGO生成器
  • 【C# in .NET】17. 探秘类成员-构造函数与析构函数:对象生命周期管理
  • Beagle 480 USB分析仪
  • 差分数组算法
  • 柴油机活塞cad【4张】三维图+设计说明书
  • ollma dify 搭建合同审查助手
  • RabbitMQ—TTL、死信队列、延迟队列
  • ChatGPT Agent技术架构探析
  • 读书笔记(学会说话)
  • 变频器实习总结3 ISU单元 船舶电力系统
  • 锁步核,为什么叫锁步核?
  • jar命令提取 JAR 文件
  • AI 驱动的仪表板:从愿景到 Kibana
  • MySQL之SQL 优化全攻略:从原理到实战
  • 2025年华为认证之HCIE-云计算方向的报考流程