如何以编程方式从 WebView 中的全屏退出？答案

【问题标题】：How to programmatically exit from full screen in WebView?如何以编程方式从 WebView 中的全屏退出？
【发布时间】：2021-06-28 12:46:05
【问题描述】：

我的 Widget 树看起来像这样，

Widget build(context) {
 return Consumer<SocketModel>(
  builder: (ctx, model, snapshot) {
    if(model.forceLeave == true) {
      return Text("Your time is up")
    }
    return WebViewWithAHtmlPlayer()
  }
 )
}

上面的代码不是真正的代码，但为了清楚起见，我删除了大部分部分。这就是基本上发生的事情。 webview里面的html播放器可以播放视频。我有一个套接字连接，它跟踪时间并且在超时后forceLeave 变为真，这导致运行if 条件。

当我不使 html 视频播放器全屏时，此方法有效。但是，如果forceLeave 在我在 html 播放器上全屏显示时变为真，则屏幕将变为空白，背景为白色。由于我禁用了后退按钮，我的应用程序就像冻结一样（但实际上不是。）

如何退出全屏视图？

我试过了， SystemChrome.restoreSystemUIOverlays() 在 WebView 包装小部件的处置中。但它仍然没有退出全屏视图。

如何在上述受控结构中正确退出当前全屏视图？例如，有没有办法做类似的事情，

  builder: (ctx, model, snapshot) {
    if(model.forceLeave == true) {
      exitFullScreen() // <-- Do something like this ? 
      return Text("Your time is up")
    }
    return WebViewWithAHtmlPlayer()
  }

【问题讨论】：

标签： flutter flutter-inappwebview

【解决方案1】：

import "dart:html"

document.exitFullscreen();

就是这样:)

【讨论】：

【解决方案2】：

我没有找到从 Flutter 代码中退出全屏的方法。所以我做了这样的事情。在我设置超时方法的地方，

Future.delayed(
  Duration(seconds: timeLeft
      ),
  () {
    // Here I force the webview to exit from full screen before I disconnect
    controller.evaluateJavascript(source: "document.exitFullscreen()");

    Future.delayed(Duration(milliseconds: 100), () {
      socketDao.socket.disconnect(); // this cause to `forceLeave` becomes true
    });
  },
);

【讨论】：