Flutter中InAppWebView无法禁用缩放问题求助

你当前的代码已经配置了多数缩放相关参数，但仍无法禁用缩放，大概率是因为目标网页自身的viewport设置允许缩放，或者配置存在冗余冲突。可以按以下步骤调整：

• 移除onWebViewCreated中重复的setSettings调用：你已经在initialSettings里配置了builtInZoomControls: false，重复调用会覆盖其他已配置参数，反而可能导致设置不生效。
• 注入JavaScript强制修改网页viewport：很多网页会自行设置允许缩放的viewport标签，这种情况下需要通过JS强制覆盖该配置。
• 补充平台特定配置：Android和iOS平台需要额外配置才能完全禁用手势缩放。

修改后的完整代码示例：

InAppWebView(
  initialSettings: InAppWebViewSettings(
    clearCache: true,
    cacheEnabled: false,
    cacheMode: CacheMode.LOAD_NO_CACHE,
    clearSessionCache: true,
    supportZoom: false,
    verticalScrollBarEnabled: false,
    maximumZoomScale: 1.0,
    minimumZoomScale: 1.0,
    builtInZoomControls: false,
    disableHorizontalScroll: true,
    displayZoomControls: false,
    // Android平台额外配置
    android: AndroidInAppWebViewSettings(
      useWideViewPort: false,
      loadWithOverviewMode: true,
    ),
    // iOS平台额外配置
    ios: IOSInAppWebViewSettings(
      isPinchToZoomEnabled: false,
    ),
  ),
  initialUrlRequest: URLRequest(url: WebUri('https://pub.dev/')),
  onLoadStop: (controller, url) async {
    // 网页加载完成后注入JS修改viewport，禁止缩放
    await controller.evaluateJavascript(source: """
      var meta = document.createElement('meta');
      meta.name = 'viewport';
      meta.content = 'width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no';
      document.getElementsByTagName('head')[0].appendChild(meta);
    """);
  },
)

额外说明：

• 注入JS的时机选在onLoadStop，确保网页DOM加载完成后再修改viewport。
• Android端的useWideViewPort和loadWithOverviewMode配合设置，能确保网页适配屏幕且无法缩放。
• iOS端的isPinchToZoomEnabled直接禁用捏合手势缩放。

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