初识鸿蒙跨平台开发框架ArkUI-X

HarmonyOS是一款面向万物互联时代的、全新的分布式操作系统。在传统的单设备系统能力基础上，HarmonyOS提出了基于同一套系统能力、适配多种终端形态的分布式理念，能够支持手机、平板、智能穿戴、智慧屏、车机等多种终端设备，提供全场景（移动办公、运动健康、社交通信、媒体娱乐等）业务能力。

ArkTS 是华为自研的开发语言。它在TypeScript（简称TS）的基础上，匹配 ArkUI 框架，扩展了声明式 UI 、状态管理等相应的能力，让开发者以更简洁、更自然的方式开发跨端应用。关于ArkTS，可以参考：ArkTS基础知识

ArkUI-X 进一步将 ArkUI 扩展到了多个 OS 平台：目前支持 OpenHarmony、HarmonyOS、Android、iOS，后续会逐步增加更多平台支持。到时，开发者就可以基于一套主代码，就能够构建支持多平台应用。以下是ArkUI跨平台框架整体架构的示意图。

image.png

一、环境搭建

1.1 下载IDE

DevEco Studio

首先，需要下载支持 ArkUI-X 套件的华为开发工具 DevEco ，版本为 4.0 以上，目前只能下载预览版进行体验。下载地址：

软件版本备注
OpenHarmony4.0 Beta2NA
Public SDKOhos_sdk_public 4.0.9.6 (API Version 10 Beta2)面向应用开发者提供，不包含需要使用系统权限的系统接口。通过DevEco Studio默认获取的SDK为Public SDK。
HUAWEI DevEco Studio（可选）4.0 Beta2OpenHarmony应用开发推荐使用。获取方式：Windows(64-bit)SHA256校验码：ae9b228fb1f79e99441e10bdcf347ebfc42266be8b170bbce3c9764ba32d82a4Mac(X86)SHA256校验码：5c9afc5b1262868b58376155f1e8576d33c1ade8b01091edc4d7d397cd34026cMac(ARM)SHA256校验码：ea6c98cafd5036e4a6fd46b0b1cde3a306953b1eef423d5940f1af7c632205d6
HUAWEI DevEco Device Tool（可选）4.0 Beta1OpenHarmony智能设备集成开发环境推荐使用。获取方式：点击跳转至下载页面

下载完成之后，安装就可以了，这东西是基于 IDEA 做的，和 Android Studio 体验差不多。

Android Studio

由于ArkUI-X 可以将 ArkTS 项目编译为一个 Android 项目，需要需要使用 Android Studio 来进行打包。Android Studio 安装方法就不赘述了。下载地址：

Download Android Studio & App Tools - Android Developers (google.cn)

同样，我们可以需要搭建iOS的原生环境，下载Xcode等，不再过多的说明。

1.2 安装OpenHarmony SDK

安装完后，当我们启动DevEco Studio工具的时候，系统提示我们需要安装Node，这是因为HarmonyOS应用程序也支持使用JS进行开发，我们只需要按照提示进行安装即可，如下图。

image.png

相关依赖下载完成，进入 IDE 首页后，先不急着创建项目，需要先安装 OpenHarmony SDK，类似于Android的SDK。

image.png

然后，打开Preferences面板，选择OpenHarmony，如下图。

image.png

选择后需要指定一下路径，然后它会进行一些依赖下载，等它下载完成。下载完成后，勾选 API Version 10 相关的选项，点击确定等它下载完成。

image.png

1.3 安装 ArkUI-X SDK

OpenHarmony SDK 安装完成后，接下来还需要安装 ArkUI-X SDK，了。同样的在设置里面选择 ArkUI-X ，指定路径，等待下载完成。

image.png

1.4 环境变量

ArkUI-X 需要设置好相应的环境变量才能正确使用。若缺少相关环境变量，会有弹窗提示。所以在装好 Android Studio 后，需要将 Android SDK 添加至环境变量中（如果之前添加过，就不用管了）：

Windows

在此【电脑】 >【 属性】 > 【高级系统设置】 > 【高级】 > 【环境变量】中，新建系统变量。变量名为ANDROID_HOME，变量值为Android SDK安装目录。
 
image.png

macOS

打开终端工具，执行以下命令，打开.bash_profile文件，然后配置Android SDK安装目录，命令如下：

