使用LVGL提升交互效率：基于启明智显Model3A方案的7寸智能屏用户界面(UI)设计介绍

2024-04-20 05:52
文章标签 设计 使用 介绍 ui 智能 提升 交互 效率 方案 lvgl 用户界面 明智 model3a

本文主要是介绍使用LVGL提升交互效率：基于启明智显Model3A方案的7寸智能屏用户界面(UI)设计介绍，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

项目概述：

【启明智显】，作为一家专注于HMI和AIoT解决方案的公司，我们致力于为用户提供创新、可靠且高效的产品和解决方案。近日我们推出了高性能及高性价比的HMI芯片——Model3A。芯片搭载了强大的2D图形加速引擎，能够提供高达720P分辨率下的60FPS刷新率，确保流畅的动态画面表现。此外，它内置了8MB的psram，为复杂的图形处理提供了充足的缓冲空间。

随着这款芯片的推出，启明智显还搭配发布了一款7寸1024*600分辨率的一体黑高清触控智能屏。支持多种接口CAN/RS485/TTL等，工业级品质，智能触控新体验！

为了最大化利用Model3A芯片的性能优势，同时考虑到开发效率和成本效益，启明智显开源了基于LVGL的屏幕驱动，选择LVGL进行用户界面的开发主要是LVGL是一个流行的开源图形库，它以轻量级著称，特别适合嵌入式系统。它可以使得用户界面运行更加流畅，且不会对系统性能产生较大负担。

选择LVGL的另一个重要因素是其开源生态系统。拥有一个活跃的社区和广泛的文档支持，开发者可以迅速上手学习并掌握LVGL的使用。这不仅可以加快开发进度，还能促进知识的交流和技术的创新。

LVGL库简介：

LVGL是一款最受欢迎的免费开源的嵌入式图形库，用于为任何MCU、MPU和显示器创建漂亮的用户界面。它得到了业界领先的供应商和项目的支持，如Arm、STM32、NXP、Espressif、Nuvoton、Arduino、RT-Thread、Zephyr、NuttX、Adafruit等。

LVGL的架构非常灵活和可配置。它采用了模块化设计，可以根据需求通过添加或删除功能模块来定制库的大小。LVGL内置了丰富的组件，包括按钮、标签、列表、滑动条等，还支持动画、图像、字体、颜色等各种属性的自定义。

LVGL可以与各种嵌入式系统、MCU和显示器一起使用，如NXP、ESP32及启明智显的Model3A系列等。它提供了针对不同平台的适配层和驱动程序，可以与各种显示器技术（如TFT、OLED、LCD等）和操作系统（如FREERTOS、RT-Thread）无缝集成。

烧录到7寸触控屏(ZX7D00CM21S)的真实效果呈现

LVGL因其丰富的功能和灵活性而成为嵌入式系统开发的理想选择,它能够帮助开发者在不牺牲性能的前提下创造出具有吸引力的用户界面，同时降低开发难度和加快市场上市时间。

烧录到3.5寸触控屏（SC01PLUS）的真实效果呈现

LVGL功能特点：
1. 跨平台支持：
  •    LVGL设计上考虑了跨平台兼容性，它支持各种操作系统和硬件架构。这意味着开发者可以在多个不同的嵌入式平台上使用相同的代码基和UI设计理念，从而节省时间和资源。例如，在ESP32微控制器或启明智显的Model3A系列等不同硬件上，LVGL都可以无缝集成。
2. 美观的用户界面：
  •    LVGL提供了一系列的预定义组件如按钮、滑块、列表和图表等，以及多种内置主题风格。这些开箱即用的元素使得创建专业和吸引人的用户界面变得简单快捷。同时，它还支持位图字体和矢量字体，允许开发者根据项目需求灵活地调整UI外观。
3. 低内存占用：
  •    由于其轻量级的设计，LVGL特别适合那些内存资源有限的嵌入式设备。核心库的大小可以小至几十千字节，同时它支持动态内存管理，可以根据应用程序的实际需求进行内存分配和释放。
4. 高性能绘制：
  •    LVGL针对绘图性能进行了高度优化，如它可以利用Model3A这颗MCU的2D加速功能来提高渲染速度，并确保即使在更新率较高的场合下也能保持流畅的用户体验。
5. 易于定制和扩展：
  •    LVGL的模块化架构使得它可以非常容易地进行定制和扩展。开发者可以通过创建自己的样式表来改变现有组件的外观，或者通过添加新的对象和功能来扩展库的功能。这种灵活性意味着LVGL可以适应任何特定项目的需要，从简单的仪表盘到复杂的多功能触控屏界面。
应用领域：

LVGL（Light and Versatile Graphics Library）由于其轻量级、高性能和易于使用的特点，在各种嵌入式系统中有着广泛的应用。

1. 工业控制：
  •    在工业自动化中，LVGL可以用于创建高效且直观的触摸屏界面，帮助操作人员轻松控制和监视机器状态，实现更好的人机交互体验。
2.家用电器：
  •    对于智能家电产品，LVGL能够提供美观且用户友好的界面，如在智能音箱上显示信息，或在智能家居中控控制面板上提供触控操作界面。
