如何在flutter web_view中以桌面模式打开站点？

Question

我正在尝试在移动 WebView 中打开 web.whatsapp.com 网络。 Web 视图在 flutter 应用程序中工作正常，但是我希望在桌面首选项中打开该网站。

这就是我得到的

预计

这样我就可以扫描二维码

Answer 1

如果您想在桌面应用程序中打开网站，请使用此依赖项 https://pub.dev/packages/desktop_webview_window

Answer 2

看到这个答案。

代码：

import 'package:flutter/material.dart';
import 'package:webview_flutter/webview_flutter.dart';

class WhatsappWeb extends StatefulWidget {
  const WhatsappWeb({super.key});

  @override
  State<WhatsappWeb> createState() => WebViewState();
}

WebViewController webViewController = WebViewController();

class WebViewState extends State<WhatsappWeb> {
  @override
  void initState() {
    super.initState();
    webViewController = WebViewController()
      ..setJavaScriptMode(JavaScriptMode.unrestricted)
      ..setBackgroundColor(Colors.white)
      ..setUserAgent(
          'Mozilla/5.0 (Macintosh; Intel Mac OS X 11_2_1) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/14.0.3 Safari/605.1.15')
      ..loadRequest(Uri.parse('https:web.whatsapp.com'));
  }

  @override
  void dispose() {
    webViewController.loadRequest(Uri.parse('about:blank'));
    super.dispose();
  }

  @override
  Widget build(BuildContext context) => PopScope(
        onPopInvoked: (_) => onWillPop,
        child: Scaffold(
          appBar: PreferredSize(
            preferredSize: Size.fromHeight(MediaQuery.of(context).padding.top),
            child: SizedBox(
              height: MediaQuery.of(context).padding.top,
            ),
          ),
          body: WebViewWidget(controller: webViewController),
        ),
      );
}

Future<bool> onWillPop() async {
  if (await webViewController.canGoBack()) {
    webViewController.goBack();
    return false;
  } else {
    return true;
  }
}

输出：