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

描述

本篇文章介绍一下AWTK 开源智能串口屏方案的基本原理和实际使用效果,包括主要特点、应用场景、工作原理以及简单的Demo演示。

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

 

AWTK开源智能串口屏方案简介

AWTK 开源智能串口屏方案(Gitee仓库地址:gitee.com/zlgopen/awtk-hmi),仓库包含了MCU端工程(含PC模拟器)、MCU SDK、HMI端工程(含PC模拟器)以及多个串口屏应用示例,并配有说明文档。

其中HMI端工程(又称为运行时)运行在串口屏硬件上,负责界面显示和人机交互,用户可替换里面的资源文件切换为不同的应用。MCU端工程则是用户自己的主控程序,通过调用MCU SDK的API,可以与HMI端通过串口或网口通信。MCU可以主动获取、设置串口屏的变量值,或接收串口屏的按键事件,实现双向交互。

开源

图 1 MCU端与串口屏端连接方式

1. 主要特点

1.1 HMI端

  • 开放源码,免费商用,从底层到应用程序全程可控;
  • 基于AWTK和AWTK-MVVM实现强大的 GUI 功能;
  • 强大的界面设计器 AWStudio,拖拽式开发所见即所得;
  • 界面设计与绑定数据(变量)简单,无需编写任何代码;
  • 支持通过串口更新UI资源,无需重新编译工程;
  • 支持在PC上模拟运行。

1.2 MCU端

  • 提供MCU SDK与HMI端通信,使用简单无需了解通信协议;
  • 只需使用三组函数:获取变量、设置变量、监视事件;
  • 无需指定物理地址,变量可用中文名;
  • 支持串口和TCP通信;
  • 提供MCU模拟器模拟与串口屏的交互。 

2. 应用场景

本方案假设有两类用户:串口屏厂商与普通用户。厂商把HMI端工程(运行时)烧写固化到串口屏硬件上;用户买到串口屏后,通过AWStudio开发自己的界面应用并把生成的资源文件替换到串口屏上,再开发自己的主控MCU程序,最后通过MCU SDK控制串口屏。

开源

图 2 使用AWStudio开发界面应用3. 工作原理

串口屏HMI工程实际上是一个AWTK+MVVM的程序(运行时),这个程序可以加载res文件夹的UI资源文件(UI-XML、字体、图片等),并显示在屏幕上。由于使用MVVM框架,界面上的可变内容可以绑定到特定的变量名。

串口屏作为通信服务端启动,而MCU端程序使用我们封装好的通信协议(MCU SDK),作为通信客户端与串口屏连接,之后就可以直接通过变量名进行交互。

开源图 3 工作原理后期用户如果想更新串口屏上的应用,直接用AWStudio设计新界面,打包替换res文件夹的资源文件然后重启串口屏即可,无需重新编译HMI工程。 

Demo演示

下面使用PC上的MCU模拟器和串口屏模拟程序来对AWTK-HMI的一些功能进行演示。

1. MCU获取串口屏事件

用户在串口屏上改变界面数据时,会自动将事件通知MCU端,如下图所示:

开源

图 4 串口屏界面改变自动通知MCU

2. MCU设置串口屏变量属性

在MCU中输入属性名称、属性类型和值再点击“设置属性”按钮即可看到串口屏界面中对应的属性改变,如下图所示:

开源图 5 MCU修改数据自动更新串口屏界面

3. 串口屏实机效果

下面是串口屏在实际板子上的运行效果,包括使用MCU操控串口屏界面以及手动操作串口屏界面两种方式:

开源图 6 串口屏实际上板演示

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

全部0条评论

快来发表一下你的评论吧 !

×
20
完善资料,
赚取积分