前 言

QD Plus (QuodiX) 是由上海駐利電子有限公司開(kāi)發(fā)的一款高效、易用的HMI（Human-Machine Interface，人機(jī)界面）開(kāi)發(fā)工具。自2011年推出以來(lái)，QD Plus 已在汽車、工業(yè)、醫(yī)療等多個(gè)行業(yè)成功應(yīng)用，致力于為用戶提供簡(jiǎn)潔高效的界面設(shè)計(jì)方案。其核心功能包括支持2D/3D 、圖像導(dǎo)入、狀態(tài)表、事件的觸發(fā)、API 控制、按鈕、動(dòng)畫(huà)設(shè)計(jì)和模擬測(cè)試等，顯著加快了HMI 項(xiàng)目的開(kāi)發(fā)進(jìn)程。

1

HMI 設(shè)計(jì)專用工具

Kanzi 和 QD Plus 都是用于儀表盤(pán)人機(jī)界面（HMI）設(shè)計(jì)的專業(yè)工具。對(duì)于一個(gè)完整的儀表盤(pán)項(xiàng)目，它包括兩個(gè)部分：一部分是通過(guò) Kanzi Studio 創(chuàng)建的 UI 項(xiàng)目，另一部分是軟件邏輯控制，決定何時(shí)顯示以及顯示內(nèi)容。

1. 軟件控制模塊可以在不同的操作系統(tǒng)中使用。

QD Plus：提供API源碼，源碼是C語(yǔ)言，移植簡(jiǎn)單，方便適配各種OS。

2. Kanzi Studio 可以導(dǎo)入二維、三維和動(dòng)畫(huà)素材，并為它們賦予各種控制屬性。

QD Plus：可以導(dǎo)入3d模型和2d圖像，提供控制屬性還提供控制關(guān)系 ，但不支持導(dǎo)入flash動(dòng)畫(huà)文件（QD自帶動(dòng)畫(huà)工具）。

3. 創(chuàng)建一些可用于屏幕切換控制的觸發(fā)器。

QD Plus：event功能可以設(shè)計(jì)好動(dòng)畫(huà)，軟件工程師通過(guò)API接口觸發(fā)event即可。

2

為UI設(shè)計(jì)工程師提供的工作

1.UI 設(shè)計(jì)工程師需要?jiǎng)?chuàng)建大量的 UI 素材，這一步與基于傳統(tǒng) HMI 工具所需的操作相同。

2.根據(jù)客戶的需求，UI 設(shè)計(jì)工程師需要構(gòu)建顯示場(chǎng)景，包括 UI 布局和顯示屏幕切換。因此，UI 設(shè)計(jì)工程師需要相應(yīng)地設(shè)置參數(shù)和觸發(fā)器。例如，警告圖標(biāo)有一個(gè)開(kāi)/關(guān)參數(shù)，菜單切換需要一個(gè)由事件或某些條件觸發(fā)的觸發(fā)器。

QD Plus：只需UI布局，不需要設(shè)置參數(shù)，使用更簡(jiǎn)單。比如icon的on、 off ， QD Plus可以使用imagelist ，切換imagelist的index（0,1,2...)值就能實(shí)現(xiàn)，更加靈活。

3.將最終的項(xiàng)目文件和 UI 路徑布局?jǐn)?shù)據(jù)導(dǎo)出給軟件工程師。

QD Plus：生成C代碼，方便移植，生成代碼中包括了每個(gè)元素的ID ，方便API 控制每個(gè)元素（不需要輸入元素路徑）。QD Plus的API接口也僅有兩個(gè)，方便軟件工程師使用。

參數(shù)列表可以創(chuàng)建多個(gè)位置、顏色、顯示/隱藏和觸發(fā)器。QD Plus工具屬性窗口可以輕松設(shè)置每個(gè)元素的位置，顏色等信息。

所有的 UI 素材都可以通過(guò)路徑被軟件找到。QD Plus 工具的路徑選擇彈窗可以輕松的找到UI圖片。

3

為軟件工程師提供的工作

1. 首先，軟件工程師需要使用 Kanzi 公司提供的一些特殊方法導(dǎo)入 .kzb 格式的 Kanzi 項(xiàng)目。

QDPlus：生成的C文件，可以直接生成到工程目錄，編譯簡(jiǎn)單方便。

