搜索歷史

清空
搜索熱詞
      0
      • 聊天消息
      • 系統(tǒng)消息
      • 評論與回復
      VIP于 到期 續(xù)費
      登錄后你可以
      • 下載海量資料
      • 學習在線課程
      • 觀看技術視頻
      • 寫文章/發(fā)帖/加入社區(qū)
      會員中心
      創(chuàng)作中心
      發(fā)布
      創(chuàng)作活動

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

      3天內不再提示

      OpenHarmony ACE 代碼框架總結

      電子發(fā)燒友開源社區(qū) ? 來源：未知 ? 2022-12-30 19:05 ? 次閱讀

      一：ACE_Engine框架概述：

      ACE_Engine框架是OpenHarmony 的UI開發(fā)框架，提供開發(fā)者在進行應用UI開發(fā)時所必需的各種組件，以及定義這些組件的屬性，樣式，事件及方法。通過這些組件可以很方便的進行OpenHarmony上UI應用的開發(fā)。 ACE_Engine提供的組件分為兩種類型，即：類Web開發(fā)范式類型和聲明式開發(fā)范式類型。其中類Web開發(fā)范式中定義一個頁面需要三個文件，html，css和js文件。html文件負責頁面布局，css文件負責定義組件的樣式，js文件負責業(yè)務邏輯實現(xiàn)。而聲明式范式僅需要1個ets文件，頁面布局和組件的樣式以及業(yè)務邏輯實現(xiàn)都在此文件中。如圖：c7ab3cee-8830-11ed-bfe3-dac502259ad0.png ?二：ACE_Engine框架模塊劃分對于類Web開發(fā)范式組件，根據(jù)組件從前端到后端的過程，可以將整個框架劃分為JsFrameWork，DomNode, ComPonent, RenderNode四個模塊。其作用分別如下：
      • JsFrameWork：
      負責解析前端html和css文件，創(chuàng)建出DomNode樹。該樹的結構和前端頁面是一一對應的。2. DomNode： 負責將Dom樹轉換為Component樹。注意一個Dom節(jié)點轉換過后的Component節(jié)點實際上并不是一個單獨的節(jié)點，而是一顆以rootComponent為跟節(jié)點的組件樹。該樹中逐層包裹了對應的功能組件，最內部才是真正的主節(jié)點（這樣的作用是功能解耦合，將某一特定的功能放到對應的組件中去）。如BoxComponet負責組件的邊框繪制，DisplayComponent負責組件透明度繪制，TouchComponent負責組件觸摸時間的處理等。，一個詳細過程見DOMNode::GenerateComponentNode函數(shù)。3. ComPonent： 負責將Component樹中所有繼承自RenderComponent的節(jié)點（可繪制節(jié)點）創(chuàng)建對應的RendNode節(jié)點，生成對應的RendNode樹。見RenderComponent ::CreateRenderNode虛函數(shù)，4. RenderNode： RenderNode即可繪制的節(jié)點，負責組件的最終布局和繪制。其中布局函數(shù)為PerformLayout虛函數(shù)，由每個組件對應的實現(xiàn)類Render***類來實現(xiàn)。繪制函數(shù)為Paint虛函數(shù)，由每個組件對應的子類FlutterRender***類來實現(xiàn)。 對于聲明式開發(fā)范式組件，根據(jù)組件從前端到后端的過程，可以將整個框架劃分為EtsLoader，JsView, ComPonent, RenderNode四個模塊。其作用分別如下：
      • EtsLoader
      負責解析ets頁面，根據(jù)組件的tag標簽創(chuàng)建對應的JsView對象，生成jsView樹。2. JsView 負責處理組件的屬性，方法和事件。并通過Create函數(shù)創(chuàng)建對應的Component樹。3. ComPonent： 同Web開發(fā)范式組件中的Component4. RenderNode： 同Web開發(fā)范式組件中的RenderNode 各模塊創(chuàng)建示意圖如下圖所示：c7c84d84-8830-11ed-bfe3-dac502259ad0.png ?各模塊見的調用關系及主要函數(shù)如下：c7eb86aa-8830-11ed-bfe3-dac502259ad0.png ?三：組件的屬性/樣式的傳遞過程
      1. 組件的屬性和樣式是保存在前端頁面的，通過JsframeWork解析頁面，并調用JsEngine的CreateDomNode接口創(chuàng)建Dom節(jié)點的同時傳遞新節(jié)點屬性和樣式。 如果頁面中屬性樣式發(fā)生變化，則單獨調用SetAttr或SetStyle來更新屬性和樣式。
      2. DomNode收到屬性和樣式之后，會將通用屬性保存在Declation類中，將組件特有的屬性通過SetSpecialAttr和SetSpectialStyle函數(shù)保存在自身。
      3. DomNode調用對應Component類的Set***函數(shù)，將所有屬性和樣式設置到Component中。
      4. RenderNode創(chuàng)建后，會調用其Update函數(shù)。 該函數(shù)內調用對應Component的Get***函數(shù)，來接收組件的所有屬性和樣式。
      5. 在PipeLine中會遍歷每個RenderNode進行布局和繪制，此時，就依據(jù)RenderNode中接收的屬性和樣式，進行布局并繪制。
      c80423ae-8830-11ed-bfe3-dac502259ad0.png ? ?四：總結ACE_Engine框架整體代碼較復雜，涉及的類也比較多。本文簡單介紹了一個ACE組件從前端的頁面描述，到中間層三棵樹的創(chuàng)建和屬性傳遞，以及最終進行UI布局和繪制的整個過程。該過程簡單總結一下就是：JS頁面 —> Dom樹 —> Component樹 —> Render樹，最后繪制Render樹。大家只要理解這個基本過程，在結合代碼關注重點流程。相信一定能夠對ACE_Engine框架的代碼有整體的理解。再此基礎上可以進行ACE組件的增強功能開發(fā)，包括新增一個ACE組件等。 文章轉自：鴻湖萬聯(lián) 參考：新增一個類Web范式組件開發(fā)指南：https://gitee.com/yan-shuifeng/arkui_docs/blob/master/wiki/Ace1.0前端新增組件開發(fā)指南%EF%BC%9A以新增MyCircle組件為例_ver1.0.md 新增一個聲明式范式組件開發(fā)指南https://gitee.com/yan-shuifeng/arkui_docs/blob/master/wiki/Ace2.0前端新增組件開發(fā)指南%EF%BC%9A以新增MyCircle組件為例_ver1.0.md 更多熱點文章閱讀
      • 玩轉OpenHarmony PID：教你打造兩輪平衡車
      • 基于 OpenHarmony 的智聯(lián)北斗海防系統(tǒng)
      • 玩轉OpenHarmony智能家居：如何實現(xiàn)樹莓派“碰一碰”設備控制
      • 帶你玩轉OpenHarmony AI：基于Seetaface2的人臉識別
      • 帶你玩轉OpenHarmony AI：打造智能語音子系統(tǒng)

      提示：本文由電子發(fā)燒友社區(qū)發(fā)布，轉載請注明以上來源。如需社區(qū)合作及入群交流，請?zhí)砑游⑿臙EFans0806，或者發(fā)郵箱liuyong@huaqiu.com。

      原文標題：OpenHarmony ACE 代碼框架總結

      文章出處：【微信公眾號：電子發(fā)燒友開源社區(qū)】歡迎添加關注！文章轉載請注明出處。


      聲明：本文內容及配圖由入駐作者撰寫或者入駐合作網(wǎng)站授權轉載。文章觀點僅代表作者本人，不代表電子發(fā)燒友網(wǎng)立場。文章及其配圖僅供工程師學習之用，如有內容侵權或者其他違規(guī)問題，請聯(lián)系本站處理。 舉報投訴

      原文標題：OpenHarmony ACE 代碼框架總結

      文章出處：【微信號：HarmonyOS_Community，微信公眾號：電子發(fā)燒友開源社區(qū)】歡迎添加關注！文章轉載請注明出處。

      收藏 人收藏

        評論

        相關推薦

        迅為RK3568開發(fā)板篇OpenHarmony實操HDF驅動控制LED-編寫內核 LED HDF 驅動程序

        接下來編譯 LED 驅動，該驅動用于在基于華為設備框架（HDF）的系統(tǒng)中控制 LED 燈的開關，完整代碼如下所示： 更多內容可以關注：迅為RK3568開發(fā)板篇OpenHarmony
        發(fā)表于 01-17 15:13

        OpenHarmony程序分析框架論文入選ICSE 2025

        　　近日，ICSE 2025軟件工程實踐Track放榜，面向OpenAtom OpenHarmony(以下簡稱“OpenHarmony”)的ArkTS程序分析基礎框架--方舟程序分析器(論文題目為
        的頭像 發(fā)表于 01-02 13:41 ?181次閱讀
        <b class='flag-5'>OpenHarmony</b>程序分析<b class='flag-5'>框架</b>論文入選ICSE 2025

        一加Ace 5系列正式發(fā)布

        一加 Ace 5系列正式發(fā)布。該系列中，一加 Ace 5 Pro搭載全新的驍龍8至尊版移動平臺，一加 Ace 5則搭載第三代驍龍8移動平臺。兩款新機在性能、屏幕、設計以及影像等方面帶來全方位升級，為用戶打造出更加硬核的電競傳奇體
        的頭像 發(fā)表于 12-27 11:52 ?247次閱讀

        【龍芯2K0300蜂鳥板試用】OpenHarmony代碼

        收到龍芯2K0300蜂鳥開發(fā)板后，對開發(fā)板做了一些了解和研究，現(xiàn)將OpenHarmony代碼提供給大家測試，也希望大家能更多的認識龍芯2K0300蜂鳥開發(fā)板，下面先簡單介紹一下這塊開發(fā)板。 廣東
        發(fā)表于 09-18 11:42

        400萬！深開鴻OpenHarmony主倉代碼貢獻量再創(chuàng)里程碑！

        2024年7月8日，據(jù)OpenAtomOpenHarmony（以下簡稱“OpenHarmony”）官網(wǎng)顯示，深開鴻在OpenHarmony社區(qū)主倉代碼貢獻總量超過400萬行，在華為以外
        的頭像 發(fā)表于 07-09 08:33 ?377次閱讀
        400萬！深開鴻<b class='flag-5'>OpenHarmony</b>主倉<b class='flag-5'>代碼</b>貢獻量再創(chuàng)里程碑！

        鴻蒙開發(fā)ArkUI-X基礎知識：【ArkUI代碼工程及構建介紹】

        ArkUI作為OpenHarmony的默認開發(fā)框架，在本項目（ArkUI-X）中需要做到一套代碼同時支持多平臺構建，所以會采取共倉開發(fā)的方式，部分倉直接指向OpenHarmony相關開
        的頭像 發(fā)表于 05-25 16:45 ?2151次閱讀
        鴻蒙開發(fā)ArkUI-X基礎知識：【ArkUI<b class='flag-5'>代碼</b>工程及構建介紹】

        鴻蒙ArkUI-X跨平臺開發(fā)：【命令行工具（ACE Tools）】

        ACE Tools是一套為ArkUI-X項目跨平臺應用開發(fā)者提供的命令行工具，支持在Windows/Ubuntu/macOS平臺運行，用于構建OpenHarmony/HarmonyOS、Android和iOS平臺的應用程序，其功能包括開發(fā)環(huán)境檢查，新建項目，編譯打包，安裝
        的頭像 發(fā)表于 05-21 17:39 ?1914次閱讀
        鴻蒙ArkUI-X跨平臺開發(fā)：【命令行工具（<b class='flag-5'>ACE</b> Tools）】

        【開源鴻蒙】下載OpenHarmony 4.1 Release源代碼

        本文介紹了如何下載開源鴻蒙（OpenHarmony）操作系統(tǒng) 4.1 Release版本的源代碼，該方法同樣可以用于下載OpenHarmony最新開發(fā)版本（master分支）或者4.0 Release、3.2 Release等發(fā)
        的頭像 發(fā)表于 04-27 23:16 ?1003次閱讀
        【開源鴻蒙】下載<b class='flag-5'>OpenHarmony</b> 4.1 Release源<b class='flag-5'>代碼</b>

        鴻蒙開發(fā)學習：【OpenHarmony HAR】

        OpenHarmony js/ts三方庫使用的是OpenHarmony靜態(tài)共享包，即HAR(Harmony Archive)，可以包含js/ts代碼、c++庫、資源和配置文件。通過HAR，可以實現(xiàn)
        的頭像 發(fā)表于 03-18 16:27 ?786次閱讀

        【六】Purple Pi OH開發(fā)板帶你7天入門OpenHarmony！

        今天我們來從OpenHarmony簡介、環(huán)境搭建、創(chuàng)建第一個OpenHarmony項目等方面開始OpenHarmony應用開發(fā)的第一步。一.OpenHarmony簡介
        的頭像 發(fā)表于 03-14 08:31 ?575次閱讀
        【六】Purple Pi OH開發(fā)板帶你7天入門<b class='flag-5'>OpenHarmony</b>！

        介紹一種OpenAtom OpenHarmony輕量系統(tǒng)適配方案

        本文在不改變原有系統(tǒng)基礎框架的基礎上， 介紹了一種OpenAtom OpenHarmony（以下簡稱“OpenHarmony”）輕量系統(tǒng)適配方案。
        的頭像 發(fā)表于 03-05 09:24 ?1252次閱讀
        介紹一種OpenAtom <b class='flag-5'>OpenHarmony</b>輕量系統(tǒng)適配方案

        OpenHarmony4.0源碼解析之媒體框架

        媒體框架簡介 媒體框架 multimedia_player_framework 主要提供音視頻的錄制與播放功能。 框架簡介 從框架圖中可以看出，媒體
        的頭像 發(fā)表于 02-26 22:05 ?1073次閱讀
        <b class='flag-5'>OpenHarmony</b>4.0源碼解析之媒體<b class='flag-5'>框架</b>

        [鴻蒙]OpenHarmony4.0的Rust開發(fā)

        。 OpenHarmony 為了集成 C/C++ 代碼和提升編譯速度，使用了 GN + Ninja 的編譯構建系統(tǒng)。GN 的構建語言簡潔易讀，Ninja 的匯編級編譯規(guī)則直接高效。 為了在 OpenHarmony
        的頭像 發(fā)表于 02-26 17:28 ?943次閱讀
        [鴻蒙]<b class='flag-5'>OpenHarmony</b>4.0的Rust開發(fā)

        【鴻蒙】OpenHarmony 4.0藍牙代碼結構簡析

        OpenHarmony 4.0藍牙代碼結構簡析前言 OpenHarmony 4.0上藍牙倉和目錄結構進行一次較大整改，本文基于4.0以上版本對藍牙代碼進行分析，便于讀者快速了解和學習
        的頭像 發(fā)表于 02-26 16:08 ?1650次閱讀
        【鴻蒙】<b class='flag-5'>OpenHarmony</b> 4.0藍牙<b class='flag-5'>代碼</b>結構簡析

        OpenHarmony 之 NAPI 框架介紹

        環(huán)境中的 JS 變量與方法。 OpenHarmony 中的 NAPI OpenAtom OpenHarmony（以下簡稱 “OpenHarmony”）應用層基于 javascript 語言開發(fā)，而系統(tǒng)
        的頭像 發(fā)表于 02-01 17:34 ?745次閱讀
        <b class='flag-5'>OpenHarmony</b> 之 NAPI <b class='flag-5'>框架</b>介紹