步骤
- flutter create --template =module my_flutter_module
- 签名 模拟器或真机
- flutter build har --debug
- 新建ohos_app工程
- 导入Har包
- 修改配置文件: /oh-package.json5
- 修改配置文件: /entry/oh-package.json5
- 修改文件: EntryAbility, FlutterContainerPage,Index
- 签名运行真机
脚本
js
flutter create --template=module my_flutter_module
flutter clean
flutter pub get
flutter build har --debug
oh-package.json5
json
"overrides": {
"@ohos/flutter_ohos": "file:./har/flutter_embedding_debug.har",
"flutter_native_arm64_v8a": "file:./har/arm64_v8a_debug.har",
"@ohos/flutter_module": "file:./har/flutter_module.har",
}
entry/oh-package.json5
json
"dependencies": {
"@ohos/flutter_ohos": "file:../har/flutter_embedding_debug.har",
"flutter_native_arm64_v8a": "file:../har/arm64_v8a_debug.har",
"@ohos/flutter_module": "file:../har/flutter_module.har"
}
EntryAbility
java
import { FlutterAbility, FlutterEngine } from '@ohos/flutter_ohos';
import { GeneratedPluginRegistrant } from '@ohos/flutter_module';
export default class EntryAbility extends FlutterAbility {
configureFlutterEngine(flutterEngine: FlutterEngine) {
super.configureFlutterEngine(flutterEngine)
GeneratedPluginRegistrant.registerWith(flutterEngine);
}
}
index
java
import { router } from '@kit.ArkUI';
@Entry
@Component
struct Index {
build() {
Column() {
Text('Hello World').fontSize('50fp').fontWeight(FontWeight.Bold)
Blank().height(80)
Button('跳转Flutter').onClick(() => {
router.pushUrl({ url: 'pages/FlutterContainerPage'})
})
}.justifyContent(FlexAlign.Center)
.alignItems(HorizontalAlign.Center)
.width('100%')
.height('100%')
}
}
FlutterContainerPage
java
import { FlutterEntry, FlutterPage, FlutterView } from '@ohos/flutter_ohos'
@Entry
@Component
struct FlutterContainerPage {
private flutterEntry?: FlutterEntry;
private flutterView?: FlutterView;
aboutToAppear() {
this.flutterEntry = new FlutterEntry(getContext(this));
this.flutterEntry.aboutToAppear();
this.flutterView = this.flutterEntry.getFlutterView();
}
aboutToDisappear() {
this.flutterEntry?.aboutToDisappear();
}
onPageShow() {
this.flutterEntry?.onPageShow();
}
onPageHide() {
this.flutterEntry?.onPageHide();
}
build() {
RelativeContainer() {
FlutterPage({ viewId: this.flutterView?.getId()})
}
}
}