2. 當(dāng)軟件工程師想要控制某些 UI 素材時(shí)，例如一個(gè)警告圖標(biāo)，首先需要找到該圖標(biāo)的路徑，通常應(yīng)為“root/warning/icon_XXX”，該路徑應(yīng)在 UI 布局?jǐn)?shù)據(jù)中定義，由 UI 設(shè)計(jì)工程師準(zhǔn)備。接下來(lái)，軟件工程師需要控制圖標(biāo)的顯示和消失，找到控制參數(shù)后，將其設(shè)置為“1”以顯示圖標(biāo)，設(shè)置為“0”以關(guān)閉顯示。

QD Plus(QuodiX)中，每個(gè)元素都有一個(gè)身份ID（根本不在需要用戶記錄元素路徑，甚至通過(guò)QD工具的快捷鍵shift + i,就會(huì)把要操作的ID和API函數(shù)復(fù)制到粘貼板中），軟件工程師可以輕松使用CTRL+V, 就可以動(dòng)態(tài)修改或者獲取到元素狀態(tài)、關(guān)系、觸發(fā)動(dòng)畫(huà)。

3. 盡管這個(gè)示例非常簡(jiǎn)單，但它展示了軟件控制方法與傳統(tǒng) HMI 工具有很大不同。它使軟件設(shè)計(jì)工作變得簡(jiǎn)單快捷。同時(shí)，在某些情況下，我們可以修改 UI 設(shè)計(jì)而無(wú)需對(duì)軟件進(jìn)行任何修改。

一些簡(jiǎn)單的布局調(diào)整， QD Plus(QuodiX)可以在工具中調(diào)整,重新生成代碼編譯即可（最后燒寫(xiě)生成的BIN文件），應(yīng)用軟件不需要修改代碼。QD Plus在生成代碼時(shí)會(huì)根據(jù)使用的情況，生成一些宏定義，這些宏定義在編譯時(shí)，能讓API代碼更加省空間。

4

優(yōu) 勢(shì)

1. 基于操作系統(tǒng)的兼容性，UI 設(shè)計(jì)工程師可以通過(guò) Windows 操作系統(tǒng)向客戶展示一些 UI 設(shè)計(jì)概念。這在需求討論環(huán)節(jié)非常有幫助，能夠快速促使 UI 設(shè)計(jì)工程師和客戶達(dá)成共識(shí)。

在項(xiàng)目初期，沒(méi)有開(kāi)發(fā)板的情況或者跟客戶討論需求的情況下，可以使用QD Plus的opengl windows版本設(shè)計(jì)布局（可以在PC上編碼、運(yùn)行最終效果），設(shè)計(jì)好的項(xiàng)目可以轉(zhuǎn)換到對(duì)應(yīng)的芯片中使用。

2. 在開(kāi)發(fā)階段，UI 設(shè)計(jì)工程師和軟件工程師可以基于相同的 UI 設(shè)計(jì)布局和邏輯并行工作。這能夠減少開(kāi)發(fā)時(shí)間。

QDPlus需要先設(shè)計(jì)好UI ，再做邏輯控制。

3. 此外，有時(shí)當(dāng) UI 設(shè)計(jì)需要修改時(shí)，例如位置需要微調(diào)，軟件工程師不需要做任何操作。

簡(jiǎn)單的UI布局調(diào)整， QD Plus只需要工具修改，不需要修改邏輯。

4. 由于 Kanzi Studio 內(nèi)置了許多 UI 顯示場(chǎng)景，軟件工程師不需要使用源代碼來(lái)構(gòu)建它們。這種方法可以減少軟件開(kāi)發(fā)時(shí)間和復(fù)雜性

QD Plus有多種自定義插件（方便客戶擴(kuò)展功能），可以實(shí)現(xiàn)常見(jiàn)的動(dòng)畫(huà)場(chǎng)景。

5

注意事項(xiàng)

如上所示，UI 設(shè)計(jì)工程師需要在 UI 項(xiàng)目中進(jìn)行一些邏輯觸發(fā)，因此，UI 設(shè)計(jì)工程師需要具備一定的軟件開(kāi)發(fā)知識(shí)，否則將影響 UI 顯示的穩(wěn)定性和效率。

QD Plus在設(shè)計(jì)中已經(jīng)把和GPU ， CPU相關(guān)的部分，放到API宏定義里面。這樣就降低了開(kāi)發(fā)人員的門(mén)檻。使用QD Plus工具的軟件工程師，一般懂C語(yǔ)言的應(yīng)屆生大專生即可勝任。QD Plus在設(shè)計(jì)中甚至考慮到軟件工程師和美工的溝通的常見(jiàn)問(wèn)題（一般雙方的問(wèn)題，就是相互不能太理解），也體現(xiàn)在QD Plus工具設(shè)計(jì)中。