如何在Flutter中禁用WebView的缩放控制

Question

@override
Widget build(BuildContext context) {
  return WillPopScope(
      child: Scaffold(
          backgroundColor: Colors.white,
          bottomNavigationBar: _bottomTab(),
          appBar: AppBar(
            title: Text('View ' + type),
          ),
          body: ProgressHUD(
            child: Padding(
              padding: EdgeInsets.all(10.0),
              child: Stack(
                children: <Widget>[
                  Container(
                    child: WebView(
                      initialUrl: weburl,
                      javascriptMode: JavascriptMode.unrestricted,
                      onPageFinished: pageFinishedLoading,
                    ),
                  )
                ],
              ),
            ),
            inAsyncCall: _isLoading,
            opacity: 0.0,
          )),
      onWillPop: backPress);
}

void pageFinishedLoading(String url) {
  setState(() {
    _isLoading = false;
  });
}

class ProgressHUD extends StatelessWidget {
  final Widget child;
  final bool inAsyncCall;
  final double opacity;
  final Color color;
  final Animation<Color> valueColor;

  ProgressHUD({
    Key key,
    @required this.child,
    @required this.inAsyncCall,
    this.opacity = 0.3,
    this.color = Colors.grey,
    this.valueColor,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    List<Widget> widgetList = List<Widget>();
    widgetList.add(child);
    if (inAsyncCall) {
      final modal = Stack(
        children: [
          Opacity(
            opacity: opacity,
            child: ModalBarrier(dismissible: false, color: color),
          ),
          Center(
            child: CircularProgressIndicator(
              valueColor: valueColor,
            ),
          ),
        ],
      );
      widgetList.add(modal);
    }
    return Stack(
      children: widgetList,
    );
  }
}

Webview 默认是缩放的。我想在最初打开页面时禁用缩放。如果用户想要缩放页面，他们必须自己完成。但默认情况下我不希望 webview 被缩放。我尝试过使用 webviewscaffold 但我也遇到了同样的问题。我的 Android webview 代码工作完美，我想用 dart 实现同样的效果。我怎样才能实现这个目标？

注意：打开页面时禁用网页视图缩放

Answer 1

对于缩放控制，您应该使用 inapp_webview

InAppWebView(        
                    initialUrlRequest: URLRequest(
                      url: Uri.parse("https://stackoverflow.com")) // updated 
                    
                    initialHeaders: {},
                    initialOptions: InAppWebViewGroupOptions(
                      crossPlatform: InAppWebViewOptions(
                          supportZoom: false, // zoom support
                          debuggingEnabled: true,
                          preferredContentMode: UserPreferredContentMode.MOBILE), // here you change the mode
                    ),
                    onWebViewCreated: (InAppWebViewController controller) {
                      webView = controller;
                    },
                    onLoadStart: (InAppWebViewController controller, String url) {

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

                    },
                  )

Answer 2

你可以做到这一点

WebView(
        zoomEnabled: false,
        initialUrl: 'https url',
        
      ),

Answer 3

在使用构建器模式创建 WebviewController 时，您可以使用以下代码：

controller = WebViewController()
  ..setJavaScriptMode(JavaScriptMode.unrestricted)
  ..enableZoom(false)
  ..loadRequest(Uri.parse("{YOUR_PAGE}"));