鸿蒙ArkUI-X跨端应用开发,一套代码构建多平台应用

news/2024/5/20 2:33:00 标签: harmonyos, 华为, ArkUI, ArkUI-X, ArkTs, Android, ts

文章目录

  • 一、项目介绍
  • 二、技术架构
  • 三、Gitee仓库地址
  • 四、ArkUI-X开发者文档
  • 五、快速开始——环境准备
    • 1、下载DevEco Studio,版本V4.0 Beta2以上
    • 2、打开DevEco,下载相关环境配置
    • 3、配置开发环境
      • 3.1、OpenHarmony SDK
      • 3.2、安装ArkUI-X SDK
      • 3.2、Android SDK
  • 五、快速开始——创建Hello World项目
  • 六、编译构建生成跨平台应用
  • 六、报错了

一、项目介绍

ArkUI是一套构建分布式应用的声明式UI开发框架。它具备简洁自然的UI信息语法、丰富的UI组件、多维的状态管理,以及实时界面预览等相关能力,帮助您提升应用开发效率,并能在多种设备上实现生动而流畅的用户体验。
详情可参考ArkUI框架介绍

ArkUI-X进一步将ArkUI扩展到了多个OS平台:目前支持OpenHarmony、HarmonyOS、Android、 iOS,后续会逐步增加更多平台支持。
开发者基于一套主代码,就可以构建支持多平台的精美、高性能应用。

二、技术架构

ArkUI跨平台框架整体架构如下图所示,详细设计请参考ArkUI跨平台设计总体说明。请添加图片描述

三、Gitee仓库地址

https://gitee.com/arkui-x

ArkUIX_13">四、ArkUI-X开发者文档

https://gitee.com/arkui-x/docs/blob/master/zh-cn/README.md

五、快速开始——环境准备

让我们来试试开发个Hello World应用。

1、下载DevEco Studio,版本V4.0 Beta2以上

打开ArkUi开发工具配套关系。
请添加图片描述
点击下载Windows(64-bit)

2、打开DevEco,下载相关环境配置

  • 提示是要选择本地的NodeJS,还是下载NodeJS;
  • 提示是要选择本地的ohpm,还是下载ohpm;
  • 点下一步。
  • 提示是要选择本地的HarmonyOS SDK,还是下载HarmonyOS SDK;
  • 点下一步。
  • 点同意协议
  • 点下一步,开始下载…
  • 完成,点Finish.

3、配置开发环境

3.1、OpenHarmony SDK

  • 3.1.1、DevEco在File > Settings > SDK 下,(macOS为DevEco Studio > Preferences > SDK)
  • 选择OpenHarmony SDK
    请添加图片描述

我们可以看到OpenHarmony SDK的Location是空的
点击Location右侧的Edit,为SDK选择存储路径,一直点击Next和accept,开始下载安装后,点击Finish.

  • 3.1.2、下载API Version10 五个软件工具
    请添加图片描述

ArkUIX_SDK_43">3.2、安装ArkUI-X SDK

  • 3.2.1、DevEco在File > Settings > ArkUI-X下,点击Location右侧的Edit,为SDK选择存储路径。
    请添加图片描述
  • 3.2.2、在弹出的SDK Setup页面选择存储路径,一直点击Next,直到完成SDK的安装后,点击Finish。

Android_SDK_47">3.2、Android SDK

假设你要生成安卓应用,你还得下载Android SDK。
这里我就不下载配置了。


五、快速开始——创建Hello World项目

1、在DevEco Studio中导入ArkUI-X Sample,快速创建跨平台工程。
请添加图片描述
2、选择OpenHarmony,选择ArkUI-X/HelloWorld,点击Next。
请添加图片描述
3、在工程配置页面,填写Project name和Project location,点击Finish,等待Sample工程导入完成。

六、编译构建生成跨平台应用

请添加图片描述

  • 选择Build Hap编译成鸿蒙应用。
  • 选择Build App编译成鸿蒙应用,并且生成安卓和IOS项目。

六、报错了

compileSdkVersion and releaseType of the app do not match the apiVersion and releaseType on the device.
compileSdk不匹配。
build-profile.json5文件compileSdk版本是10,毕竟官方教程让我选API Version10 ,
而远程设备SDK自多也就版本9,所以报错了…
手头上的鸿蒙4平板也不行。
请添加图片描述
请添加图片描述
暂时搁置了,以后有空再看。


http://www.niftyadmin.cn/n/5129242.html

相关文章

电脑入门:电脑专业英语500词,供新手参考

1. file n. 文件;v. 保存文件 2. command n. 命令,指令 3. use v. 使用,用途 4. program n. 程序 5. line n. (数据,程序)行,线路 6. if conj. 如果 7. display vt. 显示,显示器 8. set v. 设置,n. 集合 9. key n. 键,关键字,关键码 10. list n. 列表,显示,…

Mac 安装nvm

安装方案: 1. 从github下载nvm仓库到 ~/目录 地址:https://github.com/nvm-sh/nvm.git git clone https://github.com/nvm-sh/nvm.git 2. 进入nvm目录中执行install.sh等待执行完成,执行的操作方法就是直接将文件拖入到终端然后回车。 3.…

【计算机网络笔记】Cookie技术

系列文章目录 什么是计算机网络? 什么是网络协议? 计算机网络的结构 数据交换之电路交换 数据交换之报文交换和分组交换 分组交换 vs 电路交换 计算机网络性能(1)——速率、带宽、延迟 计算机网络性能(2)…

Kafka - 3.x 图解Broker总体工作流程

文章目录 Zk中存储的kafka的信息Kafka Broker总体工作流程1. broker启动后向zk中注册2. Controller谁先启动注册,谁说了算3. 由选举出来的Controller监听brokers节点的变化4. Controller决定leader选举5. Controller将节点信息上传到Zk中6. 其他Controller从zk中同步…

在VMware Workstation Pro安装win7

1.下载 地址 2.创建虚拟机 3.选择需要安装的系统镜像 4.选择系统版本 通常情况下选择 Windows 7 Ultimate 旗舰版,点击下一步,若提示产品密钥,则忽略 5.虚拟机命名 虚拟机保存位置保持默认即可,如果有需求可以更换位置 6…

如何检测租用的香港服务器是不是CN2线路呢?

CN2,是中国电信新一代融合承载网络,是为电信自身关键业务和具有QoS保证的SLA业务服务的,可以提供高性能的网络指 标,平均单向时延、最大单向时延、单向丢包率等均属于顶尖水平。简单地说,CN2和普通网络,就像…

如何在Windows和Linux系统上监听文件夹的变动?

文章目录 如何在Windows和Linux系统上监听文件夹的变动?读写文件文件系统的操作缓冲和流文件改变事件 如何在Windows和Linux系统上监听文件夹的变动? libuv库实现了监听整个文件夹的修改。本文详细介绍libuv库文件读写和监听的的实现方法。libuv库开发了…

浏览器事件循环 (event loop)

进程与线程 进程 进程的概念 进程是操作系统中的一个程序或者一个程序的一次执行过程,是一个动态的概念,是程序在执行过程中分配和管理资源的基本单位,是操作系统结构的基础。 简单的来说,就是一个程序运行开辟的一块内存空间&a…