如何移除Flutter_inappwebview的滚动回弹光晕效果？

• Android端专属配置
  Android WebView的滚动光晕是系统默认行为，直接在InAppWebView的初始化设置里禁用即可：

  initialSettings: InAppWebViewSettings(
    androidOverScrollMode: AndroidOverScrollMode.OVER_SCROLL_NEVER,
  )
  

• iOS端专属配置
  iOS的滚动回弹光晕属于UIScrollView特性，通过关闭iOS回弹开关就能消除：

  initialSettings: InAppWebViewSettings(
    iosBounceEnabled: false,
  )
  

• 网页内部通用处理
  如果原生配置没生效，大概率是网页自身的滚动容器导致的，可以注入JS代码全局禁用：

  onLoadStop: (controller, url) async {
    await controller.evaluateJavascript(source: """
      // 禁用整个文档的滚动回弹光晕
      document.documentElement.style.overscrollBehavior = 'none';
      // 若网页有自定义滚动容器，单独设置
      document.querySelectorAll('.scroll-box').forEach(el => {
        el.style.overscrollBehavior = 'none';
      });
    """);
  }
  

• 组合配置（确保彻底生效）
  建议同时配置原生属性+JS注入，双重保险：

  InAppWebView(
    initialUrlRequest: URLRequest(url: Uri.parse("你的网页地址")),
    initialSettings: InAppWebViewSettings(
      androidOverScrollMode: AndroidOverScrollMode.OVER_SCROLL_NEVER,
      iosBounceEnabled: false,
    ),
    onLoadStop: (controller, url) async {
      await controller.evaluateJavascript(source: """
        document.documentElement.style.overscrollBehavior = 'none';
      """);
    },
  )
  

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