鴻蒙ArkUI如何開發跨平臺應用?
一、前言
提到跨平臺,要先理解什麼是“平臺”,這裡的平臺,就是指應用程式的執行環境,例如作業系統,或者是Web瀏覽器,具體的像HarmonyOS、Android、iOS、或者瀏覽器,都可以叫做平臺。
跨平臺框架,就是一個應用的開發框架,開發者基於這個框架開發的應用,可以分別在不同的平臺上執行,業界比較知名的比如:React Native、Flutter或者各種小程式框架,都可以稱之為跨平臺框架。
跨平臺框架介紹:
-
1、可以減少開發者的學習成本;
-
2、增加程式碼複用,節省開發的成本;
-
3、減少對各個平臺差異的適配。
假設需求是要在三個平臺上開發同樣功能的應用,如果每個平臺都需要10個單位的工作量,那麼總共將花費30個單位的工作量。如果使用了跨平臺框架,通過程式碼複用,那麼可能只需要一半的工作量,甚至更少,這也是為什麼開發者都在探索不同的跨平臺方案。
二、ArkUI跨平臺能力介紹
為滿足HarmonyOS應用生態建設對於跨平臺開發的需求,我們正在和相關的合作伙伴定向開源構建ArkUI的跨平臺能力,目標先支援HarmonyOS、OpenHarmony、Android、iOS平臺,後續還將逐步增加對更多平臺的支援。這樣,開發者基於一套主程式碼,就可以構建可支援多平臺的精美的高效能應用。
ArkUI的定位包含以下幾個方面: - 1、ArkUI作為HarmonyOS原生的應用框架,能力將預置在HarmonyOS中;
-
2、ArkUI作為所有原子化服務的基礎執行環境,如各類服務及萬能卡片;
-
3、ArkUI也將作為一個通用的跨平臺框架來開發多平臺的應用。
在ArkUI的架構設計之初就把跨平臺作為一個重要的設計原則,從程式碼的架構上就對各個平臺的呼叫做了解耦,可以方便的移植到不同的平臺,同時使用的圖形引擎也是可以跨平臺的,所有基於它的元件都是自渲染的,所以有較好的效能和渲染一致性。同時使用了NAPI作為JS API的擴充套件機制,可以將相同定義的API擴充套件到不同平臺進行實現。
接下來將從元件支援度、應用工程跨平臺、API能力邊界等6個緯度詳細介紹ArkUI具備的跨平臺能力。
1、跨平臺能力——元件支援度:
ArkUI跨平臺目前具備的一些元件能力,主要為以下兩方面:
1)OpenHarmony支援的基礎元件,都會進行支援。
2)提供一些高階元件能力,比如XComponent和它的相關機制。
2、跨平臺能力——應用工程跨平臺:
對於一個完整的HarmonyOS應用,要做到跨平臺執行,還需要業務邏輯和它使用的API、資源都能跨平臺。
對於業務邏輯,使用@ohos的標準API,跨平臺的目標是:使用這些API開發的邏輯儘可能的直接在不同平臺使用。
3、跨平臺能力——API能力邊界:
API大致分為以下幾類,支援策略也略有不同:
1)平臺無關的API,這部分是可以直接移植到不同平臺;
2)依賴平臺橋接的API,需要使用API擴充套件機制在不同平臺分別橋接;
3)不同平臺可能不是一一對應的API,通用的基本能力部分可以在不同平臺分別橋接;
4)平臺專有的API,依賴系統的特有能力,無法做到跨平臺。
4、跨平臺能力——API擴充套件機制:
ArkUI提供了一套API的擴充套件機制,可以方便的去實現相同定義的API在不同平臺上使用。
擴充套件機制整體是複用NAPI機制,也是HarmonyOS上預設擴充套件API的機制,同時提供了JS->C++->Java/ObjectC的程式碼互調的機制。這套機制也同樣適用於三方外掛擴充套件或者開發者自己業務的擴充套件。
以下面程式碼為例,通過標準的NAPI進行介面的擴充套件,同時也支援註冊一個Java的類,在介面呼叫時會動態載入這個類,最終呼叫到Java的實現中。
``` // 註冊外掛,匯出JS方法
static napi_value TestPluginExport(napi_env env, napi_value exports) { static napi_property_descriptor desc[] = { DECLARE_NAPI_FUNCTION("hello", JSTestPluginHello), }; NAPI_CALL(env, napi_define_properties(env, exports, sizeof(desc) / sizeof(desc[0]), desc)); return exports; }
static napi_value JSTestPluginHello(napi_env env, napi_callback_info info) { auto plugin = TestPlugin::Create(); plugin->Hello(); … }
static void TestPluginJniRegister() { const char className[] = "ohos.ace.plugin.testplugin.TestPlugin"; OH_Plugin_RegisterPlugin(&TestPluginJni::Register, className); }
extern "C" attribute((constructor)) void TestPluginRegister() { napi_module_register(&testPluginModule); OH_Plugin_RunTaskOnPlatform(&TestPluginJniRegister); } ```
```java // Java 業務邏輯 package ohos.ace.plugin.testplugin;
public class TestPlugin { public TestPlugin(Context context) { ... } public void hello() { Log.i(LOG_TAG, "hello from java"); } } ```
5、跨平臺能力——命令列工具
ArkUI還將提供一個命令列工具,可以支援Windows、Mac、Linux的開發環境,支援建立跨平臺工程,可以構建出HarmonyOS、Android以及iOS的應用程式,並可以生成目標平臺的開發工程,如Android Studio/XCode。
一些常用的命令如下,涵蓋了從建立工程到執行打包的常用功能:
打包常用功能
6、跨平臺能力——DevEco Studio跨平臺支援:
後續還將在DevEco Studio上加入對跨平臺的支援,增加能力如下:
1)建立工程時可以通過跨平臺模板建立一個支援跨平臺的工程;
2)可以支援編譯出Android/ iOS上的安裝除錯包;
3)支援發現和連線不同裝置真機和模擬器;
4)支援應用工程匯出為Android應用工程和iOS應用工程,方便原生能力擴充或混合開發。
三、如何使用ArkUI開發跨平臺應用
瞭解了ArkUI的跨平臺能力之後,下面我們用“健康飲食”應用開發具體案例介紹使用ArkUI開發跨HarmonyOS、Android及iOS三大平臺的完整流程。
1、應用工程建立:
首先建立一個跨平臺工程,我們以使用命令列工具為例。
1)先使用npm install安裝相關的依賴包;
2)通過ace check檢查執行環境,可以根據提示安裝相關依賴的軟體;
3)通過ace create建立跨平臺應用的工程,可以支援類Web正規化或宣告式正規化。
建立好的工程的目錄結構如下圖所示,可以看到不同平臺的工程檔案,同時這裡的source目錄下,存放的就是跨平臺通用的程式碼結構。
程式碼結構
2、開發及除錯:
開發應用的過程就和開發一個普通的HarmonyOS應用一樣,進行UI介面與邏輯的設計,使用DevEco Studio進行開發,然後實機執行及除錯。
開發及除錯
3、構建與釋出:
有兩種方式進行構建,一是通過命令列“ace build”可以直接進行構建;二是通過目標平臺的工程進行構建,如下圖所示,可以直接通過Android Studio或XCode構建出對應平臺的安裝包。
使用Android Studio構建
使用 XCode 構建
4、安裝與執行:
構建完成後,可以通過“ace install”命令進行安裝執行,下面就是“健康飲食”同一個應用在HarmonyOS端、Android端和iOS端上的執行效果。
HarmonyOS 端執行效果
Android端執行效果
IOS 端執行效果
上面提到的這些ArkUI跨平臺能力,將在近期進行開源,感興趣的開發者可以持續關注。
- 鴻蒙ArkUI如何開發跨平臺應用?
- HarmonyOS玩轉ArkUI動效 - 水母動畫
- Compose挑燈夜看 - 照亮手機螢幕裡面的書本內容
- 順手修復了Jetpack Compose官方文件中的一個多點觸控示例的Bug
- 正確實踐Jetpack SplashScreen API —— 在所有Android系統上使用總結,內含原理分析
- Jetpack Compose處理“導航欄、狀態列、鍵盤” 影響內容顯示的問題集錦
- 閒聊Android懸浮的“系統文字選擇選單”和“ActionMode解析”——附上原理分析
- Jetpack Compose實現bringToFront功能——附上原理分析
- Android跨程序傳大圖思考及實現——附上原理分析