背景
HarmonyOS Next适配开发过程中难买难要参考之前逻辑,但是可能时间较长文档不全,只能参考Android或iOS代码,有些逻辑较重的场景还可以通过AI工具将Android 的Java代码逻辑转成TS完成部分复用。对于一些UI场景只能手动去写,虽然ArkUI写页面效率比较高,但是如果页面比较多,工作量也不小,官方提供了Android APK转ArkTS页面的工具,本文带大家一起体验尝试一波。
工具介绍
UI Generator用于快速生成可编译、可运行的HarmonyOS UI工程,支持基于已有UI布局文件(XML),快速生成对应的HarmonyOS UI代码,其中包含HarmonyOS基础工程、页面布局、组件及属性和资源文件等。
需要使用使用DevEco Studio 5.0.3.700及以上版本。
工具配置
在DevEco-Studio中,打开设置页面,点击插件,找到已安装的UI Generator插件后选择开启:
应用、确认后,在工具栏工具中点击“Generate Project from …":
第一次进入需要同意用户协议:
接下来选择Android的安装包apk路径和Android SDK路径:
接着选择要转换的xml布局:
选择下一步:
这里面Destination Path为生成HarmonyOS Next公测的路径和名称,点击确认后开始转换,转换日志如下:
2025-01-22 12:08:02,885 In /Users/shen/Library/Caches/Huawei/DevEcoStudio5.0/ui-generation/build/app-debug
2025-01-22 12:08:02,960 sdkdir: /Users/shen/Library/Caches/Huawei/DevEcoStudio5.0/ui-generation/maple-sdk
2025-01-22 12:08:02,960 apkpath: /Users/shen/Downloads/app-debug.apk
2025-01-22 12:08:02,960 androidsdk: /Users/shen/Library/Android/sdk
2025-01-22 12:08:02,960 aapt: /Users/shen/Library/Android/sdk/build-tools/34.0.0/aapt2
2025-01-22 12:08:02,962 bash dumpres.sh /Users/shen/Downloads/app-debug.apk /Users/shen/Library/Android/sdk/build-tools/34.0.0/aapt2
2025-01-22 12:08:05,916 run dump apk resources finished.
2025-01-22 12:08:05,917 =================================================
2025-01-22 12:08:05,917 /Users/shen/Library/Caches/Huawei/DevEcoStudio5.0/ui-generation/build/app-debug/maple-decompile.sh exec success
2025-01-22 12:08:05,917 =================================================
2025-01-22 12:08:05,920 In /Users/shen/Library/Caches/Huawei/DevEcoStudio5.0/ui-generation/build/app-debug/runs
2025-01-22 12:08:05,939 dexdir: /Users/shen/Library/Caches/Huawei/DevEcoStudio5.0/ui-generation/build/app-debug/unzip
2025-01-22 12:08:05,939 androiddir: /Users/shen/Library/Android/sdk
2025-01-22 12:08:05,939 componentspath: /Users/shen/Library/Caches/Huawei/DevEcoStudio5.0/ui-generation/build/app-debug/runs/components.txt
2025-01-22 12:08:05,950 bash /Users/shen/Library/Caches/Huawei/DevEcoStudio5.0/ui-generation/maple-sdk/bin/component_analyze.sh --dexdump-dir=/Users/shen/Library/Android/sdk/build-tools/34.0.0/dexdump --dex-dir=/Users/shen/Library/Caches/Huawei/DevEcoStudio5.0/ui-generation/build/app-debug/unzip --mplsdk-dir=/Users/shen/Library/Caches/Huawei/DevEcoStudio5.0/ui-generation/maple-sdk --component-include=false /Users/shen/Library/Caches/Huawei/DevEcoStudio5.0/ui-generation/build/app-debug/runs/components.txt
2025-01-22 12:08:05,965 dexdump-dir: /Users/shen/Library/Android/sdk/build-tools/34.0.0/dexdump
2025-01-22 12:08:05,965 dex-dir: /Users/shen/Library/Caches/Huawei/DevEcoStudio5.0/ui-generation/build/app-debug/unzip
2025-01-22 12:08:05,966 analysis start!
2025-01-22 12:08:05,967 Darwin
2025-01-22 12:08:05,967 xml analysis start
2025-01-22 12:08:05,975 =================================================
2025-01-22 12:08:05,975 /Users/shen/Library/Caches/Huawei/DevEcoStudio5.0/ui-generation/build/app-debug/runs/maple-files-dex.sh exec success
2025-01-22 12:08:05,975 =================================================
2025-01-22 12:08:44,098 In /Users/shen/Library/Caches/Huawei/DevEcoStudio5.0/ui-generation/maple-sdk
2025-01-22 12:08:44,105 Darwin
2025-01-22 12:08:44,129 target is xml file, no need to analyze dex dependency, exit dex-crop.sh
2025-01-22 12:08:44,130 =================================================
2025-01-22 12:08:44,130 /Users/shen/Library/Caches/Huawei/DevEcoStudio5.0/ui-generation/maple-sdk/bin/dex_crop.sh exec success
2025-01-22 12:08:44,130 =================================================
2025-01-22 12:08:44,143 In /Users/shen/Library/Caches/Huawei/DevEcoStudio5.0/ui-generation/build/app-debug/components
2025-01-22 12:08:44,173 cp: /Users/shen/Library/Caches/Huawei/DevEcoStudio5.0/ui-generation/maple-sdk/maple_deps/host_maple/bin_darwin/dex2mpl is a directory (not copied).
2025-01-22 12:08:44,180 cp: /Users/shen/Library/Caches/Huawei/DevEcoStudio5.0/ui-generation/maple-sdk/autodeps/bin_darwin/dex2deps is a directory (not copied).
2025-01-22 12:08:44,181 cp: /Users/shen/Library/Caches/Huawei/DevEcoStudio5.0/ui-generation/maple-sdk/autodeps/bin_darwin/gendeps is a directory (not copied).
2025-01-22 12:08:44,183 chmod: /Users/shen/Library/Caches/Huawei/DevEcoStudio5.0/ui-generation/maple-sdk/autodeps/bin/*: No such file or directory
2025-01-22 12:08:44,185 maplebinary: /Users/shen/Library/Caches/Huawei/DevEcoStudio5.0/ui-generation/maple-sdk/maple_deps/host_maple/bin/maple
2025-01-22 12:08:44,185 xmldir: /Users/shen/Library/Caches/Huawei/DevEcoStudio5.0/ui-generation/build/app-debug/decompile
2025-01-22 12:08:44,185 component: layout/activity_preview.xml
2025-01-22 12:08:44,185 sdkdir: /Users/shen/Library/Caches/Huawei/DevEcoStudio5.0/ui-generation/maple-sdk
2025-01-22 12:08:44,185 apkname: app-debug
2025-01-22 12:08:44,185 sourcedir:
2025-01-22 12:08:44,185 mplfile: /Users/shen/Library/Caches/Huawei/DevEcoStudio5.0/ui-generation/build/app-debug/components/test.mpl
2025-01-22 12:08:44,185 dexdump:
2025-01-22 12:08:44,187 /Users/shen/Library/Caches/Huawei/DevEcoStudio5.0/ui-generation/maple-sdk/maple_deps/host_maple/bin/maple --infile /Users/shen/Library/Caches/Huawei/DevEcoStudio5.0/ui-generation/build/app-debug/components/test.mpl --me-opt="--O2 --quiet --no-nativeopt --meverify --threads=4 --no-ignoreipa --enable-ea" --mpl2mpl-opt="--O2 --quiet --regnativefunc --deferred-visit --no-nativeopt --maplelinker --emitVtableImpl --maplelinker-nolocal --sva --android-xml=/Users/shen/Library/Caches/Huawei/DevEcoStudio5.0/ui-generation/build/app-debug/decompile --xml-to-analyze=layout/activity_preview.xml --class-to-analyze=activity_preview --config-path=/Users/shen/Library/Caches/Huawei/DevEcoStudio5.0/ui-generation/maple-sdk/config_files" --save-temps
2025-01-22 12:08:46,235 Sighandler : signal handler isn't implemented for non-unix os
2025-01-22 12:08:46,235 Sighandler : signal handler isn't implemented for non-unix os
2025-01-22 12:08:46,235 Sighandler : signal handler isn't implemented for non-unix os
2025-01-22 12:08:46,235 Sighandler : signal handler isn't implemented for non-unix os
2025-01-22 12:08:46,235 Sighandler : signal handler isn't implemented for non-unix os
2025-01-22 12:08:46,235 Sighandler : signal handler isn't implemented for non-unix os
2025-01-22 12:08:46,235 Sighandler : signal handler isn't implemented for non-unix os
2025-01-22 12:08:46,763 android activities cnt : 10
2025-01-22 12:08:46,763 => Log File: android-ui-ir-activity_preview.log
2025-01-22 12:08:46,763 ==========> Save UI Generate Report to activity_preview_generation_report.json <==========
2025-01-22 12:08:46,769 =================================================
2025-01-22 12:08:46,769 /Users/shen/Library/Caches/Huawei/DevEcoStudio5.0/ui-generation/build/app-debug/components/maple.sh exec success
2025-01-22 12:08:46,769 =================================================
2025-01-22 12:08:46,784 In /Users/shen/Library/Caches/Huawei/DevEcoStudio5.0/ui-generation/build/app-debug/components
2025-01-22 12:08:46,787 Darwin
2025-01-22 12:08:46,793 dexdump-dir: /Users/shen/Library/Android/sdk
2025-01-22 12:08:46,793 dex-dir: /Users/shen/Library/Caches/Huawei/DevEcoStudio5.0/ui-generation/build/app-debug/unzip
2025-01-22 12:08:46,793 cropping analysis start!
2025-01-22 12:08:46,793 searching for all dexdump
2025-01-22 12:08:48,812 searching for all dexdump
2025-01-22 12:08:48,812 /Users/shen/Library/Android/sdk/build-tools/30.0.2/dexdump
2025-01-22 12:08:48,812 searching for all dex file
2025-01-22 12:08:48,815 1 dexdump location founded.
2025-01-22 12:08:49,409 =================================================
2025-01-22 12:08:49,409 /Users/shen/Library/Caches/Huawei/DevEcoStudio5.0/ui-generation/maple-sdk/bin/get_base_class.sh exec success
2025-01-22 12:08:49,409 =================================================
2025-01-22 12:08:49,458 Generation IR Time Elapsed: 5.368000 s
2025-01-22 12:09:06,886 Generation Success, Generated Project Location: 2025-01-22 12:09:06,886 /Users/shen/UIGenerationProjects/UIGeneration_app-debug_activity_preview
2025-01-22 12:09:06,886 Generation Project Time Elapsed: 0.129000 s
打开新工程,生成的页面位于entry > src > main > ets > pages目录下,可以在Previewer中查看页面预览效果。生成的新工程内的entry > src > main > resources目录包含文本、图像、颜色资源。
这里以一个简单示例为例,Android xml:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout android:id="@+id/container"
android:layout_width="213dp"
android:layout_height="wrap_content"
android:orientation="vertical">
</LinearLayout></ScrollView>
生成ArkTS代码:
@Entry
@Component
export struct activity_preview {
build() {
/*
* FIXME: Unhandled property 'android:orientation'
*/ Scroll() {
Column()
.id('container')
.width('213vp')
.alignItems(HorizontalAlign.Start)
}
.align(Alignment.TopStart)
.width('100%')
.height('100%')
}
}
不支持生成的组件、属性会以注释的形式给出,方便后续定位修改。
总结
虽然有些自定义组件或者属性无法直接转换,但是对于复杂页面,帮助我们生成大的框架和大部分代码也可以极大的提升我们开发效率,推荐大家尝试。