vi ~/.bash_profile
export ANDROID_HOME=/Users/xxx/Library/Android/sdk
source ~/.bash_profile

环境变量配置完成后，关闭并重启DevEco Studio。

二、快速上手

2.1 创建工程

首先，我们创建一个普通的Harmony OS工程，如下图。

image.png

然后，按照提示填写工程名、包名、编译环境等内容。

image.png
在创建了一个 Harmon OS 工程后，我们就进入到了 IDE 的实际界面，在此就可以找到创建 OpenHarmony 工程的选项。为什么要 OpenHarmony 呢？首先要认识到 HarmonOS 和 OpenHarmony 的区别。

这个具体区别大家可以自己去对比下工程结构，可能会被当做引战引起某些人不满意，当然我们可以理解为是借鉴，此处只说明一点 ArkUI-X 是基于 OpenHarmony 的技术。

我们在上面菜单栏选择 【File】->【New】-> 【Import - Import Sample】，如下图。

image.png

然后，系统会让我们选择导入的Sample，此处选择 OpenHarmony 以及ArkUI-X 下的 HelloWorld。

image.png
接着，系统会去下载对应的依赖。不过，我执行导入的时候，遇到了一个网络超时的问题，所以我直接下载了源码，然后再本地导入。

image.png

源码的下载链接如下：https://gitee.com/arkui-x/samples

依赖安装完成，在右上角选择 Previewer ，点击【运行】按钮，就可以通过 OpenHarmony 预览界面进行预览。

image.png

2.2 移入代码

回到之前创建的 Harmony OS 工程，将里面的 UI 代码移入到OpenHarmony工程中。首先，进入 Harmony OS 工程的 entry - src - main 目录，复制里面的 ets、resources 和module.json5文件。然后替换OpenHarmony工程中对应的三个文件，也可以直接覆盖。

image.png

然后，再次预览并运行OpenHarmony工程，就可以看到之前通过 Harmony OS 工程模板创建的界面显示在了这个 OpenHarmony 预览界面上，如下图。

image.png

2.3 编译 OpenHarmony 工程

打开OpenHarmony工程，在 DevEco 菜单栏，选择 Build App，在编译为 OpenHarmony App 的同时，也会生成 Android 与 IOS 项目。

image.png

编译完成后，可以看到生成的 Android 工程了，如下图。

image.png

2.4 在 Android 环境运行

由于 ArkUI-X 编译出来的为 native 文件只能运行在ARM环境上，所以Android Studio 提供的模拟器如果为 x64 架构是无法预览程序的。

接着，将上述生成的 Android 工程使用 Android Studio打开，等待 Gradle 初始化完成，并编译完成，如下图。

image.png

然后，我们就可以使用Android Studio来运行项目，也可以使用Android Studio打包apk。

image.png

同样的，我们也可以使用Xcode来打开iOS的源码，运行以及打包。

三、应用工程结构

3.1 工程目录结构

跨平台应用工程目录结构，包含一套为ArkUI开发者提供的应用工程模板，提供构建OpenHarmony应用，HarmonyOS应用，Android应用，iOS应用的能力。工程结构目录如下：

ArkUI-X应用工程目录结构
  ├── .arkui-x
  │   ├── android                 // Android平台相关代码
  │   └── ios                     // iOS平台相关代码
  ├── .hvigor
  ├── .idea
  ├── AppScope
  ├── entry
  ├── hvigor
  ├── oh_modules
  ├── build-profile.json5
  ├── hvigorfile.ts
  ├── local.properties
  └── oh-package.json5

此应用目录结构设计思想是从OpenHarmony应用工程原生支持跨平台角度出发，在OpenHarmony应用工程之上叠加Android和iOS应用工程，ArkTS代码和resources资源在OpenHarmony侧完成编译，Native代码仍在各自平台应用工程中完成编译。

3.2 编译构建

理解OpenHarmony应用工程的编译构建需要理解几个概念：

  • ArkTS源码：ArkTS源码通过OpenHarmony SDK工具链生成abc（Ark Byte Code），并分别拷贝到Android和iOS应用工程，作为平台应用资源进行管理。
  • ArkUI应用资源：ArkUI Resources资源也通过OpenHarmony SDK工具链进行编译，编译后的ArkUI资源分别拷贝到Android和iOS应用工程，作为平台应用资源进行管理。
  • ArkUI框架资源：ArkUI框架资源随ArkUI-X SDK进行发布，应用构建时会自动打包到ArkUI-X应用中，可保证ArkUI-X应用在各平台上UX渲染一致性。

