Android设备上flutter_webview高度超2048时崩溃问题求助

这个Android特有的问题确实存在，根源是通过onPageFinished获取长页面高度后，给外部Container设置了超出Android视图系统承载上限的高度值，导致渲染崩溃。以下是几个可行的临时规避方案：

方案1：限制最大高度，启用外部滚动 #

不给Container设置动态获取的页面高度，而是固定为屏幕高度，再用SingleChildScrollView包裹WebView，由滚动组件处理长页面的滚动逻辑，彻底避免超大高度值的问题：

Container(
  height: MediaQuery.of(context).size.height,
  child: SingleChildScrollView(
    child: WebView(
      initialUrl: '你的文章链接',
      javascriptMode: JavascriptMode.unrestricted,
      onPageFinished: (url) {
        // 仍可保留高度获取逻辑用于其他需求，但无需设置给Container
        webViewController.runJavascriptReturningResult("document.body.scrollHeight")
            .then((height) {
          // 比如记录高度到本地，或做其他业务逻辑
        });
      },
    ),
  ),
)

方案2：对获取的高度做安全校验 #

如果必须动态设置Container高度，给高度值加两道限制：延迟获取（避免页面未完全渲染导致的异常值）+ 阈值截断（超过屏幕高度N倍就强制用阈值）：

onPageFinished: (url) {
  // 延迟300ms让页面渲染稳定
  Future.delayed(const Duration(milliseconds: 300), () {
    webViewController.runJavascriptReturningResult("document.body.scrollHeight")
        .then((height) {
      double? pageHeight = double.tryParse(height);
      if (pageHeight != null) {
        // 限制最大高度为屏幕高度的20倍，可根据实际情况调整
        double safeHeight = pageHeight > MediaQuery.of(context).size.height * 20
            ? MediaQuery.of(context).size.height * 20
            : pageHeight;
        setState(() {
          containerHeight = safeHeight;
        });
      }
    });
  });
}

方案3：使用WebView内置滚动替代外部适配 #

直接让WebView自身处理滚动，不给外部Container设置动态高度，只设置最小高度保证初始显示：

Container(
  constraints: BoxConstraints(
    minHeight: MediaQuery.of(context).size.height,
  ),
  child: WebView(
    initialUrl: '你的文章链接',
    javascriptMode: JavascriptMode.unrestricted,
    // 启用WebView内部垂直滚动
    gestureRecognizers: <Factory<OneSequenceGestureRecognizer>>{
      Factory<OneSequenceGestureRecognizer>(
        () => VerticalDragGestureRecognizer(),
      ),
    },
  ),
)

这些方案都是临时规避手段，核心是避免让Android视图系统处理超出承载能力的超大高度。目前官方仍在跟进该问题，待后续版本修复后可移除这些临时处理。

内容的提问来源于stack exchange，提问作者JamJoo