Flutter接入FlutterBoost进行跳转，并实现Flutter与Native的通信

氦客

已于 2022-05-12 18:40:38 修改

阅读量4.1k

点赞数

分类专栏：跨平台移动开发文章标签： Flutter FlutterBoost Android 接入跳转

于 2021-11-18 16:37:26 首次发布

本文链接：https://blog.csdn.net/EthanCo/article/details/121399323

版权

跨平台移动开发专栏收录该内容

21 篇文章 1 订阅

订阅专栏

FlutterBoost是什么

FlutterBoost是阿里系闲鱼技术团队开源的 Flutter 插件。
FlutterBoost的理念是将Flutter像Webview那样来使用。
在现有应用程序中同时管理Native页面和Flutter页面并非易事，FlutterBoost帮你处理页面的映射和跳转，使你只需关心页面的名字和参数即可（通常可以是URL）。

如何接入FlutterBoost

一般参考FlutterBoost官方文档接入即可，但是我在接入的时候，遇到了一些坑，这里我记录一下，大家可以结合着官方文档来看。

新建FlutterNative并依赖到Native项目中

这部分可以看我另一篇博客 Flutter与Android Native进行混合开发
目录结构如下
在这里插入图片描述

Dart部分

添加FlutterBoost依赖到yaml文件

flutter_boost:
  git:
    url: 'https://github.com/alibaba/flutter_boost.git'
    ref: 'v3.0-preview.16'

注意点 : 空安全

我接入的时间是2021年11月，这时候，默认新建的Flutter是支持空安全的，而FlutterBoost默认版本是不支持空安全的。
所以解决方法有两种
1.将flutter项目的pubspec.yaml中，dart的版本改为2.7.0

environment:
  #sdk: ">=2.12.0 <3.0.0"
  sdk: ">=2.7.0 <3.0.0"

2.使用支持空安全的FlutterBoost版本

flutter_boost:
	git:
	    url: 'https://github.com/alibaba/flutter_boost.git'
	    ref: 'v3.0-null-safety-preview.16'

详见 GitHub issue : Flutter 空安全 null-safety #1327

注意点 : CupertinoPageRoute

CupertinoPageRoute这个类是IOS UI风格的，需要引入对应的包

import 'package:flutter/cupertino.dart';

当然也可以用Android 风格的MaterialPageRoute，对应的引包如下

import 'package:flutter/material.dart';

从Flutter 跳转到 Native

BoostNavigator.instance.push("native_main")
//BoostNavigator.instance.push("native_second")
	.then((value) => print("return:${value?.toString()}"));

跳转到下一个Flutter页面

BoostNavigator.instance.push("generalSettings");

回到上一个页面

BoostNavigator.instance.pop();

监听某个Flutter页面的生命周期

参照官方文档生命周期API部分
需要注意的是，页面的最外层得用StatefulWidget，不能用StatelessWidget，否则会没有效果。

Android部分

FlutterBoost.instance().setup(this, new FlutterBoostDelegate() {
    @Override
    public void pushNativeRoute(FlutterBoostRouteOptions options) {
        String pageName = options.pageName();
        Log.i("NativeApp", "pageName:" + pageName);
        //这里根据options.pageName来判断你想跳转哪个页面
        Intent intent = null;
        if ("native_main".equals(pageName)){
            intent = new Intent(FlutterBoost.instance().currentActivity(), MainActivity.class);
        }else if("native_second".equals(pageName)){
            intent = new Intent(FlutterBoost.instance().currentActivity(), SecondActivity.class);
        }
        FlutterBoost.instance().currentActivity().startActivityForResult(intent, options.requestCode());
    }

    @Override
    public void pushFlutterRoute(FlutterBoostRouteOptions options) {
        Intent intent = new FlutterBoostActivity.CachedEngineIntentBuilder(FlutterBoostActivity.class)
                .backgroundMode(FlutterActivityLaunchConfigs.BackgroundMode.transparent)
                .destroyEngineWithActivity(false)
                .uniqueId(options.uniqueId())
                .url(options.pageName())
                .urlParams(options.arguments())
                .build(FlutterBoost.instance().currentActivity());
        FlutterBoost.instance().currentActivity().startActivity(intent);
    }
}, engine -> {
    //Channel在这里进行实例化
    new BatteryChannel(engine.getDartExecutor(), this);
});

FlutterBoost.instance().setup中，有以下几个需要实现的方法

pushNativeRoute是从Flutter跳转到Native的时候，执行的方法，这里我们可以通过options.pageName()取到pageName，然后跳转到对应的Native页面。
engine ->{} 中，我们可以实例化Channel，从而实现Flutter和Native之间的通信

从Android Native跳转到Flutter

Map<String, Object> params = new HashMap<>();
       params.put("string", "a string");
       params.put("bool", true);
       params.put("int", 666);

Intent intent = new FlutterBoostActivity.CachedEngineIntentBuilder(FlutterBoostActivity.class)
         .backgroundMode(FlutterActivityLaunchConfigs.BackgroundMode.opaque)
         .destroyEngineWithActivity(false)
         .url("flutterPage") //在main.dart的routerMap中有注册 对应的这个url
         .urlParams(params)
         .build(this);
         startActivity(intent);