0
  • 聊天消息
  • 系统消息
  • 评论与回复
登录后你可以
  • 下载海量资料
  • 学习在线课程
  • 观看技术视频
  • 写文章/发帖/加入社区
会员中心
创作中心

完善资料让更多小伙伴认识你,还能领取20积分哦,立即完善>

3天内不再提示

【AWTK开源智能串口屏方案】HMI端程序移植编译及运行

ZLG致远电子 2024-01-18 08:24 次阅读

本篇文章介绍一下AWTK开源智能串口屏方案的串口屏端(即HMI端)的编译运行步骤,并介绍如何将HMI端移植到LinuxSTM32平台或RTOS平台,以及如何配置资源文件。

引言:AWTK-HMI是基于AWTK与AWTK-MVVM开发的低代码智能串口屏方案,本系列文章介绍如何从零开发HMI程序,包括搭建开发环境、创建HMI运行时工程、修改应用界面以及开发MCU程序。

上一篇文章《【AWTK开源智能串口屏方案】方案介绍和工作原理》介绍到HMI端工程(又称为运行时)运行在串口屏硬件上,负责界面显示和人机交互,用户可替换里面的资源文件切换为不同的应用。它是支持跨平台且不受硬件和系统限制的,本篇文章就来介绍一下如何将HMI端分别编译到Windows、Linux平台和STM32中。

ec639208-b597-11ee-aa22-92fbcf53809c.png

图1 AWTK-HMI工作原理

在Windows上编译HMI端程序

编译串口屏程序很简单,只需几个步骤即可。首先确保电脑上安装好了AWTK的开发环境,若没有可以看往期文章教程《【从0开始创建AWTK应用程序】开发及调试环境搭建》。

从官方的Gitee(网址:gitee.com/zlgopen/awtk-hmi)下载awtk-hmi仓库到本地目录,并根据README.md文档内的使用说明运行“prepare.bat”下载awtk与awtk-mvvm代码文件。

ec67832c-b597-11ee-aa22-92fbcf53809c.png

图2执行prepare.bat后的目录结构

接着进入hmi/demo_home2目录,输入scons命令编译HMI端的demo程序,并输入下面的命令打包资源文件:

python ./scripts/update_res.py all

此时demo_hom2目录下分别新增了bin和res两个文件夹:bin目录下是存放HMI端存放编译后的可执行文件与动态库;res则是存放运行时的资源文件,后期可以通过AWStudio设计新的界面替换res目录的资源文件达到更新运行时UI界面的效果。

进入到bin目录下运行demo.exe即可启动编译好的HMI端程序。

ec6b6c80-b597-11ee-aa22-92fbcf53809c.png

图3 HMI端demo程序运行效果


移植HMI端程序到嵌入式Linux平台

将Windows下载好的awtk-hmi目录复制到Ubuntu交叉编译环境中,并且在awtk-hmi目录下载awtk-linux-fb移植层文件,最终awtk-hmi目录结构如下图:ec77a5d6-b597-11ee-aa22-92fbcf53809c.png

图4 awtk-hmi交叉编译目录结构

首先进入到awtk-linux-fb配置好交叉编译工具链路径(具体配置教程可以看往期文章介绍《【从0开始创建AWTK应用程序】编译应用到嵌入式Linux平台运行》),配置好后输入scons命令进行编译。接着进入awtk-mvvm目录,输入下面的命令进行编译。

scons LINUX_FB=true WITH_JERRYSCRIPT=false

回到awtk-linux-fb目录并输入下面第一条scons命令编译HMI应用程序,编译完成后接着输入下面第二条命令发布应用。

scons APP=../demo_home2sh release.sh ../demo_home2/res demo

此时awtk-linux-fb目录下会生成一个release文件夹,里面同样包含了可执行文件目录bin和资源文件目录assets,后期可以通过AWStudio设计新的界面替换assets目录文件达到更新运行时UI界面效果。最后,只需要将release文件夹拷贝到板子上并运行release/bin目录下的demo程序即可。

移植HMI端程序到STM32平台

这里以stm32h743开发为例子来介绍如何将HMI程序移植到STM32平台,awtk-hmi自带了一个stm32h743移植工程,所以整个移植流程比较方便。首先同样需要将awtk、awtk-mvvm放到awtk-hmi目录中,另外还需要运行下面两条git命令下载awtk-fs-adapter和awtk-sqlite3。

ec7b938a-b597-11ee-aa22-92fbcf53809c.png

图 5 AWTK-HMI移植STM32的目录结构

