移植 SquareLine 导出的 UI 源码到 HMI-Board

2024-04-29 07:44

本文主要是介绍移植 SquareLine 导出的 UI 源码到 HMI-Board,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

目录

    • 准备工具
    • 创建 HMI 工程
    • 设计 UI
    • UI 移植
    • 板级验证
    • 更多内容

HMI-Board 为 RT-Thread 联合瑞萨推出的高性价比图形评估套件,取代传统的 HMI + 主控板 硬件,一套硬件即可实现 HMI + IoT + 控制 的全套能力。依托于瑞萨高性能芯片 RA6M3 及 RT-Thread 软件生态,HMI Board 不仅硬件性能强劲,同时软件生态丰富,助力开发者快速开发出 GUI 智能硬件产品。

本文介绍基于 LVGL,如何使用 SquareLine Studio 这款专业的 UI 设计软件快速设计 UI 界面,并导出源码、将其移植到 HMI-Board。

准备工具

  • SquareLine Studio
  • RT-Thread Sthdio

关于 SquareLine Studio 可以参考 基于 LVGL 使用 SquareLine Studio 快速设计 UI 界面,RT-Thread Sthdio 可以从 RT-Thread 官网 下载。

创建 HMI 工程

  • 打开 RT-Thread Sthdio,打开 SDK Manager,下载最新的 HMI-Board SDK 版本:

  • 使用 DAP-Link 下载调试,还需要下载最新的 PyOCD 资源包:

  • 基于 HMI-Board 开发板创建一个 LVGL 示例工程:

  • 构建工程、下载:

  • 默认运行的是 Music 示例 Demo:

设计 UI

  • 使用 SquareLine Studio 创建一个屏幕尺寸为 480×272 大小的工程,颜色深度为 16 bit:

  • 简单设计下 UI 界面:

  • 导出 UI 源码:

  • 查看导出的 UI 源码文件:

UI 移植

  • 在 HMI 工程 \board\lvgl\demo 目录下创建 ui 文件夹:

  • 复制导出的 UI 源码文件到 ui 文件夹:

  • 选中 HMI 工程按 F5 刷新即可看到 UI 源码文件已经添加到项目里:

  • 修改 lv_demo.c 文件,保存:

板级验证

  • 构建、下载、运行,一次就成功!

更多内容

  • CSDN博客:@Hello阿尔法
  • 哔哩哔哩:@Hello阿尔法
  • 知乎:@Hello阿尔法

这篇关于移植 SquareLine 导出的 UI 源码到 HMI-Board的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/945492

相关文章

SpringBoot集成EasyPoi实现Excel模板导出成PDF文件

《SpringBoot集成EasyPoi实现Excel模板导出成PDF文件》在日常工作中,我们经常需要将数据导出成Excel表格或PDF文件,本文将介绍如何在SpringBoot项目中集成EasyPo... 目录前言摘要简介源代码解析应用场景案例优缺点分析类代码方法介绍测试用例小结前言在日常工作中,我们经

WinForm跨线程访问UI及UI卡死的解决方案

《WinForm跨线程访问UI及UI卡死的解决方案》在WinForm开发过程中,跨线程访问UI控件和界面卡死是常见的技术难题,由于Windows窗体应用程序的UI控件默认只能在主线程(UI线程)上操作... 目录前言正文案例1:直接线程操作(无UI访问)案例2:BeginInvoke访问UI(错误用法)案例

SpringBoot+EasyPOI轻松实现Excel和Word导出PDF

《SpringBoot+EasyPOI轻松实现Excel和Word导出PDF》在企业级开发中,将Excel和Word文档导出为PDF是常见需求,本文将结合​​EasyPOI和​​Aspose系列工具实... 目录一、环境准备与依赖配置1.1 方案选型1.2 依赖配置(商业库方案)二、Excel 导出 PDF

SpringBoot+EasyExcel实现自定义复杂样式导入导出

《SpringBoot+EasyExcel实现自定义复杂样式导入导出》这篇文章主要为大家详细介绍了SpringBoot如何结果EasyExcel实现自定义复杂样式导入导出功能,文中的示例代码讲解详细,... 目录安装处理自定义导出复杂场景1、列不固定,动态列2、动态下拉3、自定义锁定行/列,添加密码4、合并

VS配置好Qt环境之后但无法打开ui界面的问题解决

《VS配置好Qt环境之后但无法打开ui界面的问题解决》本文主要介绍了VS配置好Qt环境之后但无法打开ui界面的问题解决,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要... 目UKeLvb录找到Qt安装目录中designer.UKeLvBexe的路径找到vs中的解决方案资源

Mac备忘录怎么导出/备份和云同步? Mac备忘录使用技巧

《Mac备忘录怎么导出/备份和云同步?Mac备忘录使用技巧》备忘录作为iOS里简单而又不可或缺的一个系统应用,上手容易,可以满足我们日常生活中各种记录的需求,今天我们就来看看Mac备忘录的导出、... 「备忘录」是 MAC 上的一款常用应用,它可以帮助我们捕捉灵感、记录待办事项或保存重要信息。为了便于在不同

8种快速易用的Python Matplotlib数据可视化方法汇总(附源码)

《8种快速易用的PythonMatplotlib数据可视化方法汇总(附源码)》你是否曾经面对一堆复杂的数据,却不知道如何让它们变得直观易懂?别慌,Python的Matplotlib库是你数据可视化的... 目录引言1. 折线图(Line Plot)——趋势分析2. 柱状图(Bar Chart)——对比分析3

MySQL Workbench工具导出导入数据库方式

《MySQLWorkbench工具导出导入数据库方式》:本文主要介绍MySQLWorkbench工具导出导入数据库方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝... 目录mysql Workbench工具导出导入数据库第一步 www.chinasem.cn数据库导出第二步

Java如何根据word模板导出数据

《Java如何根据word模板导出数据》这篇文章主要为大家详细介绍了Java如何实现根据word模板导出数据,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... pom.XML文件导入依赖 <dependency> <groupId>cn.afterturn</groupId>

QT6中绘制UI的两种方法详解与示例代码

《QT6中绘制UI的两种方法详解与示例代码》Qt6提供了两种主要的UI绘制技术:​​QML(QtMeta-ObjectLanguage)​​和​​C++Widgets​​,这两种技术各有优势,适用于不... 目录一、QML 技术详解1.1 QML 简介1.2 QML 的核心概念1.3 QML 示例:简单按钮