在线观看www成人影院-在线观看www日本免费网站-在线观看www视频-在线观看操-欧美18在线-欧美1级

0
  • 聊天消息
  • 系統消息
  • 評論與回復
登錄后你可以
  • 下載海量資料
  • 學習在線課程
  • 觀看技術視頻
  • 寫文章/發帖/加入社區
會員中心
創作中心

完善資料讓更多小伙伴認識你,還能領取20積分哦,立即完善>

3天內不再提示

ArkUI框架,更懂程序員的UI信息語法

HarmonyOS開發者 ? 來源:未知 ? 2022-12-14 09:10 ? 次閱讀
加入交流群
微信小助手二維碼

掃碼添加小助手

加入工程師交流群


ArkUI框架簡化代碼的“秘密”

628dce04-7b4b-11ed-8abf-dac502259ad0.gif

在傳統的開發過程中,總有個問題在困擾我:如何實現前端view與后端數據的同步更改?例如:在某個視頻類app的頁面,如果我想要實現視頻的點擊播放功能,需要怎么樣進行呢?

62bea42a-7b4b-11ed-8abf-dac502259ad0.gif

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

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

640cb600-7b4b-11ed-8abf-dac502259ad0.gif

于是我搜索了一下ArkUI有什么優勢。發現很重要的一個原因:ArkUI使用了聲明式UI開發框架,同時在UI描述上運用了可以和語言運行時深度結合的自研語言ArkTS。

聲明式框架的“廬山真面目”

64697df4-7b4b-11ed-8abf-dac502259ad0.gif

這里肯定會有小伙伴提出疑問:什么是聲明式開發框架?在介紹之前,我們先了解一下傳統的命令式開發框架思路,作為一個程序員,一旦我想要更改View,就需要先更改View對應的Data,然后再更改View的顯示內容。

648c2732-7b4b-11ed-8abf-dac502259ad0.gif

而聲明式開發框架則不同,ArkUI的聲明式框架框架更為高效,可以讓data與前端view同步更新數據。

64c2fa6e-7b4b-11ed-8abf-dac502259ad0.gif

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

64e48800-7b4b-11ed-8abf-dac502259ad0.png

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

650034b0-7b4b-11ed-8abf-dac502259ad0.gif

代理可以將目標數據進行代理,并為目標數據綁定到攔截器上。而攔截器會監聽目標數據的變化,當數據更新時,攔截器就會重寫數據的set方法,同時自動更新數據對應的前端頁面,整個過程不需要程序員進行手動命令更新。

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

聲明式開發框架成功解決了傳統開發過程中,代碼冗長的問題。但是在了解聲明式開發框架的過程中,我想到一個問題:有沒有方法,讓我開發一次代碼,就可以在多個設備上適配呢?

651d8704-7b4b-11ed-8abf-dac502259ad0.gif

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

65638b28-7b4b-11ed-8abf-dac502259ad0.gif

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

65842fe0-7b4b-11ed-8abf-dac502259ad0.png

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

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

常用組件

在這里我們總結了一下常用組件:

65a207b8-7b4b-11ed-8abf-dac502259ad0.png

常見的容器類組件有列表,彈出框。

65c60bb8-7b4b-11ed-8abf-dac502259ad0.png

展示類組件有文本,進度條,事件標記和氣泡指示。

65f0a594-7b4b-11ed-8abf-dac502259ad0.png

導航類組件有Tab頁簽。

6607ea4c-7b4b-11ed-8abf-dac502259ad0.png66282f0a-7b4b-11ed-8abf-dac502259ad0.png

操作類組件有按鈕,下拉選項,選擇器,評分條,搜索框和菜單。

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

總結

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

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

1、極簡的UI信息語法

2、支持多設備開發,一次開發多端部署

3、開箱即用的多態UI組件

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

END

關于ArkUI的介紹想了解更多?

請登錄開發者官網!

