在 Flutter 中保持路由存活答案

【问题标题】：Keeping a route alive in Flutter在 Flutter 中保持路由存活
【发布时间】：2023-02-24 07:35:03
【问题描述】：

我有一个可以看到多张卡片的 flutter 应用程序。这些卡片是可点击的，并且会显示一个带有定制查看器的 InAppWebView，它存在于我链接到的网站上。然而，这个 InAppWebView 的加载对应用程序来说是相当费力的，我想尽可能多地预加载它。

很难提供很多细节，因为这是与工作相关的私人信息，所以我不能说得太具体。我也是这里唯一一个使用 Flutter 的人，所以不能指望同事的建议。

我希望通过已经在后台打开它来减少 InAppWebView 的加载时间，然后只是交换到正确的路由而不是从头开始初始化它。这里的问题是 URL 会改变，但这可以在视图内部处理，而不是创建一个全新的 InAppWebView。

简而言之：如何在我的 Flutter 应用程序后台创建小部件/路由，并在必要时切换到它？

【问题讨论】：

标签： flutter flutter-inappwebview

【解决方案1】：

为此使用 IndexedStack。

创建一个要交换的小部件列表（并保持其状态）

 final viewRoutes = const <Widget>[
    Screen1(),
    Screen2(),
    Screen3(),
 ];

然后使用 IndexedStack 交换它们

@override
  Widget build(BuildContext context) {
    return Scaffold(
      body: IndexedStack(
         index: 0, // <--- change this depending on the page
      ),
    );
  }

【讨论】：

【解决方案2】：

也许您可以使用 Stack 和 Visibility 小部件？像这样：

bool _isWebPageVisible = false;

Stack(
  children: <Widget>[
    MainWidget(),
    Visibility(
      visible: _isWebPageVisible,
      child: WebPageWidget()
  ]
)

您可以在需要时更改 _isWebPageVisible。当可见时，WebPageWidget 将出现在 MainWidget 上方。

【讨论】：