综上所述，Android平台上通过assets管理ArkTS编译产物、ArkUI应用资源和ArkUI框架资源，iOS平台上通过Bundle Resources管理ArkTS编译产物、ArkUI应用资源和ArkUI框架资源。

下面说一下原生应用工程结构：

Android应用工程结构

ArkUI-X Android应用工程
├── app
│   ├── libs
│   │   ├── arkui_android_adapter.jar                   // ArkUI-X跨平台适配层，在SDK中发布
│   │   └── arm64-v8a
│   │       └── libarkui_android.so                     // ArkUI-X跨平台引擎库，在SDK中发布
│   ├── src
│   │   ├── androidTest
│   │   ├── main
│   │   │   ├── assets
│   │   │   │   └── arkui-x                             // ArkUI应用编译后的字节码文件和Resources，作为资源文件存放在assets/arkui-x中
│   │   │   │       ├── entry                           // ArkUI单个模块的编译结果
│   │   │   │       │   ├── ets                         // ArkUI单个模块代码的编译结果：包括字节码文件以及sourceMap文件
│   │   │   │       │   │   ├── sourceMaps.map
│   │   │   │       │   │   └── modules.abc
│   │   │   │       │   ├── resources.index             // ArkUI单个模块资源的编译结果：resources资源的编译结果
│   │   │   │       │   ├── resources                   // resources资源中的rawfile资源，不会进行编译。
│   │   │   │       │   └── module.json
│   │   │   │       ├── entry_test                      // ohosTest，仅仅Debug模式构建包含。
│   │   │   │       └── systemres                       // ArkUI框架自带的系统资源
│   │   │   ├── java/com/example/mayapp
│   │   │   │   ├── MyApplication.java                  // 基于StageApplication扩展MyApplication
│   │   │   │   └── EntryEntryAbilityActivity.java      // 基于StageActivity扩展EntryEntryAbilityActivity
│   │   │   ├── res
│   │   │   └── AndroidManifest.xml
│   │   └── test
│   ├── build.gradle
│   └── proguard-rules.pro
├── gradle/wrapper
├── build.gradle
├── gradle.properties
├── gradlew
├── gradlew.bat
└── settings.gradle

iOS应用工程结构

ArkUI-X iOS应用工程
├── app.xcodeproj
│   ├── project.xcworkspace
│   └── project.pbxproj
├── app
│   ├── Assets.xcassets
│   ├── Base.Iproj
│   ├── AppDelegate.h
│   ├── AppDelegate.m                               // 应用入口, 驱动StageApplication的生命周期
│   ├── EntryEntryAbilityViewController.m           // 基于StageViewController扩展EntryEntryViewController
│   ├── Info.plist
│   └── main.m
├── arkui-x                                         // ArkUI应用编译后的字节码文件和Resources，作为资源文件存放在assets/arkui-x中
│   ├── entry                                       // ArkUI单个模块的编译结果
│   │   ├── ets                                     // ArkUI单个模块代码的编译结果：包括字节码文件以及sourceMap文件
│   │   │   ├── sourceMaps.map
│   │   │   └── modules.abc
│   │   ├── resources.index                         // ArkUI单个模块资源的编译结果：resources资源的编译结果
│   │   ├── resources                               // resources资源中的rawfile资源，不会进行编译。
│   │   └── module.json
│   ├── entry_test                                  // ohosTest，仅仅Debug模式构建包含。
│   └── systemres                                   // ArkUI框架自带的系统资源
└── frameworks                                      // ArkUI跨平台Framework动态库：包含ArkUI-X的框架以及插件

关于华为 ArkTS + ArkUI-X 跨平台开发框架的基础知识就介绍到这里，从中我看到了React Native、flutter的影子，事实上，从官方给出的架构图也能看到它们的影子，毕竟站在巨人的肩膀上，才能看的更远。相信，随着鸿蒙的崛起，ArkTS + ArkUI-X技术的到来，国产自研技术将不再是 PPT ，不再是“套壳”。

文中涉及的代码链接如下：https://gitee.com/arkui-x/samples

参考链接：

https://gitee.com/arkui-x
https://juejin.cn/post/7253240772840701989

1691649545113.jpg

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：/a/72208.html

