webview属性使用大全

发表于

前言

现在很多App里都内置了Web网页（Hybrid App），比如说很多电商平台，淘宝、京东、聚划算等等

目录

1. 简介

一个基于webkit引擎、展现web页面的控件

1
2
a. Android 4.4前：Android Webview在低版本 & 高版本采用了不同的webkit版本的内核
b. Android 4.4后：直接使用了Chrome内核

2. 作用

在 Android 客户端上加载h5页面

在本地 与 h5页面实现交互 & 调用

其他：对 url 请求、页面加载、渲染、对话框 进行额外处理。

3. 具体使用

Webview的使用主要包括：Webview类 及其 工具类（WebSettings类、WebViewClient类、WebChromeClient类）

4. WebView与 JS 的交互方式

在Android WebView的使用中，与前端h5页面交互的需求十分常见

Android 与 JS 通过WebView互相调用方法，实际上是：Android 去调用JS的代码 + JS去调用Android的代码

二者沟通的桥梁是WebView

img

6. 缓存机制构建

Android WebView由于前端h5本身的原因，存在加载效率慢 & 流量耗费的性能问题，具体介绍如下：

示意图

本文通过 H5缓存机制 + 资源预加载 + 资源拦截的方式 构建了一套WebView缓存机制，从而解决Android

WebView的性能问题，最终提高用户使用体验

具体缓存机制的讲解请看文章：手把手教你构建 Android WebView 的缓存机制 & 资源预加载方案

WebView

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
WebSettings settings = webView.getSettings();//获取webview的设置
settings.setJavaScriptEnabled(true);//可以加载js
settings.setPluginState(WebSettings.PluginState.ON);////让WebView支持播放插件
webView.setWebChromeClient(new WebChromeClient());//页面标题与页面中连接跳转的处理
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN_MR1) {
    settings.setMediaPlaybackRequiresUserGesture(false);//设置WebView是否通过手势触发播放媒体，默认是true，需要手势触发。
}
//设置WebView是否使用viewport，
// 当该属性被设置为false时，加载页面的宽度总是适应WebView控件宽度；当被设置为true，
// 当前页面包含viewport属性标签，在标签中指定宽度值生效，如果页面不包含viewport标签，
// 无法提供一个宽度值，这个时候该方法将被使用。
webView.getSettings().setUseWideViewPort(true);
webView.getSettings().setLoadWithOverviewMode(true);
//webView.getSettings().setDomStorageEnabled(true);
//webView.getSettings().setSupportMultipleWindows(true);
webView.setWebChromeClient(new WebChromeClient());
//webView.setWebViewClient(new WebViewClient());
//webView.setLayerType(View.LAYER_TYPE_SOFTWARE, null);.//开启硬件加速
webView.getSettings().setLoadWithOverviewMode(true);//设置WebView是否使用预览模式加载界面。
webView.getSettings().setDomStorageEnabled(true);//设置是否开启DOM存储API权限，默认false，未开启，设置为true，WebView能够使用DOM storage API
settings.setAllowFileAccess(true);//设置在WebView内部是否允许访问文件
settings.setAppCacheEnabled(true);//是否使用应用缓存
//        webView.getSettings().setSupportMultipleWindows(true);//设置WebView是否支持多屏窗口，参考WebChromeClient#onCreateWindow，默认false，不支持。
//        webView.setLayerType(View.LAYER_TYPE_SOFTWARE, null);.//关闭单个view的硬件加速
补充: webview的缓存模式设置,用处可以在提高webView的启动速度的时候设置,或更新资源的时候.可能会用到
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
WebSettings webSettings = webView.getSettings();
webSettings.setCacheMode(WebSettings.LOAD_DEFAULT);
下面是5中缓存模式的解释:
LOAD_CACHE_ONLY: 不使用网络，只读取本地缓存数据。
LOAD_DEFAULT: 根据cache-control决定是否从网络上取数据。
LOAD_CACHE_NORMAL: API level 17中已经废弃，从API level 11开始作用同LOAD_DEFAULT模式
LOAD_NO_CACHE: 不使用缓存，只从网络获取数据。
LOAD_CACHE_ELSE_NETWORK，只要本地有，无论是否过期，或者no-cache，都使用缓存中的数据。本地没有缓存时才从网络上获取。
所以我们一般设置为默认的缓存模式就可以了。关于缓存的配置, 主要还是靠web前端和后台设置。
作者：singwhatiwanna
链接：https://juejin.im/post/5b94ca52e51d450e7d097f38
来源：掘金