1. 方案簡介

本方案為最簡單的UI開發(fā)示例，已為用戶初步構建一個基本的應用工程；準備好我司的easyeai-api鏈接調用；準備好UI的開發(fā)環(huán)境。其目的在于方便用戶馬上進行帶有界面交互的產品開發(fā)，無須關心工程組建。

2. 快速上手

2.1 開發(fā)環(huán)境準備

如果您初次閱讀此文檔，請閱讀《入門指南/開發(fā)環(huán)境準備/Easy-Eai編譯環(huán)境準備與更新》，并按照其相關的操作，進行編譯環(huán)境的部署。

在PC端Ubuntu系統中執(zhí)行run腳本，進入EASY-EAI編譯環(huán)境，具體如下所示。

cd ~/develop_environment ./run.sh 2204

2.2 源碼下載以及例程編譯

在EASY-EAI編譯環(huán)境下創(chuàng)建存放源碼倉庫的管理目錄：

cd /opt mkdir EASY-EAI-Toolkit cd EASY-EAI-Toolkit

通過git工具，在管理目錄內克隆遠程倉庫

git clone https://github.com/EASY-EAI/EASY-EAI-Toolkit-1126B.git

注：

* 此處可能會因網絡原因造成卡頓，請耐心等待。

* 如果實在要在gitHub網頁上下載，也要把整個倉庫下載下來，不能單獨下載本實例對應的目錄。

進入到對應的例程目錄執(zhí)行編譯操作，具體命令如下所示：

cd EASY-EAI-Toolkit-1126B/UiSolutions/QDemo/ ./build.sh

注：

* 由于依賴庫部署在板卡上，因此交叉編譯過程中必須保持/mnt掛載。

若編譯過程中出現以下報錯：

則需要【在板卡上】執(zhí)行以下命令，安裝Qt庫

sudo apt-get update sudo apt-get install qtbase5-dev

安裝完成后再次回到EASY-EAI編譯環(huán)境中進行編譯操作。

2.3 例程運行

通過串口調試或ssh調試，進入板卡后臺，定位到例程部署的位置，如下所示：

cd /userdata/UiSolu

運行例程命令如下所示：

./qSolu-QDemo

2.4 運行效果

運行打?。?/p>

液晶顯示屏上會顯示如下畫面：

點擊“歡迎”按鈕，可以顯示/隱藏提示語。

2.5 開機啟動

首先進入板卡后臺，執(zhí)行以下命令，在板卡上創(chuàng)建一個給本例程使用的應用目錄：myapp

mkdir -p /userdata/apps/myapp cd /userdata/apps/myapp

然后去到/userdata/UiSolu目錄中，把本【例程所需要的】全部文件，包含：編譯結果，配置文件，模型等。部署到剛剛新建的myapp目錄中。

cp /userdata/UiSolu/* -r

* /userdata/UiSolu/下的內容，是由Qt工程的build.sh腳本生成。

最后在板卡上創(chuàng)建一個run.sh腳本來管控用戶所有需要的應用即可，《入門指南/應用程序開機自啟動》會詳細描述run.sh腳本該如何編寫。

3. QtCreator配置

3.1 運行qtcreator

在EASY-EAI編譯環(huán)境中的任意位置，通過下方命令，后臺打開qtcreator：

qtcreator &

注：若虛擬機配置較低，打開qtcreator可能要等待10幾秒。

3.2 打開Qt工程

若QtCreator無法設置成中文界面，可以在EASY-EAI編譯環(huán)境中執(zhí)行下方命令，然后重啟QtCreator即可。

sudo apt-get update sudo apt-get install qttranslations5-l10n

3.3 配置遠程調試參數

注：進行遠程調試前，首先要用build.sh腳本把相關的資源拷貝到【開發(fā)板】相對應的目錄上，否則會因缺少文件導致運行異常。

3.4 遠程運行Qt應用

3.5 調試打印輸出&遠程停止應用進程

3.6 修改應用編譯輸出位置

注：任何修改*.pro或者*.pri的操作，都要clean掉Makefile后，再重新編譯。

4. 開發(fā)指南

4.1 Toolkit倉庫介紹

4.2 示例文件&目錄結構

4.2.1 開發(fā)實例介紹

每個解決方案就是一個獨立的項目，項目使用qmake構建自動編譯部署。一個最簡單的Qt項目至少要包含以下元素：build.sh、*.pro、main.cpp、mainWidget.ui、mainWidget.cpp、mainWidget.h，如下所示。

具體介紹如下所示。

4.3 *.pro和*.pri文件解析

4.3.1 *.pro文件：

第一部分為輸出配置，如下所示：

配置信息如下所示。

第二部分為全局編譯選項配置，如下所示：

配置信息如下所示。

第三部分為加載自定義子模塊，如下所示：

第四部分為加載資源管理，如下所示：

第五部分為指定文件輸出目錄，如下所示：

4.3.2 api.pri文件：

本工程文件是對我司的功能組件庫的管理，若用戶有“對我司的功能組件庫進行再封裝”的需求，則可通過本文件來管理。（針對當前方案進行：配置EASY EAI API頭文件目錄、庫文件目錄以及配置庫鏈接參數）：

配置信息如下所示。

4.3.3 common.pri文件：

本工程文件是第三方的庫的配置（針對當前方案進行：配置第三方頭文件目錄、庫文件目錄、配置第三方庫鏈接參數以及配置源碼目錄）：

配置信息如下所示。

4.3.4 ui.pri文件：

本工程文件是交互界面相關的源碼文件配置，內容如下所示：

配置項如下所示。

4.4 build.sh編譯腳本：

4.4.1 路徑定位部分

第一部分用于提取目錄用于編譯操作，內容如下所示：（進入build.sh腳本所在目錄，并且提取當前目錄絕對路徑，提取當前目錄名稱）

4.4.2 編譯參數部分

第二部分清除操作，清除目錄為Release，內容如下所示：（執(zhí)行build.sh腳本時，帶入了參數“clear”，則清空編譯輸出；帶入了參數“all”，則重新編譯）

4.4.3 編譯操作

第三部分，編譯直接調用qmake，內容如下所示：（重新編譯，并生成部署目錄）