使用 flutter_inappwebview 放大 Flutter

Question

我使用来自一个答案webview_flutter "Failed to validate the certificate chain" SSL handshake failed error的代码

import 'package:flutter/material.dart';

import 'package:flutter_inappwebview/flutter_inappwebview.dart';

Future main() async {
 runApp(new MyApp());
}

class MyApp extends StatefulWidget {
 @override
 _MyAppState createState() => new _MyAppState();
}

class _MyAppState extends State<MyApp> {

 @override
 void initState() {
   super.initState();
 }

 @override
 void dispose() {
   super.dispose();
 }

 @override
 Widget build(BuildContext context) {
   return MaterialApp(
       home: InAppWebViewPage()
   );
 }
} 

class InAppWebViewPage extends StatefulWidget {
 @override
 _InAppWebViewPageState createState() => new _InAppWebViewPageState();
}

class _InAppWebViewPageState extends State<InAppWebViewPage> {
 InAppWebViewController webView;

 @override
 Widget build(BuildContext context) {
   return Scaffold(
       appBar: AppBar(
           title: Text("InAppWebView")
       ),
       body: Container(
           child: Column(children: <Widget>[
             Expanded(
               child: Container(
                 child: InAppWebView(
                   initialUrl: "https://myUrl",
                   initialHeaders: {},
                   initialOptions: InAppWebViewWidgetOptions(
                       inAppWebViewOptions: InAppWebViewOptions(
                         debuggingEnabled: true,
                       ),
                   ),
                   onWebViewCreated: (InAppWebViewController controller) {
                     webView = controller;
                   },
                   onLoadStart: (InAppWebViewController controller, String url) {

                   },
                   onLoadStop: (InAppWebViewController controller, String url) {

                   },
                   onReceivedServerTrustAuthRequest: (InAppWebViewController controller, ServerTrustChallenge challenge) async {
                     return ServerTrustAuthResponse(action: ServerTrustAuthResponseAction.PROCEED);
                   },
                 ),
               ),
             ),
           ]))
   );
 }
}

我尝试使用该功能进行缩放，但颤振不知道该选项。如何将其添加到此功能？我需要 Android 和 iOS 的这些功能。

Answer 1

从docs你可以使用builtInZoomControls和displayZoomControls，

builtInZoomControls：如果 WebView 应该使用其内置缩放机制，则设置为 true。默认值为 false。

---

displayZoomControls：如果 WebView 在使用内置缩放机制时应显示屏幕缩放控件，则设置为 true。默认值为 false。

InAppWebViewWidgetOptions(
                            inAppWebViewOptions: InAppWebViewOptions(
                              initialUrl: "https://myUrl",
                              builtInZoomControls: true,
                              displayZoomControls: true,
                            ))));

注意：您不必使用supportZoom，因为它默认为true。

supportZoom：如果 WebView 不支持使用其屏幕缩放控件和手势进行缩放，则设置为 false。默认值为 true。

Answer 2

您是否尝试在 InAppWebView 中添加不同的缩放选项，如下所示？

child: InAppWebView(
  initialUrl: "https://myUrl",
  initialHeaders: {},
  initialOptions: ....
  displayZoomControls: true,
  supportZoom: true

您可以在插件的 GitHub 位置了解有关这些选项的更多信息 - https://github.com/pichillilorenzo/flutter_inappwebview

希望这会有所帮助。