本篇文章介紹一下AWTK開源智能串口屏方案的串口屏端(即HMI端)的編譯運行步驟,并介紹如何將HMI端移植到Linux或STM32平臺或RTOS平臺,以及如何配置資源文件。
引言:AWTK-HMI是基于AWTK與AWTK-MVVM開發(fā)的低代碼智能串口屏方案,本系列文章介紹如何從零開發(fā)HMI程序,包括搭建開發(fā)環(huán)境、創(chuàng)建HMI運行時工程、修改應(yīng)用界面以及開發(fā)MCU程序。
上一篇文章《【AWTK開源智能串口屏方案】方案介紹和工作原理》介紹到HMI端工程(又稱為運行時)運行在串口屏硬件上,負責(zé)界面顯示和人機交互,用戶可替換里面的資源文件切換為不同的應(yīng)用。它是支持跨平臺且不受硬件和系統(tǒng)限制的,本篇文章就來介紹一下如何將HMI端分別編譯到Windows、Linux平臺和STM32中。
圖1 AWTK-HMI工作原理
在Windows上編譯HMI端程序
編譯串口屏程序很簡單,只需幾個步驟即可。首先確保電腦上安裝好了AWTK的開發(fā)環(huán)境,若沒有可以看往期文章教程《【從0開始創(chuàng)建AWTK應(yīng)用程序】開發(fā)及調(diào)試環(huán)境搭建》。
從官方的Gitee(網(wǎng)址:gitee.com/zlgopen/awtk-hmi)下載awtk-hmi倉庫到本地目錄,并根據(jù)README.md文檔內(nèi)的使用說明運行“prepare.bat”下載awtk與awtk-mvvm代碼文件。
圖2執(zhí)行prepare.bat后的目錄結(jié)構(gòu)
接著進入hmi/demo_home2目錄,輸入scons命令編譯HMI端的demo程序,并輸入下面的命令打包資源文件:
python ./scripts/update_res.py all
此時demo_hom2目錄下分別新增了bin和res兩個文件夾:bin目錄下是存放HMI端存放編譯后的可執(zhí)行文件與動態(tài)庫;res則是存放運行時的資源文件,后期可以通過AWStudio設(shè)計新的界面替換res目錄的資源文件達到更新運行時UI界面的效果。
進入到bin目錄下運行demo.exe即可啟動編譯好的HMI端程序。
圖3 HMI端demo程序運行效果
移植HMI端程序到嵌入式Linux平臺
將Windows下載好的awtk-hmi目錄復(fù)制到Ubuntu交叉編譯環(huán)境中,并且在awtk-hmi目錄下載awtk-linux-fb移植層文件,最終awtk-hmi目錄結(jié)構(gòu)如下圖:![ec77a5d6-b597-11ee-aa22-92fbcf53809c.png](https://file1.elecfans.com//web2/M00/BD/12/wKgZomWog8qAZSvwAAANb0elvzs336.png)
圖4 awtk-hmi交叉編譯目錄結(jié)構(gòu)
首先進入到awtk-linux-fb配置好交叉編譯工具鏈路徑(具體配置教程可以看往期文章介紹《【從0開始創(chuàng)建AWTK應(yīng)用程序】編譯應(yīng)用到嵌入式Linux平臺運行》),配置好后輸入scons命令進行編譯。接著進入awtk-mvvm目錄,輸入下面的命令進行編譯。
scons LINUX_FB=true WITH_JERRYSCRIPT=false
回到awtk-linux-fb目錄并輸入下面第一條scons命令編譯HMI應(yīng)用程序,編譯完成后接著輸入下面第二條命令發(fā)布應(yīng)用。
scons APP=../demo_home2sh release.sh ../demo_home2/res demo
此時awtk-linux-fb目錄下會生成一個release文件夾,里面同樣包含了可執(zhí)行文件目錄bin和資源文件目錄assets,后期可以通過AWStudio設(shè)計新的界面替換assets目錄文件達到更新運行時UI界面效果。最后,只需要將release文件夾拷貝到板子上并運行release/bin目錄下的demo程序即可。
移植HMI端程序到STM32平臺
這里以stm32h743開發(fā)為例子來介紹如何將HMI程序移植到STM32平臺,awtk-hmi自帶了一個stm32h743移植工程,所以整個移植流程比較方便。首先同樣需要將awtk、awtk-mvvm放到awtk-hmi目錄中,另外還需要運行下面兩條git命令下載awtk-fs-adapter和awtk-sqlite3。
圖 5 AWTK-HMI移植STM32的目錄結(jié)構(gòu)
接著使用keil打開hmi/awtk-stm32h743iitx-freertos/USER/awtk.uvprojx,點擊Build按鈕并等待編譯完成,可以看到以下信息。
圖6 stm32h743移植工程在keil上編譯成功的信息
一般HMI端代碼和資源文件是分開的,因此還需要將資源文件目錄assets放到SD卡或U盤等形式,插入板子上使用文件系統(tǒng)來讀取。后期也能通過AWStudio設(shè)計新的界面替換該目錄達到更新運行時UI界面效果。
如果資源文件想要存放在SD卡中,需要讓 AWTK 支持 FATFS,并且通過awtk_config.h配置資源文件路徑,詳細操作可以閱讀下面目錄的移植文檔說明:
awtk-hmi/mcu/stm32/stm32h743-freertos/docs/stm32h743iitx_port.md
圖7 awtk_config.h配置資源文件路徑
其它硬件平臺和RTOS移植方法也是大同小異的,可以從官方的Github下載對應(yīng)的移植工程,參照stm32h743的移植工程在keil中添加所需的代碼文件(awtk、awtk-mvvm、hmi等)并配置awtk_config.h。
聲明:本文內(nèi)容及配圖由入駐作者撰寫或者入駐合作網(wǎng)站授權(quán)轉(zhuǎn)載。文章觀點僅代表作者本人,不代表電子發(fā)燒友網(wǎng)立場。文章及其配圖僅供工程師學(xué)習(xí)之用,如有內(nèi)容侵權(quán)或者其他違規(guī)問題,請聯(lián)系本站處理。
舉報投訴
-
開源
+關(guān)注
關(guān)注
3文章
3409瀏覽量
42723 -
編譯
+關(guān)注
關(guān)注
0文章
661瀏覽量
33060 -
串口屏
+關(guān)注
關(guān)注
8文章
546瀏覽量
37595
發(fā)布評論請先 登錄
相關(guān)推薦
基于AWTK推出的ZMP110x串口屏應(yīng)用方案
串口屏廣泛應(yīng)用于工業(yè)自動化、智能家電、醫(yī)療設(shè)備、共享設(shè)備等各個顯示領(lǐng)域。立功科技基于AWTK推出的ZMP110x串口
發(fā)表于 07-25 17:16
?1256次閱讀
【從0開始創(chuàng)建AWTK應(yīng)用程序】編譯應(yīng)用到嵌入式Linux平臺運行
AWTK是基于C語言開發(fā)的跨平臺GUI框架。本系列文章介紹如何從0開始創(chuàng)建AWTK應(yīng)用程序,包括搭建開發(fā)調(diào)試環(huán)境、使用AWTK創(chuàng)建Hello工程并在模擬器上
![【從0開始創(chuàng)建<b class='flag-5'>AWTK</b>應(yīng)用<b class='flag-5'>程序</b>】<b class='flag-5'>編譯</b>應(yīng)用到嵌入式Linux平臺<b class='flag-5'>運行</b>](https://file.elecfans.com/web2/M00/50/DA/pYYBAGLH6TyAB71EAAAPQ7KgtYA038.png)
AWTK 串口屏開發(fā)(1) - Hello World
本文以一個簡單的溫度設(shè)置程序為例,介紹AWTK串口屏的開發(fā)流程和MVVM數(shù)據(jù)綁定的基本方法。功能這個例子很簡單,制作一個調(diào)節(jié)溫度的界面。在這里例子中,模型(也就是數(shù)據(jù))里只有一個溫度變
![<b class='flag-5'>AWTK</b> <b class='flag-5'>串口</b><b class='flag-5'>屏</b>開發(fā)(1) - Hello World](https://file.elecfans.com/web2/M00/50/DA/pYYBAGLH6TyAB71EAAAPQ7KgtYA038.png)
AWTK 串口屏開發(fā)(3) - 告警信息
告警信息是一個常用的功能。在AWTK開源串口屏中,內(nèi)置告警信息模型,只需設(shè)計用戶界面即可實現(xiàn)告警信息的顯示和管理。1.功能告警信息是一個常用的功能,MCU在設(shè)備異常時,會發(fā)送告警信息到
![<b class='flag-5'>AWTK</b> <b class='flag-5'>串口</b><b class='flag-5'>屏</b>開發(fā)(3) - 告警信息](https://file.elecfans.com/web2/M00/50/DA/pYYBAGLH6TyAB71EAAAPQ7KgtYA038.png)
AWTK 開源串口屏開發(fā)(6) - 定時器的用法
定時器是個常用的功能,AWTK串口屏提供了豐富的定時器函數(shù),用于定時器的啟動、停止、暫停、恢復(fù)、修改和重置等功能,本文以計時器的例子來介紹定時器的基本用法。定時器也是一個常用的功能,在AWTK
![<b class='flag-5'>AWTK</b> <b class='flag-5'>開源</b><b class='flag-5'>串口</b><b class='flag-5'>屏</b>開發(fā)(6) - 定時器的用法](https://file.elecfans.com/web2/M00/50/DA/pYYBAGLH6TyAB71EAAAPQ7KgtYA038.png)
AWTK 開源串口屏開發(fā)(12) - 記事本應(yīng)用
記事本是一個常用的應(yīng)用程序,在AWTK串口屏中,內(nèi)置文件模型和文件選擇對話框,無需編寫一行傳統(tǒng)的代碼,即可實現(xiàn)一個簡單的記事本應(yīng)用程序。記事
![<b class='flag-5'>AWTK</b> <b class='flag-5'>開源</b><b class='flag-5'>串口</b><b class='flag-5'>屏</b>開發(fā)(12) - 記事本應(yīng)用](https://file.elecfans.com/web2/M00/50/DA/pYYBAGLH6TyAB71EAAAPQ7KgtYA038.png)
【從0開始創(chuàng)建AWTK應(yīng)用程序】編譯應(yīng)用到RTOS平臺
AWTK是基于C語言開發(fā)的跨平臺GUI框架。本系列文章介紹如何從0開始創(chuàng)建AWTK應(yīng)用程序,包括搭建開發(fā)調(diào)試環(huán)境、使用AWTK創(chuàng)建Hello工程并在模擬器上
![【從0開始創(chuàng)建<b class='flag-5'>AWTK</b>應(yīng)用<b class='flag-5'>程序</b>】<b class='flag-5'>編譯</b>應(yīng)用到RTOS平臺](https://file.elecfans.com/web2/M00/50/DA/pYYBAGLH6TyAB71EAAAPQ7KgtYA038.png)
AWTK 開源串口屏開發(fā)(16) - 提供 MODBUS 服務(wù)
AWTK串口屏內(nèi)置MODBUS從站模型,不用編寫一行代碼即可讓串口屏提供MODBUS服務(wù),讓遠程設(shè)備通過MODBUS協(xié)議訪問
![<b class='flag-5'>AWTK</b> <b class='flag-5'>開源</b><b class='flag-5'>串口</b><b class='flag-5'>屏</b>開發(fā)(16) - 提供 MODBUS 服務(wù)](https://file.elecfans.com/web2/M00/50/DA/pYYBAGLH6TyAB71EAAAPQ7KgtYA038.png)
AWTK 開源串口屏開發(fā)(17) - 通過 MODBUS 訪問數(shù)組數(shù)據(jù)
在AWTK串口屏中,內(nèi)置MODBUS客戶端通道模型,不用編寫代碼即可實現(xiàn)在ListView中顯示遠程設(shè)備上的數(shù)組數(shù)據(jù)。1.功能不用編寫代碼,實現(xiàn)對遠程設(shè)備上數(shù)組數(shù)據(jù)的顯示。2.創(chuàng)建項目
![<b class='flag-5'>AWTK</b> <b class='flag-5'>開源</b><b class='flag-5'>串口</b><b class='flag-5'>屏</b>開發(fā)(17) - 通過 MODBUS 訪問數(shù)組數(shù)據(jù)](https://file.elecfans.com/web2/M00/50/DA/pYYBAGLH6TyAB71EAAAPQ7KgtYA038.png)
評論