【LVGL】GUI神器 NXP GUI GUIDER开发工具入门教程

好记性不如烂笔头,既然不够聪明,就乖乖的做笔记,温故而知新。

本文档用于本人对知识点的梳理和记录

目录

一、前言

二、下载

三、演示

四、字体和图片/动画等资源

五、总结


一、前言

GUI Guider是恩智浦为LVGL开发了一个上位机GUI设计工具,可以通过拖放控件的图形化设计方式开发LVGL GUI页面,加速GUI的设计。

相比LVGL官方推出的付费工具 SquareLine Studio ,GUI Guider完全免费,它们甚至开发页面的布局都类似,但两者功能上,GUI Guider也相应的没有SquareLine Studio 细致和丰富,希望NXP能持续的优化更新

GUI Guider工具完成的GUI设计可在PC端仿真运行,实现无硬件开发,通过仿真调试完成后,可快速方便的整合到MCU的工程中。

本文将演示如何创建GUI项目并介绍生成的项目目录文件功能,移植整合到MCU工程将在下一篇博客中分享。

二、下载

NXP GUI Guider官方下载链接:最新版本可在此下载

本教程示例工程下载链接:

示例工程

三、演示

演示版本:GUI Guider 1.3.1

创建新项目或者打开一个已创建的项目,这里以创建新项目为例;

b47c2b3aeb094d338809ae1fcf27deda.png

选择LVGL的版本,这里以V7为例;

e660a84a96c2401ba139840c097f3242.png

这里是选择模板:

1:公用模板,第三方的MCU一般可选择此类

2:基于NXP i.MX系列的示例模板

3:基于NXP LPC低功耗系列的示例模板;

选择好模板后,然后点击下一布

94002e6d95c148e8ad74e106a2f71bc4.png

这里是选择应用模板

1:是公用模板,包括空模板以及一些示例模板

2:是本地模板,可以选择已经在开发的项目模板

3:选择好应用模板后点击下一步

e2581ef6824a4de49b5846d48841f97b.png

这里是项目配置

1:工程名称

2:存放工程的路径选择

3:画布分辨率的选择

4:画布色彩深度的选择,常见的小屏16bit比较多

d03382fb53164440ad9ebad8d1894f6d.png

至此,一个工程已创建完毕,此时画面会切换到开发界面

1:功能性控件区,可以拖放到画布上面

2:控件组件区,可以很方便的管理画布上的控件

3:控件属性设置以及事件管理,和系统设置

4:工具栏

5:开发完成后,点击绿色按钮生成并仿真工程

6:点击生成的语言类型,公共模板只支持C语言,NXP专用模板支持种类更丰富,不过一般不用

b68b3f9fc9674d8ca7d77400ce79f46d.png

仿真器运行后的效果,注意,仿真器运行需要JAR支持,因此,需要安装JAVA JRE

dd3885d76ab74e43983c26b0af6a316d.png

此时可以在存放工程的路径目录中看到生成的代码

重要的文件已如图示列出了作用 ,下次有空再写一篇怎么移植到MCU的工程中运行;382ed168e13b49fbb909ac4f5cf8c58f.png

四、字体和图片/动画等资源

导入图片资源

1:点击导入切换到资源界面

2:点击选择资源路径导入资源

3:已导入的资源显示在这里,当工程中需要插入图片时,可以看到已导入的资源

5119e200431a4e479b0f3ca893fbb2d8.png

字体

1:点击文件

2:点击导入字体,可以选择磁盘上需要导入的字体文件

7aaa0b8c5fa04fe087d718923107bb4b.png

 点击生成字体可以将已支持的字体生成HEX文件,方便MCU成功引用,当然GUI工程中已添加的字体文件不需要手动生成

2c5f80347c644ccb9b8cbc8336eec9a7.png

d0da2a0bb05843f98e761436e48c89ab.png

 最终生成的字体文件,可以在存放路径下的“guider_customer_fonts”中看到,如下图

5d36e01b7e004127921adb3d36487a66.png

五、总结

NXP GUI Guider工具操作简单,大大降低了GUI的开发难度,而且移植方便,具备通用性,个人很喜欢使用这个工具,目前最新版本的已经到1.6,细节上优化很多,但总体开发流程变化不大。

lvgl nxp gui guider 1.6是一个用于NXP微控制器的图形用户界面(GUI)开发工具LVGL(轻量级嵌入式图形库)是一款开源的GUI库,可以在各种嵌入式设备上创建美观且功能丰富的用户界面NXP GUI Guider是一个可视化的GUI设计工具,可以通过简单的拖放操作来设计和生成LVGL GUI界面。 使用LVGL NXP GUI Guider 1.6可以轻松快速地开发出专业水平的GUI界面。它提供了丰富的内置控件,如按钮、文本框、进度条、滑块等,用户可以根据自己的需求进行定制和扩展。此外,它还支持动画效果、多语言支持和主题切换等功能,使得界面更加丰富多样。 利用该工具,开发人员只需通过简单的拖放操作就可以设计和布局界面元素,并直接在编辑器中进行预览和调试。同时,可以通过代码生成器自动生成所需的LVGL C代码,方便集成进项目中。这样,开发人员可以更专注于业务逻辑或者其他核心功能的实现,提高开发效率。 此外,LVGL NXP GUI Guider 1.6还支持与其他开发工具的集成,如NXP MCUXpresso IDE和RTCS库等。这样,开发者可以在一个完整的开发环境中进行GUI开发,并且可以更好地与其他系统组件进行集成和交互。 总之,LVGL NXP GUI Guider 1.6是一个强大且易用的GUI开发工具,能够帮助开发者快速创建出高效、美观的GUI界面,并且与NXP微控制器的生态系统完美集成,提高开发效率。
评论 6
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

黑色HS

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值