接着使用keil打开hmi/awtk-stm32h743iitx-freertos/USER/awtk.uvprojx,点击Build按钮并等待编译完成,可以看到以下信息ec7fc7ac-b597-11ee-aa22-92fbcf53809c.png图6 stm32h743移植工程在keil上编译成功的信息

一般HMI端代码和资源文件是分开的,因此还需要将资源文件目录assets放到SD卡或U盘等形式,插入板子上使用文件系统来读取。后期也能通过AWStudio设计新的界面替换该目录达到更新运行时UI界面效果。
如果资源文件想要存放在SD卡中,需要让 AWTK 支持 FATFS,并且通过awtk_config.h配置资源文件路径,详细操作可以阅读下面目录的移植文档说明:

awtk-hmi/mcu/stm32/stm32h743-freertos/docs/stm32h743iitx_port.md

ec8388ec-b597-11ee-aa22-92fbcf53809c.png

图7 awtk_config.h配置资源文件路径

其它硬件平台和RTOS移植方法也是大同小异的,可以从官方的Github下载对应的移植工程,参照stm32h743的移植工程在keil中添加所需的代码文件(awtk、awtk-mvvm、hmi等)并配置awtk_config.h。

声明:本文内容及配图由入驻作者撰写或者入驻合作网站授权转载。文章观点仅代表作者本人,不代表电子发烧友网立场。文章及其配图仅供工程师学习之用,如有内容侵权或者其他违规问题,请联系本站处理。 举报投诉
  • 开源
    +关注

    关注

    3

    文章

    3335

    浏览量

    42483
  • 编译
    +关注

    关注

    0

    文章

    657

    浏览量

    32867
  • 串口屏
    +关注

    关注

    8

    文章

    532

    浏览量

    37426
