如何导航到 Flutter Flame Engine 游戏小部件之外的小部件答案

【问题标题】：How to navigate to widgets outside of a Flutter Flame Engine game widget如何导航到 Flutter Flame Engine 游戏小部件之外的小部件
【发布时间】：2021-10-21 16:18:08
【问题描述】：

是否可以从 Flame Engine 游戏小部件导航到其他 Flutter 小部件？

下面的应用会立即加载游戏小部件。如何在 Game 小部件之外导航到另一个 Flutter 小部件？

Flutter 版本：2.2.3
Dart 版本：2.13.4
火焰引擎版本：flame-1.0.0-rc8

main.dart

import 'package:flame/flame.dart';
import 'package:flame/game.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:my_game.dart';

void main() {
  runApp(
    GameWidget(
      game: MyGame(),
    ),
  );
}

my_game.dart

import 'package:flame/extensions.dart';
import 'package:flame/game.dart';
import 'package:flame/gestures.dart';
import 'package:flutter/gestures.dart';
import 'package:flutter/material.dart';

class MyGame extends BaseGame with TapDetector {
    @override
    void update(double dt) { /* TODO */ }

    @override
    void render(Canvas canvas) { /* TODO */ }

    @override
    void onTapUp(TapUpDetails details) {
        // How to navigate outside of the game widget?
    }
}

【问题讨论】：

我不知道这个包，但也许如果你创建一个普通页面，带有一个开始游戏的按钮，然后使用返回按钮退出游戏？因此，您将 runApp(Game) 更改为普通的 runApp(FirstPage()) 事物，并且在此 FirstPage 上您有打开游戏的按钮？
是的，可以。但游戏中也可能存在会触发导航的状态变化。只是想了解如何从游戏小部件中触发小部件更改。

标签： flutter dart flame

【解决方案1】：

你可以做两件事：

要么将GameWidget 放在Stack 中，然后在Flutter 中通过Navigator 处理导航，并在认为必要时将GameWidget 删除并添加到小部件树中。 Flutter Navigation docs
改用 Flame 中的 Overlays API 来处理 Flame 中的状态。 Flame docs

为了使用叠加层，您可以在创建GameWidget 时添加您希望可访问的叠加层，然后调用game.overlays.add 来渲染特定的小部件，并调用game.overlays.remove 来停止渲染它。

我确实建议您从 rc8 升级到 rc13，因为文档是针对那个版本的，而且总体上更稳定。

【讨论】：