3. 医疗设备：
  •    在医疗领域，LVGL可以用于设计医疗器械的用户界面，使设备易于操作并确保患者数据清晰展示，例如在内窥镜、监护仪和血压计等设备上的应用。
4. 汽车嵌入式系统：
  •    随着车载技术的不断发展，LVGL适用于开发汽车信息娱乐系统和车载导航系统的用户界面，提供响应迅速且视觉吸引的驾驶体验。
5. 物联网设备：
  •    物联网设备的多样性要求用户界面既小巧又功能强大，LVGL可以轻松集成到如智能手表、智能门锁等设备中，提供简洁而直观的操作界面。
6. 智能家居设备：
  •    在智能家居系统中，LVGL可以帮助构建集中控制各个家居子系统（照明、安防、温控等）的统一界面，提升用户操作便利性和居家舒适度。
7. 两轮车仪表、中控屏、机车仪表设备：
  •    对于摩托车和电动自行车等两轮车辆，LVGL可以应用于仪表盘和中控屏的图形界面设计，提供速度、电池电量和其他关键信息的实时显示，同时优化驾驶者的操作体验。

M3A方案的7寸触摸智能屏UI开发LVGL使用说明及DEMO：

使能LVGL库：

在 ZX-RTT根目录下执行 scons --menuconfig，进入 menuconfig 的功能配置界面，配置如下：

Application options  --->*** Filesystem related ***[*] Using File System Image 0  --->--- Using File System Image 0Select File System Type (FATFS)  --->(application/os/custdemo/assets/fatfs/) Data Directory(app.fatfs) Image Name[*] auto calcuate image size[*] Using File System Image 1  ----Select File System Type (LittleFS)  --->(application/os/custdemo/assets/littlefs/) Data Directory(data.lfs) Image Name(4096) Erase block size(256) Page size[ ] ZX lvgl benchmark demo  ----[ ] ZX freetype demo  ----[ ] ZX 3D95 demo  ----[ ] ZX CUST demo  ----[*] ZX lvgl widgets demo  ----
目前LVGL demo提供了多个示例，只能多选一：

  1. lvgl benchmark demo和lvgl widgets demo为LVGL官方demo，主要用作性能测试;

  2. freetype demo为字库文件取模演示，当选中的时候，需要修改Using File System Image 0中的图片资源文件路径为： application/os/freetype/res/font;

  3. 3D95 demo为86盒演示demo，需要修改Using File System Image 0中的图片资源文件路径为： application/os/ZX3D95/assets;

  4. CUST demo为用作demo替换，简化UI移植过程

根目录下有四个挂载点
/ram        --ramfs文件系统，对应Using File System Image 0中Data Directory中的资源文件
/data       --挂载nor/nand文件系统，对应Using File System Image 1中Data Directory中的资源文件文件
/sdcard     --挂载SD卡
/udisk      --挂载U盘

调试指南

资源文件路径

lvgl demo可以通过设置宏定义来修改读取文件的目录

#define LVGL_DATA_PATH "L:/data/"       // 从/data目录读取资源图片
#define LVGL_DATA_PATH "L:/sdcard/"     // 从/sdcard目录读取资源图片
#define LVGL_DATA_PATH "L:/udisk/"      // 从/udisk目录读取资源图片
缓存图片张数

图片缓存, 通过宏定义CACHE_IMG_NUM配置, 配置定义于 zx-rtt-sdk/packages/third-party/lvgl/Kconfig, 也可在zx-rtt-sdk/packages/third-party/lvgl/lvgl-8.3.10/zx/zx_gui.c文件中修改

#define CACHE_IMG_NUM 15lv_init();
zx_port_disp_init();
zx_port_indev_init();
lv_img_cache_set_size(CACHE_IMG_NUM);
aic_dec_create();

测试指南

测试环境
硬件

  • 带屏的设备

  • USB Type-C数据线，用于设备供电，以及烧写固件

  • 调试串口

软件

  • PC端串口终端软件，用于串口通信

  • PanelLanDownloader烧写工具，用于烧写固件

软件配置
VE 驱动

请见 VE 参数配置

MPP 中间件

请见 MPP 参数配置

DE 驱动

请见 DE 参数配置 

运行测试DEMO

  • 配置编译任意一个lvgl demo(使能LVGL库和LVGL demo)

  • 在zx-rtt/application/os/$app/main.c中会调用INIT_APP_EXPORT开机自动运行

这篇关于使用LVGL提升交互效率：基于启明智显Model3A方案的7寸智能屏用户界面(UI)设计介绍的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！


http://www.chinasem.cn/article/919438。

相关文章

C语言中联合体union的使用

C语言中联合体union的使用

本文编辑整理自： http://bbs.chinaunix.net/forum.php?mod=viewthread&tid=179471 一、前言 “联合体”(union）与“结构体”(struct)有一些相似之处。但两者有本质上的不同。在结构体中,各成员有各自的内存空间, 一个结构变量的总长度是各成员长度之和。而在“联合”中,各成员共享一段内存空间, 一个联合变量
阅读更多...
揭秘未来艺术：AI绘画工具全面介绍