收藏 人收藏

    评论

    相关推荐

    基于AWTK推出的ZMP110x串口应用方案

    串口广泛应用于工业自动化、智能家电、医疗设备、共享设备等各个显示领域。立功科技基于AWTK推出的ZMP110x串口
    发表于 07-25 17:16 1229次阅读

    AWTK 开源智能串口方案

    AWTK开源智能串口方案发布,旨在解决传统串口
    的头像 发表于 12-02 08:24 953次阅读
    <b class='flag-5'>AWTK</b> <b class='flag-5'>开源</b><b class='flag-5'>智能</b><b class='flag-5'>串口</b><b class='flag-5'>屏</b><b class='flag-5'>方案</b>

    【从0开始创建AWTK应用程序编译应用到嵌入式Linux平台运行

    AWTK是基于C语言开发的跨平台GUI框架。本系列文章介绍如何从0开始创建AWTK应用程序,包括搭建开发调试环境、使用AWTK创建Hello工程并在模拟器上
    的头像 发表于 12-07 12:08 707次阅读
    【从0开始创建<b class='flag-5'>AWTK</b>应用<b class='flag-5'>程序</b>】<b class='flag-5'>编译</b>应用到嵌入式Linux平台<b class='flag-5'>运行</b>

    AWTK 串口开发(1) - Hello World

    本文以一个简单的温度设置程序为例,介绍AWTK串口的开发流程和MVVM数据绑定的基本方法。功能这个例子很简单,制作一个调节温度的界面。在这里例子中,模型(也就是数据)里只有一个温度变
    的头像 发表于 12-08 15:52 505次阅读
    <b class='flag-5'>AWTK</b> <b class='flag-5'>串口</b><b class='flag-5'>屏</b>开发(1) - Hello World

    ​【AWTK开源智能串口方案方案介绍和工作原理

    串口方案,本系列文章介绍如何从零开发HMI程序,包括搭建开发环境、创建HMI
    的头像 发表于 12-21 08:24 992次阅读
    ​【<b class='flag-5'>AWTK</b><b class='flag-5'>开源</b><b class='flag-5'>智能</b><b class='flag-5'>串口</b><b class='flag-5'>屏</b><b class='flag-5'>方案</b>】<b class='flag-5'>方案</b>介绍和工作原理

    AWTK 串口开发(3) - 告警信息

    告警信息是一个常用的功能。在AWTK开源串口中,内置告警信息模型,只需设计用户界面即可实现告警信息的显示和管理。1.功能告警信息是一个常用的功能,MCU在设备异常时,会发送告警信息到
    的头像 发表于 12-23 08:24 449次阅读
    <b class='flag-5'>AWTK</b> <b class='flag-5'>串口</b><b class='flag-5'>屏</b>开发(3) - 告警信息

    AWTK 串口开发(5) - MCU SDK 用法

    AWTK开源智能串口,不但开放了串口
    的头像 发表于 01-06 08:24 429次阅读
    <b class='flag-5'>AWTK</b> <b class='flag-5'>串口</b><b class='flag-5'>屏</b>开发(5) - MCU<b class='flag-5'>端</b> SDK 用法

    AWTK 开源串口开发(6) - 定时器的用法

    定时器是个常用的功能,AWTK串口提供了丰富的定时器函数,用于定时器的启动、停止、暂停、恢复、修改和重置等功能,本文以计时器的例子来介绍定时器的基本用法。定时器也是一个常用的功能,在AWTK
    的头像 发表于 01-13 08:24 573次阅读
    <b class='flag-5'>AWTK</b> <b class='flag-5'>开源</b><b class='flag-5'>串口</b><b class='flag-5'>屏</b>开发(6) - 定时器的用法

    AWTK开源智能串口方案】MCU SDK使用与编译运行

    代码智能串口方案,本系列文章介绍如何从零开发HMI程序,包括搭建开发环境、创建
    的头像 发表于 02-19 12:11 1208次阅读
    【<b class='flag-5'>AWTK</b><b class='flag-5'>开源</b><b class='flag-5'>智能</b><b class='flag-5'>串口</b><b class='flag-5'>屏</b><b class='flag-5'>方案</b>】MCU SDK使用与<b class='flag-5'>编译</b><b class='flag-5'>运行</b>

    AWTK开源智能串口方案】设计UI界面并上传到串口

    本篇文章将介绍如何使用AWStudio设计串口的UI界面和添加绑定规则,以及怎么将资源文件上传到串口
    的头像 发表于 02-22 08:24 718次阅读
    【<b class='flag-5'>AWTK</b><b class='flag-5'>开源</b><b class='flag-5'>智能</b><b class='flag-5'>串口</b><b class='flag-5'>屏</b><b class='flag-5'>方案</b>】设计UI界面并上传到<b class='flag-5'>串口</b><b class='flag-5'>屏</b>

    AWTK 开源串口开发(12) - 记事本应用

    记事本是一个常用的应用程序,在AWTK串口中,内置文件模型和文件选择对话框,无需编写一行传统的代码,即可实现一个简单的记事本应用程序。记事
    的头像 发表于 03-09 08:23 352次阅读
    <b class='flag-5'>AWTK</b> <b class='flag-5'>开源</b><b class='flag-5'>串口</b><b class='flag-5'>屏</b>开发(12) - 记事本应用

    【从0开始创建AWTK应用程序编译应用到RTOS平台

    AWTK是基于C语言开发的跨平台GUI框架。本系列文章介绍如何从0开始创建AWTK应用程序,包括搭建开发调试环境、使用AWTK创建Hello工程并在模拟器上
    的头像 发表于 03-21 08:23 612次阅读
    【从0开始创建<b class='flag-5'>AWTK</b>应用<b class='flag-5'>程序</b>】<b class='flag-5'>编译</b>应用到RTOS平台

    AWTK 开源串口开发(16) - 提供 MODBUS 服务

    AWTK串口内置MODBUS从站模型,不用编写一行代码即可让串口提供MODBUS服务,让远程设备通过MODBUS协议访问
    的头像 发表于 04-13 08:24 452次阅读
    <b class='flag-5'>AWTK</b> <b class='flag-5'>开源</b><b class='flag-5'>串口</b><b class='flag-5'>屏</b>开发(16) - 提供 MODBUS 服务

    【插针机HMI开发】用AWTK开发人机界面

    AWTK介绍致远电子的AWTK开源GUI引擎,提供了AWTK-C、AWTK-MVVM和AWTK-HMI
    的头像 发表于 04-19 08:23 569次阅读
    【插针机<b class='flag-5'>HMI</b>开发】用<b class='flag-5'>AWTK</b>开发人机界面

    AWTK 开源串口开发(17) - 通过 MODBUS 访问数组数据

    AWTK串口中,内置MODBUS客户通道模型,不用编写代码即可实现在ListView中显示远程设备上的数组数据。1.功能不用编写代码,实现对远程设备上数组数据的显示。2.创建项目
    的头像 发表于 04-29 08:25 345次阅读
    <b class='flag-5'>AWTK</b> <b class='flag-5'>开源</b><b class='flag-5'>串口</b><b class='flag-5'>屏</b>开发(17) - 通过 MODBUS 访问数组数据