如何使UI像iPhone一樣流暢炫酷？

　　隨著手機(jī)、智能手表等便攜式設(shè)備的普及，用戶對(duì)GUI的要求越來(lái)越高，嵌入式系統(tǒng)對(duì)GUI的需求也越來(lái)越迫切，本文將為大家介紹一個(gè)輕型、占用資源少、高性能、高可靠、便于移植、可配置及美觀的GUI編程框架。

　　一、什么是嵌入式GUI?

　　圖形用戶界面(Graphical User Interface，簡(jiǎn)稱 GUI，又稱圖形用戶接口)是指采用圖形方式顯示的計(jì)算機(jī)操作用戶界面。嵌入式GUI即在嵌入式設(shè)備上使用顯示屏去顯示操作界面，主要用來(lái)與用戶互動(dòng)。

　　二、市面上常見(jiàn)的GUI

　　當(dāng)前市面上主流的嵌入式 GUI 主要有：emWin(uCGUI)，TouchGFX，Embedded Wizard GUI，以及QT。

　　TouchGFX 是這兩年才發(fā)布的嵌入式 GUI，以界面華麗，流暢以及強(qiáng)勁的 TouchGFX Designer著稱。美中不足的是 TouchGFX 是要收費(fèi)的。

　　Embeded Wizard GUI 也是這兩年才發(fā)布的嵌入式 GUI，同樣以華麗，流暢的界面和強(qiáng)勁的GUIBuilder 著稱。獨(dú)創(chuàng) Chora 界面編程語(yǔ)言，讓大家的界面編程極其簡(jiǎn)單，GUIBuilder 上面含有非常多的控件，皮膚和主題供用戶選擇，且支持調(diào)試。 美中不足的是 Embeded Wizard GUI 也是要收費(fèi)的。

　　emWin 屬于老牌的嵌入式 GUI 了，有著十幾年的歷史，軟件架構(gòu)和功能比較成熟了。但是做出來(lái)比較炫的效果非常麻煩，且不支持較為復(fù)雜的控件。

　　QT是是一個(gè)1991年由Qt Company開(kāi)發(fā)的跨平臺(tái)C++圖形用戶界面應(yīng)用程序開(kāi)發(fā)框架。目前使用Linux操作系統(tǒng)的GUI設(shè)計(jì)大多數(shù)是基于QT開(kāi)發(fā)的。

　　以下是各種GUI對(duì)比表：

　　三、AWTK使UI像iPhone一樣

　　AWTK是ZLG集團(tuán)旗下致遠(yuǎn)電子開(kāi)源的GUI引擎，其寓意有兩方面：

　　?AWorks Toolkit：AWorks平臺(tái)內(nèi)置GUI

　　?Toolkit AnyWhere：為嵌入式、手機(jī)和PC打造的通用GUI

　　AWUI-js為用戶提供分離界面設(shè)計(jì)和邏輯的框架，AWStudio提供嵌入式組態(tài)軟件和云組態(tài)開(kāi)發(fā)環(huán)境。美工可以直接在AWStudio組態(tài)軟件中進(jìn)行精美的界面設(shè)計(jì)，讓研發(fā)工程師專注于控制邏輯的應(yīng)用程序。

　　AWTK的主要特點(diǎn)：

　　1.具有Qt的跨平臺(tái)

　　?支持AWorks嵌入式低端、中端和高端各個(gè)平臺(tái)開(kāi)發(fā);

　　?支持Linux桌面軟件開(kāi)發(fā);

　　?支持MacOS桌面軟件開(kāi)發(fā);

　　?支持Windows桌面軟件開(kāi)發(fā)

　　?支持Web App開(kāi)發(fā);

　　2.具有emWin的小巧高效

　　AWTK的小并非真的小，而是它可以很小。這主要得益于：

　　?靈活的架構(gòu)

　　通常魚(yú)和熊掌不兼得，功能強(qiáng)大和代碼體積相互矛盾，AWTK要在嵌入式的低端，中端和高端平臺(tái)上運(yùn)行，要在Android/iOS上運(yùn)行，要在PC甚至Web上運(yùn)行，光靠小是不行的，靈活的架構(gòu)才能 讓它可小可大。

　　?高效的數(shù)據(jù)格式

　　AWTK的主題數(shù)據(jù)和界面描述數(shù)據(jù)，在開(kāi) 發(fā)時(shí)使用XML格式，運(yùn)行時(shí)則編譯成二進(jìn)制的常量，故無(wú)需解析和內(nèi)存分配。圖片和字體也可以預(yù)先解碼并編譯成常量，運(yùn)行時(shí)直接從FLASH讀取，無(wú)需解碼和內(nèi)存分配。所以 AWTK在內(nèi)存很小的平臺(tái)仍然可以正常運(yùn)行。

