WebView适配,在很多人眼中就是一场噩梦。 尤其是在低端手机上适配 加载flash 播放视频 加载小游戏等。
本人最新公司要求,用WebView接入一款H5的小游戏。
发现很尴尬,在4.4一下的Android不能使用 ,连动画都没有。
不废话了 直接上图看效果
WebView是android系统提供能显示网页的系统控件,它是一个特殊的View,同时它也是一个ViewGroup可以有很多其他子View。在Android 4.4以下(不包含4.4)系统WebView底层实现是采用WebKit内核,而在Android 4.4及其以上Google 采用了chromium内核作为系统WebView的底层内核支持。在这一变化中Android 提供的WebView相关API并没有发生大变化,在4.4上也兼容低版本的API并且引进了少部分API。这里简单介绍下基于Chromium 的Webview和基于Webkit webview的差异,基于Chromium Webview提供更广的HTML5,CSS3,JavaScript支持,在目前最新Android 系统版本5.0上基于chromium 37,Webview提供绝大多数的html5特性支持。Webkitjavascript引起采用WebCore Javascript 在Android 4.4上换成了V8能直接提升JavaScript性能。另外Chromium 支持远程调试(Chrome DevTools)。
WebKit for WebView VS Chromium for WebView性能比对
Webkit Chromium 备注
HTML5 278 434 http://html5test.com
远程调试 不支持 支持 Android 4.4及以上支持
内存占用 小 大 相差20-30M左右
WebAudio 不支持 支持 Android 5.0及以上支持
WebGL 不支持 支持 Android 5.0及以上支持
WebRTC 不支持 支持 Android 5.0及以上支持
因此问题在于WebView内核上,为了解决适配问题,只能使用第三方内核
本人在这里使用的是腾讯的TbsX5(腾讯浏览服务) 点我下载
将jar导入到libs目录下
在main文件下创建jniLibs
x5暂时不提供64位so文件,为了保证64位手机能正常加载x5内核,官方给出的64位手机解决方案
打开对应app中的build.gradle文件,在文件的android{}中的defaultConfig{}里添加如下配置:
ndk{abiFilters "armeabi", "armeabi-v7a", "x86", "mips"}
使用X5WebView我们还要添加一个X5WebView.java类
public class X5WebView extends WebView {
private WebViewClient client = new WebViewClient() {
// 防止加载网页时调起系统浏览器
public boolean shouldOverrideUrlLoading(WebView view, String url) {
view.loadUrl(url);
return true;
}
};
public X5WebView(Context arg0) {
super(arg0);
setBackgroundColor(85621);
}
@SuppressLint("SetJavaScriptEnabled")
public X5WebView(Context arg0, AttributeSet arg1) {
super(arg0, arg1);
this.setWebViewClient(client);
// this.setWebChromeClient(chromeClient);
// WebStorage webStorage = WebStorage.getInstance();
initWebViewSettings();
this.getView().setClickable(true);
}
private void initWebViewSettings() {
WebSettings webSetting = this.getSettings();
webSetting.setJavaScriptEnabled(true);
webSetting.setJavaScriptCanOpenWindowsAutomatically(true);
webSetting.setAllowFileAccess(true);
webSetting.setLayoutAlgorithm(LayoutAlgorithm.NARROW_COLUMNS);
webSetting.setSupportZoom(true);
webSetting.setBuiltInZoomControls(true);
webSetting.setUseWideViewPort(true);
webSetting.setSupportMultipleWindows(true);
// webSetting.setLoadWithOverviewMode(true);
webSetting.setAppCacheEnabled(true);
// webSetting.setDatabaseEnabled(true);
webSetting.setDomStorageEnabled(true);
webSetting.setGeolocationEnabled(true);
webSetting.setAppCacheMaxSize(Long.MAX_VALUE);
// webSetting.setPageCacheCapacity(IX5WebSettings.DEFAULT_CACHE_CAPACITY);
webSetting.setPluginState(WebSettings.PluginState.ON_DEMAND);
// webSetting.setRenderPriority(WebSettings.RenderPriority.HIGH);
webSetting.setCacheMode(WebSettings.LOAD_NO_CACHE);
}
}
public class BaseApplication extends Application {
@Override
public void onCreate() {
super.onCreate();
initTBS();
}
/**
* 初始化TBS浏览服务X5内核
*/
private void initTBS() {
//搜集本地tbs内核信息并上报服务器,服务器返回结果决定使用哪个内核。
QbSdk.setDownloadWithoutWifi(true);//非wifi条件下允许下载X5内核
QbSdk.PreInitCallback cb = new QbSdk.PreInitCallback() {
@Override
public void onViewInitFinished(boolean arg0) {
//x5內核初始化完成的回调,为true表示x5内核加载成功,否则表示x5内核加载失败,会自动切换到系统内核。
Log.d("app", " onViewInitFinished is " + arg0);
}
@Override
public void onCoreInitFinished() {}
};
//x5内核初始化接口
QbSdk.initX5Environment(getApplicationContext(), cb);
}
}