【HarmonyOS】ArkUI-X 跨平台框架入门详解(一)

【HarmonyOS】ArkUI-X 跨平台框架入门详解(一)

一、前言

1、ArkUI-X框架是什么?

ArkUI-X是在ArkUI开发框架的基础上,进行扩展。支持多个OS平台,目前支持OpenHarmony、HarmonyOS、Android、 iOS。 2、ArkUI-X目前的能力现状: 在gitCode可以查询到跨平台框架的源码和使用说明等。不过目前维护推进速度比较慢,很多ArkUI上的API在框架上还不支持。并且安卓上操作效果也一般。

二、配置开发环境

1、以Android端开发为例,Android开发环境这里就不赘述了,可以当官方去看下。

2、DevEco IDE下载ArkUI-X的SDK: File - Setting 选择 ArkUI-X,选择下载地址路径,选择自己需要的SDK版本。

3、配置ACE Tool (ArkUI Cross-Platform Environment)的环境变量

typescript 复制代码
在Path系统环境变量,新增arkui-x的tolchains-bin地址即可,示例:
D:\CodeAPP\DevEcoStudio\ArkUI-X-SDK\17\arkui-x\toolchains\bin

4、检查ACE Tool的环境

typescript 复制代码
ace check -v

5、检查多平台环境变量

三、创建DEMO工程

1、在File-Project-Create Project,选择Application中的ArkUI-X Emptry Ability 示例项目: 2、编译ArkUI-X框架项目: 在项目结构上看,与普通鸿蒙项目区别不大,只是多了arkui-x的文件夹。 DevEco Studio可打包生成不同平台的应用包。在主菜单栏,单击Build > Build Hap(s)/APP(s) > Build APP(s)。 当插入设备编译时,会检查环境,如有提示弹框,根据提示进行配置: 3、编译项目后,使用Ace或者AndroidStudio安装apk到安卓手机。

typescript 复制代码
@Entry
@Component
struct Index {
  @State message: string = 'Hello World';

  build() {
    Row() {
      Column() {
        Text(this.message)
          .fontSize($r('app.float.page_text_font_size'))
          .fontWeight(FontWeight.Bold)
          .onClick(() => {
            this.message = 'Welcome ArkUI-X';
          })
      }
      .width('100%')
    }
    .height('100%')
  }
}

我们可以看到示例项目中,page页面内的写法,与普通鸿蒙ArkTS写法是一致。跨平台处理都在arkui-x文件中:

相关推荐
孟凡华3 小时前
鸿蒙-SeekBar
harmonyos
Keya3 小时前
鸿蒙开发样式复用:@Styles、@Extend与AttributeModifier深度对比
前端·分布式·harmonyos
ilmari11 小时前
HarmonyOS 基于Network Kit封装的网络请求工具
android·flutter·harmonyos
大雷神11 小时前
HarmonyOS中调用C/C++代码(NDK)
harmonyos
simple_lau11 小时前
鸿蒙资源加载深度解析:$r与$rawfile的性能差异与最佳实践
harmonyos·arkts·arkui
zkmall13 小时前
移动商城平台适配:ZKmall开源商城鸿蒙 / 小程序端开发要点
小程序·开源·harmonyos
前端菜鸟日常19 小时前
鸿蒙组件装饰器深度解析:@Component vs @ComponentV2
华为·harmonyos
AlbertZein21 小时前
HarmonyOS5 源码分析 —— ‘状态管理’如何管理的(1)?
架构·harmonyos
鹿鸣天涯1 天前
鸿蒙OS 系统安全
华为·系统安全·harmonyos
kymjs张涛1 天前
HarmonyOS Next 全兼容,三端统一的路由跳转方案
harmonyos