　　?保守的設(shè)計(jì)。

　　由儉到奢易，由奢到儉難。在設(shè)計(jì)控件時(shí)盡量保守，降低對(duì)底層硬件的要求。AWTK可以在低端嵌入式平臺(tái)上運(yùn)行。 這些平臺(tái)典型的配置是32K RAM，512K Flash和低于100M主頻。

　　3.快

　　AWTK的快主要得益于：

　　?硬件加速

　　AWTK抽象了硬件加速接口，目前支持 STM32的G2D、NXP的PXP和GPU(OpenGL/OpenGLES)，充分挖掘硬件的性能。

　　?緩存繪制

　　播窗口動(dòng)畫(huà)前，預(yù)先繪制窗口到緩存，播放動(dòng)畫(huà)(平移/彈出動(dòng)畫(huà))時(shí)只是純粹內(nèi)存拷貝，運(yùn)行效率到達(dá)極致。

　　?高效的數(shù)據(jù)格式

　　主題數(shù)據(jù)和UI數(shù)據(jù)以高效的二進(jìn)制格式存儲(chǔ)，使用時(shí)無(wú)需解析和內(nèi)存分配，創(chuàng)建窗口可在瞬間完成。

　　?臟矩形算法

　　啟用臟矩形算法，每次只繪制變化的部分，提高運(yùn)行效率并降低功耗。

　　在IM287A的Linux系統(tǒng)上，Qt打開(kāi)一個(gè)窗口需要3秒以上，AWTK則瞬間以超過(guò)40FPS的動(dòng)畫(huà)打開(kāi)窗口(如果使用3FB，可以輕松達(dá)到60FPS)。

　　4.具有TouchGfx/Embedded Wizard的酷炫

　　支持現(xiàn)代GUI常見(jiàn)特性：

　　?窗口動(dòng)畫(huà)

　　支持平移、彈出、縮放和淡入淡出等動(dòng)畫(huà)。

　　?控件動(dòng)畫(huà)

　　支持移動(dòng)、縮放、翻轉(zhuǎn)、值變化和淡入淡出等動(dòng)畫(huà)。

　　?動(dòng)畫(huà)支持緩動(dòng)作效果

　　支持加速、減速和彈跳等數(shù)十種效果，亦可以自定義想要的效果。

　　?支持滑動(dòng)

　　ListView/SlideView/Selector/Switch等控件支持滑動(dòng)效果。

　　?支持游戲引擎常見(jiàn)功能

　　幀動(dòng)畫(huà)、骨骼動(dòng)畫(huà)(TODO)和粒子效果(TODO)。

　　?主題支持全局和窗口兩種方式

　　輕松定制控件的外觀效果，而無(wú)需要改變系統(tǒng)的主題。

　　?分離界面描述文件

　　開(kāi)發(fā)時(shí)采用XML格式描述，運(yùn)行時(shí)編譯成二進(jìn)制格式。分離界面方便了開(kāi) 發(fā)，而又無(wú)運(yùn)行時(shí)的開(kāi)銷。

　　5.穩(wěn)定

　　通過(guò)良好的架構(gòu)設(shè)計(jì)和編程風(fēng)格、單元測(cè)試、動(dòng)態(tài)(valgrind)檢查和Code Review保證其運(yùn)行的穩(wěn)定性。

　　6.完全開(kāi)源，商用免費(fèi)

　　?開(kāi)放全部源碼;

　　?商業(yè)應(yīng)用免費(fèi);

　　?沒(méi)有陰謀，放心使用，不要想多了。但我們會(huì)為ZLG集團(tuán)的客戶提供更好的服務(wù)和支持。

　　開(kāi)源項(xiàng)目網(wǎng)址：https://github.com/zlgopen/awtk

　　效果視頻鏈接：https://v.qq.com/txp/iframe/player.html?vid=n07811pocfx

　　AWTK，使UI像iPhone一樣!

　　M1052跨界核心板板載Cortex-M7的RT1050處理器，既具備MPU的強(qiáng)勁處理性能，又兼顧MCU微控制器的簡(jiǎn)單易用與實(shí)時(shí)性優(yōu)勢(shì)!

　　最高支持1366*768分辨率LCD，集成電容觸摸驅(qū)動(dòng)，并預(yù)裝AWorks 實(shí)時(shí)操作系統(tǒng)，讓觸控更穩(wěn)定順暢。