如若内容造成侵权/违法违规/事实不符，请联系我们进行投诉反馈qq邮箱809451989@qq.com，一经查实，立即删除！

相关文章

adb用法，安卓的用户CA证书放到系统CA证书下

adb用法，安卓的用户CA证书放到系统CA证书下

设备需root！！设备需root！！设备需root！！ ​​​​​​​测试环境：redmi 5 plus、miui10 9.9.2dev（安卓8.1）、已root win下安装手机USB驱动（过程略&#xff0c…
阅读更多...
OPENCV C++(十二)模板匹配

OPENCV C++(十二)模板匹配

正常模板匹配函数 matchTemplate(img, templatee, resultMat, 0);//模板匹配 这里0代表的是方法，一般默认为0就ok img是输入图像 templatee是模板 resultmat是输出 1、cv::TM_SQDIFF：该方法使用平方差进行匹配，因此最佳的匹配结果在结果为…
阅读更多...
R语言5_安装Giotto

R语言5_安装Giotto

环境Ubuntu22/20, R4.1. 已开启科学上网。 第一步，更新服务器环境，进入终端，键入如下命令， apt-get update apt install libcurl4-openssl-dev libssl-dev libxml2-dev libcairo2-dev libgtk-3-dev libhdf5-dev libmagick9-dev …
阅读更多...
[HDLBits] Exams/2012 q1g

[HDLBits] Exams/2012 q1g

Consider the function f shown in the Karnaugh map below. Implement this function. (The original exam question asked for simplified SOP and POS forms of the function.) //
阅读更多...
第三章 图论 No.9有向图的强连通与半连通分量

第三章 图论 No.9有向图的强连通与半连通分量

文章目录 定义Tarjan求SCC1174. 受欢迎的牛367. 学校网络1175. 最大半连通子图368. 银河 定义 连通分量是无向图的概念，yxc说错了，不要被误导 强连通分量：在一个有向图中，对于分量中的任意两点u，v，一定能从…
阅读更多...
Easys Excel的表格导入(读)导出(写)-----java

Easys Excel的表格导入(读)导出(写)-----java

一,EasyExcel官网: 可以学习一些新知识: EasyExcel官方文档 - 基于Java的Excel处理工具 | Easy Excel 二,为什么要使用easyexcle excel的一些优点和缺点 java解析excel的框架有很多 ： poi jxl,存在问题：非常的消耗内存， easyexcel 我们…
阅读更多...
arcgis栅格数据之最佳路径分析

arcgis栅格数据之最佳路径分析

1、打开arcmap，加载数据，需要对影像进行监督分类，如下： 这里任选一种监督分类的方法（最大似然法），如下： 这里会先生成一个.ecd文件，然后再利用.ecd文件对影像进行分类。如…
阅读更多...
新知识：Monkey 改进版之 App Crawler

新知识：Monkey 改进版之 App Crawler

原生Monkey 大家知道Monkey是Android平台上进行压力稳定性测试的工具，通过Monkey可以模拟用户触摸屏幕、滑动、按键等伪随机用户事件来对设备上的程序进行压力测试。而原生的Android Monkey存在一些缺陷： 事件太过于随机，测试有效性大打折扣…
阅读更多...
软件设计师（七）面向对象技术

软件设计师（七）面向对象技术

面向对象： Object-Oriented， 是一种以客观世界中的对象为中心的开发方法。 面向对象方法有Booch方法、Coad方法和OMT方法等。推出了同一建模语言UML。 面向对象方法包括面向对象分析、面向对象设计和面向对象实现。 一、面向对象基础 1、面向对象的基本…
阅读更多...
207、仿真-51单片机脉搏心率与血氧报警Proteus仿真设计(程序+Proteus仿真+配套资料等)

207、仿真-51单片机脉搏心率与血氧报警Proteus仿真设计(程序+Proteus仿真+配套资料等)

毕设帮助、开题指导、技术解答(有偿)见文未 目录 一、硬件设计 二、设计功能 三、Proteus仿真图 四、程序源码 资料包括： 需要完整的资料可以点击下面的名片加下我，找我要资源压缩包的百度网盘下载地址及提取码。 方案选择 单片机的选择 方案一&a…
阅读更多...
Java SpringBoot 加载 yml 配置文件中字典项

Java SpringBoot 加载 yml 配置文件中字典项

