1. 方案簡(jiǎn)介

本方案為最簡(jiǎn)單的UI開(kāi)發(fā)示例，已為用戶初步構(gòu)建一個(gè)基本的應(yīng)用工程；準(zhǔn)備好我司的easyeai-api鏈接調(diào)用；準(zhǔn)備好UI的開(kāi)發(fā)環(huán)境。其目的在于方便用戶馬上進(jìn)行帶有界面交互的產(chǎn)品開(kāi)發(fā)，無(wú)須關(guān)心工程組建。

2. 快速上手

2.1 開(kāi)發(fā)環(huán)境準(zhǔn)備

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

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

cd ~/develop_environment
./run.sh

2.2 源碼下載以及實(shí)例編譯

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

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

通過(guò)git工具，在管理目錄內(nèi)克隆遠(yuǎn)程倉(cāng)庫(kù)。

git clone https://github.com/EASY-EAI/EASY-EAI-Toolkit-C-UiSolution.git

注：
* 此處可能會(huì)因網(wǎng)絡(luò)原因造成卡頓，請(qǐng)耐心等待。
* 如果實(shí)在要在gitHub網(wǎng)頁(yè)上下載，也要把整個(gè)倉(cāng)庫(kù)下載下來(lái)，不能單獨(dú)下載本實(shí)例對(duì)應(yīng)的目錄。
進(jìn)入到對(duì)應(yīng)的例程目錄執(zhí)行編譯操作，具體命令如下所示：

cd EASY-EAI-Toolkit-C-UiSolution/qSolu-QDemo/
./build.sh

注：
* 由于依賴庫(kù)部署在板卡上，因此交叉編譯過(guò)程中必須保持adb連接。

2.3 方案部署

通過(guò)執(zhí)行以下命令，將編譯結(jié)果手動(dòng)部署到板卡中。

cp Release/qSolu-* /mnt/userdata/UiSolu

2.4 示例方案運(yùn)行

通過(guò)按鍵Ctrl+Shift+T創(chuàng)建一個(gè)新窗口，執(zhí)行adb shell命令，進(jìn)入板卡運(yùn)行環(huán)境。

adb shell

進(jìn)入板卡后，定位到例程部署的位置：

cd /userdata/UiSolu

運(yùn)行例程命令如下所示：

./qSolu-QDemo

2.5 運(yùn)行效果

運(yùn)行打?。?/p>

液晶顯示屏上會(huì)顯示如下畫面：

點(diǎn)擊“歡迎”按鈕，可以顯示/隱藏提示語(yǔ)。

2.6 開(kāi)機(jī)啟動(dòng)

首先進(jìn)入板卡環(huán)境，執(zhí)行以下命令，在板卡上創(chuàng)建一個(gè)給本例程使用的應(yīng)用目錄：myapp。

cd /userdata/apps/
mkdir myapp

然后回到開(kāi)發(fā)環(huán)境中，通過(guò)使用“2.3方案部署”類似的操作方法，把本例程所需要的全部文件，包含：編譯結(jié)果，配置文件，模型等。部署到剛剛新建的myapp目錄中。
最后在板卡上創(chuàng)建一個(gè)run.sh腳本來(lái)管控用戶所有需要的應(yīng)用即可，《入門指南/應(yīng)用程序開(kāi)機(jī)自啟動(dòng)》會(huì)詳細(xì)描述run.sh腳本該如何編寫。

3. QtCreator配置

3.1 運(yùn)行qtcreator

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

qtcreator &

注：若虛擬機(jī)配置較低，打開(kāi)qtcreator可能要等待10幾秒。

3.2 打開(kāi)Qt工程

3.3 配置遠(yuǎn)程調(diào)試參數(shù)

注：進(jìn)行遠(yuǎn)程調(diào)試前，首先要用build.sh腳本把相關(guān)的資源拷貝到【開(kāi)發(fā)板】相對(duì)應(yīng)的目錄上，否則會(huì)因缺少文件導(dǎo)致運(yùn)行異常。

3.4 遠(yuǎn)程運(yùn)行Qt應(yīng)用

3.5 調(diào)試打印輸出&遠(yuǎn)程停止應(yīng)用進(jìn)程

3.6 修改應(yīng)用編譯輸出位置

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

4. 代碼解析

方案主邏輯代碼位于：EASY-EAI-Toolkit-C-UiSolution/qSolu-QDemo/QSrcCode/ui/main.cpp。代碼實(shí)現(xiàn)主要通過(guò)調(diào)用我司的easyeai-api庫(kù)快速構(gòu)建一個(gè)Qt應(yīng)用，代碼主體分為Qt主線程和抓圖顯示子線程。

4.1 組件庫(kù)組成

本開(kāi)發(fā)示例，需要使用到easyeai-api庫(kù)的以下組件，如下所示。

模組信息如下所示。

本工程由qSolu-QDemo.pro與各子模塊*.pro進(jìn)行組織。其中，這些組件屬于api子模塊，具體通過(guò)qSolu-QDemo/QSrcCode/apiWrapper/api.pri編譯進(jìn)工程，具體請(qǐng)看后續(xù)章節(jié)。