成為HarmonyOS開發者一員!

想了解更多HarmonyOS技術?后臺留言,立刻安排!


原文標題:ArkUI框架,更懂程序員的UI信息語法

文章出處:【微信公眾號:HarmonyOS開發者】歡迎添加關注!文章轉載請注明出處。


聲明:本文內容及配圖由入駐作者撰寫或者入駐合作網站授權轉載。文章觀點僅代表作者本人,不代表電子發燒友網立場。文章及其配圖僅供工程師學習之用,如有內容侵權或者其他違規問題,請聯系本站處理。 舉報投訴
  • HarmonyOS
    +關注

    關注

    80

    文章

    2143

    瀏覽量

    32611

原文標題:ArkUI框架,更懂程序員的UI信息語法

文章出處:【微信號:HarmonyOS_Dev,微信公眾號:HarmonyOS開發者】歡迎添加關注!文章轉載請注明出處。

收藏 人收藏
加入交流群
微信小助手二維碼

掃碼添加小助手

加入工程師交流群

    評論

    相關推薦
    熱點推薦

    ArkUI介紹

    ArkUI(方舟UI框架)為應用的UI開發提供了完整的基礎設施,包括簡潔的UI語法、豐富的
    發表于 06-24 06:41

    UI開發概述

    語言。 布局 布局是UI的必要元素,它定義了組件在界面中的位置。ArkUI框架提供了多種布局方式,除了基礎的線性布局、層疊布局、彈性布局、相對布局、柵格布局外,也提供了相對復雜的列表、宮格、輪播。 組件
    發表于 06-24 06:36

    ArkUI-X應用工程結構說明

    簡介 本文檔配套ArkUI-X,將OpenHarmony ArkUI開發框架擴展到不同的OS平臺,比如Android和iOS平臺,讓開發者基于ArkUI,可復用大部分的應用代碼(
    發表于 06-19 23:11

    ArkUI-X跨平臺應用改造指南

    ,包含了應用的所有UI界面、彈窗、媒體圖片等元素,這些都是能夠被用戶直接感知并進行操作的。此層是借助HarmonyOS的ArkUI組件以及相關能力來進行設計與開發的,并且ArkUI-X框架
    發表于 06-16 23:05

    ArkUI-X框架LogInterface使用指南

    ArkUI-X框架支持日志攔截能力,Android側提供原生接口,用于注入LogInterface接口,框架日志及ts日志通過該接口輸出,本文的核心內容是介紹如何在Android平臺上有效利用
    發表于 06-15 23:20

    阿里云升級通義靈碼AI程序員,全面上線

    近日,阿里云宣布其備受矚目的通義靈碼AI程序員已正式全面上線,為開發者帶來更為強大和便捷的編程輔助工具。 此次上線的通義靈碼AI程序員,在功能上實現了全面升級。現在,它支持VS Code
    的頭像 發表于 01-09 11:16 ?688次閱讀

    TMS320C6000程序員指南

    電子發燒友網站提供《TMS320C6000程序員指南.pdf》資料免費下載
    發表于 12-24 17:19 ?0次下載
    TMS320C6000<b class='flag-5'>程序員</b>指南

    TMS320C55x DSP CPU程序員參考補充

    電子發燒友網站提供《TMS320C55x DSP CPU程序員參考補充.pdf》資料免費下載
    發表于 12-21 11:36 ?3次下載
    TMS320C55x DSP CPU<b class='flag-5'>程序員</b>參考補充

    UCD3138A64/UCD3138128程序員手冊

    電子發燒友網站提供《UCD3138A64/UCD3138128程序員手冊.pdf》資料免費下載
    發表于 12-09 14:42 ?0次下載
    UCD3138A64/UCD3138128<b class='flag-5'>程序員</b>手冊

    機械革命發布CODE AI程序員

    近日,英特爾新質生產力技術生態大會在成都舉行,機械革命作為重要參展商帶來了多款明星產品引爆全場!其中更是在AI PC軟件生態產品發布分論壇上,Intel、智譜、機械革命三方聯合發布了專為程序員設計的CODE AI程序員本,成為本次大會的一大亮點。
    的頭像 發表于 11-30 10:34 ?1071次閱讀

    Linux驅動程序程序員指南

    電子發燒友網站提供《Linux驅動程序程序員指南.pdf》資料免費下載
    發表于 11-22 15:53 ?0次下載
    Linux驅動<b class='flag-5'>程序</b><b class='flag-5'>程序員</b>指南

    AI編程工具會不會搶程序員飯碗

    AI編程工具可輔助編程,減少手動編碼,提升效率,對程序員有積極影響也有挑戰。程序員需深化技能、拓寬知識應對。長遠看,AI與人類程序員將共生共榮。
    的頭像 發表于 11-08 10:17 ?511次閱讀

    第五屆長沙·中國1024程序員節開幕

    據官方媒體報道,10月24日;? 第五屆長沙·中國1024程序員節在湖南湘江新區開幕;本次中國1024程序員節以“智能應用新生態”為主題。設置有岳麓對話、技術英雄會、主題峰會及賽事、展覽等活動,一場
    的頭像 發表于 10-25 15:42 ?473次閱讀

    程序員節視頻創意大賽,用串口屏贏取千元大獎

    10月24日,程序員專屬的節日里,我們盛大開啟“程序員節視頻創意大賽”特別活動!這不僅是一場視覺的盛宴,更是智慧與創意的璀璨碰撞。我們誠摯邀請每一位程序員及編程愛好者,拿起你的鏡頭,記錄下那些平凡日子中的不凡瞬間,讓編程的魅力與
    的頭像 發表于 07-08 10:38 ?72次閱讀
    <b class='flag-5'>程序員</b>節視頻創意大賽,用串口屏贏取千元大獎

    程序員節視頻創意盛宴,邀您共襄盛舉!

    10月24日,程序員專屬的節日里,我們盛大開啟“程序員節視頻創意大賽”特別活動!這不僅是一場視覺的盛宴,更是智慧與創意的璀璨碰撞。我們誠摯邀請每一位程序員及編程愛好者,拿起你的鏡頭,記錄下那些平凡日子中的不凡瞬間,讓編程的魅力與
    的頭像 發表于 07-04 09:00 ?67次閱讀
    <b class='flag-5'>程序員</b>節視頻創意盛宴,邀您共襄盛舉!
    主站蜘蛛池模板: 深夜免费在线视频 | 黄色一级日本 | 色多多免费观看在线 | 国产男女免费视频 | 男女交性视频播放 视频 视频 | 国产三级精品在线观看 | 538porm在线看国产亚洲 | 不卡无毒免费毛片视频观看 | 日本特黄在线观看免费 | 久久夜夜操妹子 | 羞羞答答xxdd影院欧美 | 天天综合在线视频 | 操白虎美女 | 国产综合视频在线观看 | 可以免费看黄色的网站 | 国产性片在线观看 | 欧美另类图片亚洲偷 | 日韩免费毛片全部不收费 | 精品色视频 | аⅴ天堂 在线 | 成人午夜性视频欧美成人 | 午夜看片网 | 天天干天天草天天射 | 亚洲第一免费视频 | 手机看片免费永久在线观看 | 四虎影院免费在线播放 | 四虎影视最新 | 亚洲黄色第一页 | 在线观看免费视频网站色 | 色播图片 | 色视频免费| 国产精品久久免费观看 | 天天爽夜夜操 | 精品视频一二三区 | 日日噜噜爽爽狠狠视频 | 精品卡1卡2卡三卡免费视频 | 中文字幕第一区 | 久久综合中文字幕 | 午夜免费观看福利片一区二区三区 | 久久福利青草精品资源 | 操久在线 |