ArkUI框架，更懂程式設計師的UI資訊語法

ArkUI框架簡化程式碼的“秘密”

在傳統的開發過程中，總有個問題在困擾我：如何實現前端view與後端資料的同步更改？例如：在某個影片類app的頁面，如果我想要實現影片的點選播放功能，需要怎麼樣進行呢？

如果我使用傳統的命令式開發框架去實現，容易造成的麻煩在於，每次後端的資料發生更改，我都需要手動更新前端view。

為了解決這個問題，我便在ArkUI上實現了同樣的功能，神奇的事情發生了，瞬間程式碼乾淨了很多，只用幾行程式碼就實現了相同的功能。

於是我搜尋了一下ArkUI有什麼優勢。發現很重要的一個原因：ArkUI使用了宣告式UI開發框架，同時在UI描述上運用了可以和語言執行時深度結合的自研語言ArkTS。

宣告式框架的“廬山真面目”

這裡肯定會有小夥伴提出疑問：什麼是宣告式開發框架？在介紹之前，我們先了解一下傳統的命令式開發框架思路，作為一個程式設計師，一旦我想要更改View，就需要先更改View對應的Data,然後再更改View的顯示內容。

而宣告式開發框架則不同，ArkUI的宣告式框架框架更為高效，可以讓data與前端view同步更新資料。  

那ArkUI框架是如何實現同步更新的呢？這個原理非常簡單，想象一下我現在要蓋一棟大樓，我需要把專案先交給包工頭，包工頭再把具體的工作分配給工人，工人依據圖紙建造大樓，當圖紙變動的時候，工人也需要按照圖紙更改建造動作。

與此相對的，在ArkUI命令式框架內部，有兩個重要的角色，代理和攔截器。

代理可以將目標資料進行代理，併為目標資料繫結到攔截器上。而攔截器會監聽目標資料的變化，當資料更新時，攔截器就會重寫資料的set方法，同時自動更新資料對應的前端頁面，整個過程不需要程式設計師進行手動命令更新。

原子佈局能力實現頁面佈局一致性

宣告式開發框架成功解決了傳統開發過程中，程式碼冗長的問題。但是在瞭解宣告式開發框架的過程中，我不經想到一個問題：有沒有方法，讓我開發一次程式碼，就可以在多個裝置上適配呢？

ArkUI就提供了這一功能，於是我動手試了一下。當裝置尺寸變寬時，我可以透過原子佈局的均分能力去實現頁面佈局的一致性，也可以透過柵格佈局，去解決多尺寸多裝置的動態佈局問題。

剛剛提到的原子佈局能力包含均分能力，折行能力，拉伸能力，縮放能力，延伸能力，佔比能力和隱藏能力。可以幫助我們在不同裝置上保持體驗的一致性。這樣自適應的問題解決了。

針對裝置獨有的特性，比如平板適配左側導航欄，這個有什麼方法實現呢？這裡我找到了媒體查詢，它可以判斷裝置型別，設計出相匹配的佈局樣式，同時還可以監聽螢幕尺寸動態變化，比如橫豎屏切換可以透過orientation屬性判斷螢幕橫豎狀態來動態適配，另外還支援判斷分屏狀態、摺疊屏展開狀態等，這樣就解決了我一次開發多端部署的難題。

同時，ArkUI框架為開發者提供了多型元件，同一控制元件在不同的裝置上會呈現出不同的形態，所以開發者在使用多型元件時，無需考慮裝置差異，只需關注功能實現即可。

常用元件

在這裡我們總結了一下常用元件：

常見的容器類元件有列表，彈出框。

展示類元件有文字，進度條，事件標記和氣泡指示。

導航類元件有Tab頁籤。

操作類元件有按鈕，下拉選項，選擇器，評分條，搜尋框和選單。

這樣一來，我只需要選擇合適的元件進行開發，就可以一次開發，多端部署。大大節省我的開發時間。

總結

根據前文不難看出，ArkUI是一套用於構建HarmonyOS應用介面的UI開發框架。

我們總結一下它主要有以下三個特性：

1.      極簡的UI資訊語法

2.      支援多裝置開發，一次開發多端部署

3.      開箱即用的多型UI元件

從而幫助開發者提升HarmonyOS應用介面的開發效率。

關於ArkUI的介紹今天就到這裡了，需想了解更多？

感興趣的夥伴們可以點選連結 進行學習。

如果你喜歡這期的影片，歡迎在下方留言點贊分享，你的支援就是我們更新的最大動力，我們下期再見~