实际项目中，如果将该类信息放配置文件中的话，一般会结合Nocas一起使用 将字典数据，配置在 yml 文件中，通过加载yml将数据加载到 Map中 Spring Boot 中 yml 配置、引用其它 yml 中的配置。# 在配置文件目录（如&#xff…
阅读更多...
Mask RCNN网络结构以及整体流程的详细解读

Mask RCNN网络结构以及整体流程的详细解读

文章目录 1、概述2、Backbone3、RPN网络3.1、anchor的生成3.2、anchor的标注/分配3.3、分类预测和bbox回归3.4、NMS生成最终的anchor 4、ROI Head4.1、ROI Align4.2、cls head和bbox head4.3、mask head 1、概述 Mask RCNN是在Faster RCNN的基础上增加了mask head用于实例分割…
阅读更多...
Games101学习笔记 - MVP矩阵

Games101学习笔记 - MVP矩阵

MV矩阵（模型视图变换） 目的，把摄像机通过变换移动的世界坐标远点，并且朝向与Z轴的负方向相同。这个变换就是模型试图变换。 因为移动了相机，如果想保持正确的渲染的话，那么对应的物体需要要和相机保持相对…
阅读更多...
Apache DolphinScheduler 3.1.8 版本发布，修复 SeaTunnel 相关 Bug

Apache DolphinScheduler 3.1.8 版本发布，修复 SeaTunnel 相关 Bug

近日，Apache DolphinScheduler 发布了 3.1.8 版本。此版本主要基于 3.1.7 版本进行了 bug 修复，共计修复 16 个 bug, 1 个 doc, 2 个 chore。 其中修复了以下几个较为重要的问题： 修复在构建 SeaTunnel 任务节点的参数时错误的判断条件修复 …
阅读更多...
【TX 企业微信私有化历史版本 API 信息泄露】

【TX 企业微信私有化历史版本 API 信息泄露】

目录 影响版本 复现过程 修复方式 影响版本 影响私有化部署： toB toG版微信 2.5.x 版本 2.6.930000 版本以下 危险程度：高危。攻击者可以进行获取企业的部门信息，员工信息，如权限较高包括应用获取，记录文件等等均…
阅读更多...
学习笔记整理-JS-02-基本类型

学习笔记整理-JS-02-基本类型

文章目录 一、数据类型简介和检测1. JavaScript中两大数据类型 二、基本数据类型1. 数字类型2. 字符串类型3. 布尔类型4. undefined类型5. null 三、数据类型的转换1. 数据类型的转换 四、重点内容 一、数据类型简介和检测 1. JavaScript中两大数据类型 基本数据类型 Number S…
阅读更多...
Kotlin反射访问androidx.collection.LruCache类私有变量

Kotlin反射访问androidx.collection.LruCache类私有变量

Kotlin反射访问androidx.collection.LruCache类私有变量 androidx.collection.LruCache类中定义了一个名为map的LinkedHashMap，map存储了所有LruCache的数据，有时候需要遍历访问该LinkedHashMap，取出里面的值，但是LruCache代码实…
阅读更多...
勇敢牛牛，爱吃青草

勇敢牛牛，爱吃青草

牛顿问题（牛吃草问题 / 消长问题） 牛顿问题（牛吃草问题/消长问题） 牛顿问题（牛吃草问题/消长问题） 牧场上有一片青草，每天都生长得一样快。这片青草供给 10 头牛吃，可以吃 22 天&…
阅读更多...
使用阿里云服务器搭建Discuz论坛网站教程基于CentOS系统

使用阿里云服务器搭建Discuz论坛网站教程基于CentOS系统

阿里云百科分享使用阿里云服务器建站教程，本文是搭建Discuz论坛，Discuz!是一款通用的社区论坛软件系统，它采用PHP和MySQL组合的基础架构，为您提供高效的论坛解决方案。本文介绍如何在CentOS 7操作系统的ECS实例上搭建Discuz! X3.4…
阅读更多...
JMeter处理接口签名之BeanShell实现MD5加密

JMeter处理接口签名之BeanShell实现MD5加密

项目A需要给项目B提供一个接口，这个接口加密了，现在需要测试这个接口，需要怎么编写脚本呢？实现接口签名的方式有两种：BeanShell实现MD5加密和函数助手实现MD5加密，之前已经分享过了函数助手实现MD5加密&…
阅读更多...
最新文章

Copyright @ 2022~2023