「这是我参加2022初次更文应战的第21天，活动详情检查：2022初次更文应战」。

本文翻译自pub:
webview_flutter | Flutter Package (flutter-io.cn)

译时版本：
webview_flutter 3.0.0

用于 Flutter 的 WebView

供给 WebView 组件的 Flutter 插件。

在 iOS 上 WebView 组件基于WKWebView；在 Android 上 WebView 组件基于 WebView 。

用法

添加webview_flutter依赖到pubspec.yaml 文件中。
假如方针平台是 Android，要承认阅读下面的 Android Platform Views部分来挑选最适合需求的平台 View 形式。

现在可以在组件树中参加 WebView 组件。检查 WebView组件的文档了解更多如何运用该组件的内容。

Android Platform Views

该组件运用Platform Views在 Flutter 应用中嵌入 Android 的 webview 。它支撑两种形式：hybrid composition(混合形式 – 现在默许) 和virtual display （虚拟显现）.

这两者之间挑选时，这里有一些点可作考虑：

• Hybrid composition内置了键盘支撑，而virtual display还有很多键盘的 issues 。
• Hybrid composition需求 Android SDK 19+ ，而virtual display需求 Android SDK 20+ 。
• Hybrid composition和virtual display有不同的功用权衡.

运用 hybrid composition

该形式现在是默许可用。尽管如此，假如之前的版本低于19，也要保证在 android/app/build.gradle 中设置了正确的 minSdkVersion 。

android {
    defaultConfig {
        minSdkVersion 19
    }
}

运用 virtual display

1. 在 android/app/build.gradle中设置正确的minSdkVersion 。（假如之前低于20）：

    android {
        defaultConfig {
            minSdkVersion 20
        }
    }
   

2. 在initState() 中设置 WebView.platform = AndroidWebView();。例如：

    import 'dart:io';
    import 'package:webview_flutter/webview_flutter.dart';
    class WebViewExample extends StatefulWidget {
      @override
      WebViewExampleState createState() => WebViewExampleState();
    }
    class WebViewExampleState extends State<WebViewExample> {
      @override
      void initState() {
        super.initState();
        // Enable virtual display.
        if (Platform.isAndroid) WebView.platform = AndroidWebView();
      }
      @override
      Widget build(BuildContext context) {
        return WebView(
          initialUrl: 'https://flutter.cn',
        );
      }
    }
   

在 Android 上使 Material Component 可用

要在 WebView 中的 输入元素和用户交互时运用 Material 组件，检查 Material Components 运用说明 中描绘的过程。

在 POST 恳求中设置自定义头部

现在，在 Android 上 还不支撑运用 WebViewController 的 loadRequest 在 恳求时设置自定义头部。假如你需求这个功用，一个应变方法是手动创立恳求，然后运用 loadHTMLString 加载呼应数据。