flutter boost如何使用

我在项目里集成了Flutter Boost，但不太清楚具体该怎么使用。想请教几个问题：

  1. 如何正确初始化Flutter Boost？需要在哪里配置路由？
  2. Native和Flutter页面之间如何跳转和传参？
  3. 返回键和页面生命周期该怎么处理？
  4. 有没有完整的示例代码可以参考？

目前文档看得一知半解，希望能得到详细的使用指导。

2 回复

Flutter Boost是Flutter混合开发框架，用于在原生应用中嵌入Flutter页面。使用方法：

  1. 在原生端初始化FlutterBoost。
  2. 通过FlutterBoost.singleton.open打开Flutter页面。
  3. 使用FlutterBoost.singleton.close关闭页面。
  4. 通过FlutterBoostContainer管理页面生命周期。

适用于Android和iOS平台。

更多关于flutter boost如何使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


Flutter Boost 是 Flutter 官方推荐的混合开发框架，用于在原生应用（如 Android 和 iOS）中嵌入和管理 Flutter 页面。以下是基本使用步骤：

1. 添加依赖

在 pubspec.yaml 中添加依赖：

dependencies:
  flutter_boost: ^4.0.0  # 使用最新版本

2. 初始化 Flutter Boost

在 main.dart 中初始化：

void main() {
  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  @override
  void initState() {
    super.initState();
    // 注册 Flutter 页面
    FlutterBoost.singleton.registerPageBuilders({
      'flutterPage': (String pageName, Map<String, dynamic> params, String? uniqueId) {
        return FlutterPage(params: params);
      },
    });
  }

  @override
  Widget build(BuildContext context) {
    return FlutterBoostApp(
      routeFactory: (settings, uniqueId) => PageRouteBuilder<dynamic>(
        settings: settings,
        pageBuilder: (_, __, ___) => FlutterPage(params: settings.arguments),
      ),
    );
  }
}

3. Flutter 页面实现

创建 Flutter 页面，支持参数传递：

class FlutterPage extends StatelessWidget {
  final Map<String, dynamic> params;

  FlutterPage({required this.params});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text(params['title'] ?? 'Flutter Page')),
      body: Center(child: Text('参数: ${params['data']}')),
    );
  }
}

4. 原生端集成

  • Android：在 MainActivity 中初始化 FlutterBoost，并通过 FlutterBoostRouteBuilder 打开页面。
  • iOS：在 AppDelegate 中初始化，使用 FlutterBoostPlugin 跳转。

5. 页面跳转

在 Flutter 中跳转到原生或其他 Flutter 页面：

// 打开 Flutter 页面
FlutterBoost.singleton.open('flutterPage', arguments: {'title': '示例', 'data': 'Hello'});

// 关闭页面
FlutterBoost.singleton.close();

6. 生命周期管理

通过 FlutterBoostContainerState 监听页面生命周期（如 onShow、onHide）。

注意事项

  • 确保 Flutter 与原生端的页面路由配置一致。
  • 参数传递需通过 arguments 序列化。

以上步骤可帮助快速集成 Flutter Boost，实现混合栈管理。具体细节可参考官方文档。

回到顶部