多个 Flutter 页面或视图

使用场景

Scenarios

如果你正在将 Flutter 集成到现有应用,或者正在将原生应用逐渐迁移到使用 Flutter,你可能会需要在一个工程中添加多个 Flutter 实例,特别是在下述场景下,多 Flutter 实例可能更为有用:

If you’re integrating Flutter into an existing app, or gradually migrating an existing app to use Flutter, you may find yourself wanting to add multiple Flutter instances to the same project. In particular, this can be useful in the following scenarios:

  • 集成了 Flutter 界面的应用,其位置并不在路由栈的叶子节点上,且其可能是混合路由栈,即 native -> Flutter -> native -> Flutter。

    An application where the integrated Flutter screen is not a leaf node of the navigation graph, and the navigation stack might be a hybrid mixture of native -> Flutter -> native -> Flutter.

  • 多个 Flutter view 同时集成在同一个页面上,且同时显示。

    A screen where multiple partial screen Flutter views might be integrated and visible at once.

使用多个 Flutter 实例的优势在于,每一个实例互相独立,各自维护路由栈、UI 和应用状态。这简化了应用程序整体的状态保持考虑,并且进一步模块化。了解更多关于多个 Flutter 使用的动机和场景,请查看 RFC 文档: Multiple Flutters

The advantage of using multiple Flutter instances is that each instance is independent and maintains its own internal navigation stack, UI, and application states. This simplifies the overall application code’s responsibility for state keeping and improves modularity. More details on the scenarios motivating the usage of multiple Flutters can be found at docs.flutter.dev/go/multiple-flutters.

Flutter 2 以及以上的版本针对多 Flutter 实例进行了优化,额外增加的 Flutter 实例只会增加约 180K 的内存占用,这种「固定成本」的降低,可以帮助你更轻松的将 Flutter 加入到现有应用 (add-to-app)。

Flutter 2 and above are optimized for this scenario, with a low incremental memory cost (~180kB) for adding additional Flutter instances. This fixed cost reduction allows the multiple Flutter instance pattern to be used more liberally in your add-to-app integration.

组件

Components

在 Android 和 iOS 上添加多个 Flutter 实例的主要 API 是基于新的 FlutterEngineGroup 类 (Android API, iOS API) 来创建 FlutterEngine 的,而不是通过以前的 FlutterEngine 构造。

The primary API for adding multiple Flutter instances on both Android and iOS is based on a new FlutterEngineGroup class (Android API, iOS API) to construct FlutterEngines, rather than the FlutterEngine constructors used previously.

尽管 FlutterEngine API 的用法简洁明了,但从 FlutterEngineGroup 生成的 FlutterEngine 具有常用共享资源(例如 GPU 上下文、字体度量和隔离线程的快照)的性能优势,从而加快首次渲染的速度、降低延迟并降低内存占用。

Whereas the FlutterEngine API was direct and easier to consume, the FlutterEngine spawned from the same FlutterEngineGroup have the performance advantage of sharing many of the common, reusable resources such as the GPU context, font metrics, and isolate group snapshot, leading to a faster initial rendering latency and lower memory footprint.

  • FlutterEngineGroup 生成的 FlutterEngine 可以用来关联 UI 相关的类,例如 FlutterActivityFlutterViewController,与通常构造缓存的 FlutterEngine 类似。

    FlutterEngines spawned from FlutterEngineGroup can be used to connect to UI classes like FlutterActivity or FlutterViewController in the same way as normally constructed cached FlutterEngines.

  • 第一个 FlutterEngineGroup 生成的 FlutterEngine 不需要持续保活,只要有 1 个可用的 FlutterEngine,就可以随时在各个 FlutterEngine 之间共享资源。

    The first FlutterEngine spawned from the FlutterEngineGroup doesn’t need to continue surviving in order for subsequent FlutterEngines to share resources as long as there’s at least 1 living FlutterEngine at all times.

  • 通过 FlutterEngineGroup 生成的首个 FlutterEngine 与使用先前的构造方法构造的 FlutterEngine 有相同的性能特征

    Creating the very first FlutterEngine from a FlutterEngineGroup has the same performance characteristics as constructing a FlutterEngine using the constructors did previously.

  • 当所有由 FlutterEngineGroup 构造的 FlutterEngine 都被销毁后,下一个创建的 FlutterEngine 与首个创造的性能特征相同。

    When all FlutterEngines from a FlutterEngineGroup are destroyed, the next FlutterEngine created has the same performance characteristics as the very first engine.

  • FlutterEngineGroup 本身不需要持续保活。将其销毁后,已生成的 FlutterEngine 不受影响,但无法继续在现有共享的基础上创建新引擎。

    The FlutterEngineGroup itself doesn’t need to live beyond all of the spawned engines. Destroying the FlutterEngineGroup doesn’t affect existing spawned FlutterEngines but does remove the ability to spawn additional FlutterEngines that share resources with existing spawned engines.

实例之间相互通讯

Communication

多个 Flutter 实例之间相互通讯可以通过 平台通道 或者 Pigeon 进行。可以在 Issue 72009 里查阅我们关于多 Flutter 实例通讯和增强功能计划的路线图。

Communication between Flutter instances is handled using platform channels (or Pigeon) through the host platform. To see our roadmap on communication, or other planned work on enhancing multiple Flutter instances, see Issue 72009.

示例

Samples

您可以在 GitHub 仓库 上找到在 Android 和 iOS 上使用 FlutterEngineGroup 的示例。

You can find a sample demonstrating how to use FlutterEngineGroup on both Android and iOS on GitHub.

A sample demonstrating multiple-Flutters