声明式UI跨平台
// pages/Index.ets
@Entry
@Component
struct Index {
build() {
Column() {
Text('Hello ArkUI-X!')
.fontSize(20)
.fontColor(Color.Red)
Button('跳转下一页')
.margin(10)
.onClick(() => router.pushUrl({ url: 'pages/Second' }))
}
.width('100%')
.height('100%')
}
}
高性能自渲染引擎
无缝桥接原生能力
// ArkTS侧
import bridge from '@arkui-x.bridge';
const bridgeImpl = bridge.createBridge('NativeModule');
// 调用iOS方法
bridgeImpl.callMethod('getDeviceModel').then(model => {
console.log('Device Model:', model);
});
// iOS侧 (NativeModule.m)
#import
@implementation NativeModule
- (NSString*)getDeviceModel {
return [[UIDevice currentDevice] model];
}
@end
组件与API统一适配
import window from '@ohos.window';
// 设置全屏沉浸式
window.setWindowLayoutFullScreen(true);
// 获取避让区域(刘海屏适配)
const avoidArea = window.getWindowAvoidArea();
# 编译Android应用
ace build -p android
# 编译iOS应用
ace build -p ios
# 编译OpenHarmony应用
ace build -p ohos
// build.gradle (Android模块)
dependencies {
implementation project(':arkui-x')
}
ArkUI-X通过声明式语法、自研渲染引擎和轻量桥接,解决了多平台开发的一致性与性能问题。开发者只需聚焦核心业务逻辑,即可高效输出三端应用,尤其适合:
示例源码及扩展文档详见 ArkUI-X开源仓库。