4.2 邏輯框圖

項(xiàng)目的整體邏輯框圖如下所示。

4.3 Qt線程

Qt線程處理的業(yè)務(wù)有：

創(chuàng)建抓圖顯示線程；

創(chuàng)建Qt應(yīng)用；
本處附上主要的邏輯功能代碼，其他輔助的、校驗(yàn)型的代碼先忽略。

// 1.創(chuàng)建抓圖顯示線程
pthread_t pid;
if(0 != CreateNormalThread(displayCamera, NULL ,&pid)){
    return a.exec();
}
// 2.創(chuàng)建Qt應(yīng)用
mainWidget w;
w.show();

4.4 抓圖顯示子線程

抓圖顯示子線程主要完成以下操作：

初始化攝像頭

預(yù)設(shè)：開(kāi)啟UI圖層

初始化顯示屏

抓圖，送顯
組件初始化操作如下，本處調(diào)用RGB攝像頭。

// 1.打開(kāi)攝像頭
ret = rgbcamera_init(CAMERA_WIDTH, CAMERA_HEIGHT, 90);
pbuf = NULL;
pbuf = (char *)malloc(IMAGE_SIZE);

初始化顯示屏，如下所示。

// 2.顯示初始化
disp_preset_uiLayer(SYS_TRUE);	//注意，若要使用UI，需要先把UI圖層使能，否則無(wú)法正常顯示。
ret = disp_init(SCREEN_WIDTH, SCREEN_HEIGHT);

抓取圖像。

// 3.(取流 + 顯示)循環(huán)
ret = rgbcamera_getframe(pbuf);
disp_commit(pbuf, IMAGE_SIZE);

5. 開(kāi)發(fā)指南

5.1 示例文件&目錄結(jié)構(gòu)

UiSolution git倉(cāng)庫(kù)僅會(huì)放置兩個(gè)解決方案。
一是最簡(jiǎn)潔的UI調(diào)用方案，用戶可以基于此方案，快速進(jìn)行需要帶界面交互的產(chǎn)品開(kāi)發(fā)。
二是帶調(diào)度框架的UI應(yīng)用方案，該方案為類人臉門禁機(jī)的產(chǎn)品級(jí)解決方案，其特點(diǎn)是模塊之間的耦合度低，用戶可以快速拓展自定義的業(yè)務(wù)模塊，以及快速更換UI皮膚。

5.1.1 UiSolution git倉(cāng)庫(kù)目錄介紹

UiSolution工程構(gòu)成如下所示，由功能組件easyeai-api和各個(gè)解決方案構(gòu)成。

功能組件的描述如下所示，easyeai-api是經(jīng)過(guò)高度封裝的易用性組件接口，便于用戶直接調(diào)用板卡資源。

解決方案的描述如下所示，單個(gè)“qSolu-”開(kāi)頭的目錄即為一個(gè)解決方案案例，代碼內(nèi)調(diào)用“EASY EAI-API”來(lái)滿足某一實(shí)際應(yīng)用場(chǎng)景的需求。

5.1.2 解決方案最基本的目錄構(gòu)成

每個(gè)解決方案就是一個(gè)獨(dú)立的項(xiàng)目，項(xiàng)目?jī)?nèi)包含部分如下所示，項(xiàng)目使用qmake構(gòu)建自動(dòng)編譯部署。

具體介紹如下所示。

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

5.2.1 *.pro文件：

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

配置信息如下所示。

第二部分為全局編譯選項(xiàng)配置，如下所示：

配置信息如下所示。

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

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

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

5.2.2 api.pri文件：

本工程文件是對(duì)我司的功能組件庫(kù)的管理，若用戶有“對(duì)我司的功能組件庫(kù)進(jìn)行再封裝”的需求，則可通過(guò)本文件來(lái)管理。（針對(duì)當(dāng)前方案進(jìn)行：配置EASY EAI API頭文件目錄、庫(kù)文件目錄以及配置庫(kù)鏈接參數(shù)）：

配置信息如下所示。

5.2.3 common.pri文件：

本工程文件是第三方的庫(kù)的配置（針對(duì)當(dāng)前方案進(jìn)行：配置第三方頭文件目錄、庫(kù)文件目錄、配置第三方庫(kù)鏈接參數(shù)以及配置源碼目錄）：

配置信息如下所示。

5.2.4 ui.pri文件：

本工程文件是交互界面相關(guān)的源碼文件配置，內(nèi)容如下所示：

配置項(xiàng)如下所示。

5.3 build.sh編譯腳本

5.3.1 路徑定位部分

第一部分用于提取目錄用于編譯操作，內(nèi)容如下所示：（進(jìn)入build.sh腳本所在目錄，并且提取當(dāng)前目錄絕對(duì)路徑，提取當(dāng)前目錄名稱）

5.3.2 編譯參數(shù)部分

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

5.3.3 編譯操作

第三部分，編譯直接調(diào)用qmake，內(nèi)容如下所示：（重新編譯，并生成部署目錄）

審核編輯 黃宇