今天尝试在Android 工程下的Flutter dart 代码里使用WebView 控件,来打开一个web页面
但是首次结果是页面白屏,运行错误如题:大概意思是webview插件没有注册。
我按照百度出来的方法,一一对照
第一步,在pubspec.yaml文件里添加了 flutter 依赖
dependencies:
flutter:
sdk: flutter
# The following adds the Cupertino Icons font to your application.
# Use with the CupertinoIcons class for iOS style icons.
cupertino_icons: ^0.1.3
webview_flutter: ^0.3.22+1
第二步、然后在AndroidManifest.xml 设置对应权限
第三步、并添加相应res目录下的xml资源
<?xml version="1.0" encoding="utf-8"?>
<network-security-config>
<base-config cleartextTrafficPermitted="true">
<trust-anchors>
<certificates src="system" />
</trust-anchors>
</base-config>
</network-security-config>
确保以上三步都做了,执行flutter clean, 并重新编译运行,发现白屏依旧,log错误依旧。
后来即便看了github 上https://github.com/flutter/flutter/issues/25714
所有解决方案,结果依然白屏。
到底哪里注册插件呢?
反复查看配置文件和代码,无意中发现android工程目录io.flutter.plugins 下有个新生成的GeneratedPluginRegistrant 文件,
/**
* Generated file. Do not edit.
* This file is generated by the Flutter tool based on the
* plugins that support the Android platform.
*/
@Keep
public final class GeneratedPluginRegistrant {
public static void registerWith(@NonNull FlutterEngine flutterEngine) {
flutterEngine.getPlugins().add(new io.flutter.plugins.webviewflutter.WebViewFlutterPlugin());
}
}
从文件注释来看,这个文件是flutter工具自动生成的,需要在某个地方调用一下,就可以注册webview 插件了
然后发现了这个插件调用地方,即FlutterActvity 的重载函数configureFlutterEngine 中调用
public class MainActivity extends FlutterActivity {
@Override
public void configureFlutterEngine(@NonNull FlutterEngine flutterEngine) {
// FlutterLogger.i("FlutterLoader configureFlutterEngine =" );
GeneratedPluginRegistrant.registerWith(flutterEngine);
}
}
当我把这个重载函数copy到初始MainActivity 时却出现编译错误,提示 没有重载函数
于是继续查。
后来才发现原来有两个FlutterActivity,而我代码中导入的是老的版本
io.flutter.app.FlutterActivity; //老版
io.flutter.embedding.android.FlutterActivity; //新版
github上关于老版FlutterActivity的注释是这样的
/** | |
* Deprecated base class for activities that use Flutter. | |
* | |
* <p>Deprecation: {@link io.flutter.embedding.android.FlutterActivity} is the new API that now | |
* replaces this class. See https://flutter.dev/go/android-project-migration for more migration | |
* details. | |
*/ |
https://github.com/flutter/engine/blob/master/shell/platform/android/io/flutter/app/FlutterActivity.java
老版 FlutterActivity已经Deprecated, 需要使用一些新功能的话就必须使用新版FlutterActivity
于是将FlutterActivity 导入包改成新版
import io.flutter.embedding.android.FlutterActivity;
同时导入
import androidx.annotation.NonNull;//不然编译会有错误
由于需要使用androidx, 所以还要在build.gradle 里面添加androidx的依赖
dependencies {
testImplementation 'junit:junit:4.12'
androidTestImplementation 'androidx.test:runner:1.1.1'
androidTestImplementation 'androidx.test.espresso:espresso-core:3.1.1'
}
最后,在终端先后执行 flutter clean, flutter build apk xxxx
并将新生成的apk再次在手机上运行时,h5网页终于正常打开了。
需要注意的是,flutter webview这个插件只能在android sdk 20 以上的版本上运行,否则依然会白屏。
我尝试在android 4.4.2(API level 19)的android机顶盒上运行,页面白屏,log错误提示如下:
Unhandled Exception: PlatformException(error, java.lang.IllegalStateException: Trying to use platform views with API 19, required API level is: 20
考虑到目前市面上android机顶盒大部分是android4.4版本,所以若想在机顶盒上通过flutter直接打开webview控件是行不通,相关功能得另想办法。