揭秘未来艺术：AI绘画工具全面介绍

📑前言 随着科技的飞速发展，人工智能（AI）已经逐渐渗透到我们生活的方方面面。在艺术创作领域，AI技术同样展现出了其独特的魅力。今天，我们就来一起探索这个神秘而引人入胜的领域，深入了解AI绘画工具的奥秘及其为艺术创作带来的革命性变革。 一、AI绘画工具的崛起 1.1 颠覆传统绘画模式 在过去，绘画是艺术家们通过手中的画笔，蘸取颜料，在画布上自由挥洒的创造性过程。然而，随着AI绘画工
阅读更多...
Tolua使用笔记（上）

Tolua使用笔记（上）

目录   1.准备工作 2.运行例子 01.HelloWorld：在C#中，创建和销毁Lua虚拟机 和 简单调用。 02.ScriptsFromFile：在C#中，对一个lua文件的执行调用 03.CallLuaFunction：在C#中，对lua函数的操作 04.AccessingLuaVariables：在C#中，对lua变量的操作 05.LuaCoroutine：在Lua中，
阅读更多...
uniapp接入微信小程序原生代码配置方案（优化版）

uniapp接入微信小程序原生代码配置方案（优化版）

uniapp项目需要把微信小程序原生语法的功能代码嵌套过来，无需把原生代码转换为uniapp，可以配置拷贝的方式集成过来 1、拷贝代码包到src目录 2、vue.config.js中配置原生代码包直接拷贝到编译目录中 3、pages.json中配置分包目录，原生入口组件的路径 4、manifest.json中配置分包，使用原生组件 5、需要把原生代码包里的页面修改成组件的方
阅读更多...
Vim使用基础篇

Vim使用基础篇

本文内容大部分来自 vimtutor，自带的教程的总结。在终端输入vimtutor 即可进入教程。 先总结一下，然后再分别介绍正常模式，插入模式，和可视模式三种模式下的命令。 目录 看完以后的汇总 1.正常模式（Normal模式） 1.移动光标 2.删除 3.【:】输入符 4.撤销 5.替换 6.重复命令【. ; ,】 7.复制粘贴 8.缩进 2.插入模式 INSERT
阅读更多...
Lipowerline5.0 雷达电力应用软件下载使用

Lipowerline5.0 雷达电力应用软件下载使用

1.配网数据处理分析 针对配网线路点云数据，优化了分类算法，支持杆塔、导线、交跨线、建筑物、地面点和其他线路的自动分类；一键生成危险点报告和交跨报告；还能生成点云数据采集航线和自主巡检航线。 获取软件安装包联系邮箱:2895356150@qq.com，资源源于网络，本介绍用于学习使用，如有侵权请您联系删除！ 2.新增快速版，简洁易上手 支持快速版和专业版切换使用，快速版界面简洁，保留主
阅读更多...
如何免费的去使用connectedpapers？

如何免费的去使用connectedpapers？

免费使用connectedpapers 1. 打开谷歌浏览器2. 按住ctrl+shift+N,进入无痕模式3. 不需要登录（也就是访客模式）4. 两次用完，关闭无痕模式（继续重复步骤 2 - 4） 1. 打开谷歌浏览器 2. 按住ctrl+shift+N,进入无痕模式 输入网址：https://www.connectedpapers.com/ 3. 不需要登录（也就是
阅读更多...
20.Spring5注解介绍

20.Spring5注解介绍

1.配置组件 Configure Components 注解名称说明@Configuration把一个类作为一个loC容 器 ，它的某个方法头上如果注册7@Bean , 就会作为这个Spring容器中的Bean@ComponentScan在配置类上添加@ComponentScan注解。该注解默认会扫描该类所在的包下所有的配置类，相当于之前的 <context:component-scan>@Sc
阅读更多...
在线装修管理系统的设计

在线装修管理系统的设计

管理员账户功能包括：系统首页，个人中心，管理员管理，装修队管理，用户管理，装修管理，基础数据管理，论坛管理 前台账户功能包括：系统首页，个人中心，公告信息，论坛，装修，装修队 开发系统：Windows 架构模式：B/S JDK版本：Java JDK1.8 开发工具：IDEA(推荐) 数据库版本： mysql5.7 数据库可视化工具： navicat 服务器：SpringBoot自带 ap
阅读更多...
DDei在线设计器-API-DDeiSheet

DDei在线设计器-API-DDeiSheet

DDeiSheet   DDeiSheet是代表一个页签，一个页签含有一个DDeiStage用于显示图形。   DDeiSheet实例包含了一个页签的所有数据，在获取后可以通过它访问其他内容。DDeiFile中的sheets属性记录了当前文件的页签列表。   一个DDeiFile实例至少包含一个DDeiSheet实例。   本篇最后提供的示例可以在DDei文档直接预览 属性 属性名说明数
阅读更多...

Copyright China编程 23002807@qq.com

沪ICP备2023033072号-2