Android webview

Android webview详解《1》

2018-10-19  本文已影响28人  天空在微笑

        从Android 4.4（KitKat）开始，原本基于WebKit的WebView开始基于Chromium内核，这一改动大大提升了WebView组件的性能以及对HTML5,CSS3,JavaScript的支持。不过它的API却没有很大的改动，在兼容低版本的同时只引进了少部分新的API，并不需要你做很大的改动。
        在WebView中，有几个地方是我们可以使用来定制我们的WebView各种行为的，分别是：

WebView基本使用

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <WebView
        android:id="@+id/web_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>
</LinearLayout>

然后在Activity的onCreate方法里写入如下代码：

String url = "https://www.google.com";
WebView webView = (WebView) findViewById(R.id.web_view);
webView.loadUrl(url);

接着在AndroidManifest声明访问网络的权限：

<uses-permission android:name="android.permission.INTERNET"/>

加载网页的方式

  1. getSettings.setSupportZoom(false);//设置WebView是否支持使用屏幕控件或手势进行缩放，默认是true，支持缩放。

  2. getSettings.setMediaPlaybackRequiresUserGesture(false);// 设置WebView是否通过手势触发播放媒体，默认是true，需要手势触发。

  1. getSettings.setBuiltInZoomControls(true); //
    设置WebView是否使用其内置的变焦机制，该机制集合屏幕缩放控件使用，默认是false，不使用内置变焦机制。

  1. getSettings.setDisplayZoomControls(false); //
    设置WebView使用内置缩放机制时，是否展现在屏幕缩放控件上，默认true，展现在控件上。

  1. getSettings.setAllowFileAccess(false); //
    设置在WebView内部是否允许访问文件，默认允许访问。

  1. getSettings.setAllowContentAccess(false); //
    设置WebView是否使用其内置的变焦机制，该机制结合屏幕缩放控件使用，默认是false，不使用内置变焦机制。

  1. getSettings.setLoadWithOverviewMode(false); //设置WebView是否使用预览模式加载界面。

  1. getSettings.setSaveFormData(false); //
    设置WebView是否保存表单数据，默认true，保存数据。

  1. getSettings.setTextZoom(100); //
    设置WebView中加载页面字体变焦百分比，默认100，整型数。

  1. setAcceptThirdPartyCookies(boolean accept)
    设置WebView访问第三方Cookies策略，参考CookieManager提供的方法：setShouldAcceptThirdPartyCookies。
    getSettings.setAcceptThirdPartyCookies(false);

  2. setUseWideViewPort(boolean use)//设置WebView是否使用viewport，当该属性被设置为false时，加载页面的宽度总是适应WebView控件宽度；当被设置为true，当前页面包含viewport属性标签，在标签中指定宽度值生效，如果页面不包含viewport标签，无法提供一个宽度值，这个时候该方法将被使用。
    getSettings.setUseWideViewPort(false)；

  3. setSupportMultipleWindows(boolean support)
    设置WebView是否支持多屏窗口，参考WebChromeClient#onCreateWindow，默认false，不支持。
    getSettings.setSupportMultipleWindows(true);

  4. setLayoutAlgorithm(LayoutAlgorithm l)
    设置WebView底层的布局算法，参考LayoutAlgorithm#NARROW_COLUMNS，将会重新生成WebView布局
    getSettings.setLayoutAlgorithm(LayoutAlgorithm l)；

  5. setStandardFontFamily(String font)
    设置WebView标准字体库字体，默认字体“sans-serif”。
    getSettings.setStandardFontFamily("sans-serif");

  6. setFixedFontFamily(String font)
    设置WebView固定的字体库字体，默认“monospace”。
    getSettings.setFixedFontFamily("monospace");

  7. setSansSerifFontFamily(String font)
    设置WebView Sans SeriFontFamily字体库字体，默认“sans-serif”。
    getSettings.setSansSerifFontFamily("sans-serif");

  8. setSerifFontFamily(String font)
    设置WebView seri FontFamily字体库字体，默认“sans-serif”。
    getSettings.setSansSerifFontFamily("sans-serif");

  9. setCursiveFontFamily(String font)
    设置WebView字体库字体，默认“cursive”
    getSettings.setCursiveFontFamily("cursive");

  10. setFantasyFontFamily(String font)
    设置WebView字体库字体，默认“fantasy”。
    getSettings.setFantasyFontFamily("fantasy");

  11. setMinimumFontSize(int size)
    设置WebView字体最小值，默认值8，取值1到72
    getSettings.setMinimumFontSize(8);

  12. setMinimumLogicalFontSize(int size)
    设置WebView逻辑上最小字体值，默认值8，取值1到72
    getSettings.setMinimumLogicalFontSize(8);

  13. setDefaultFontSize(int size)
    设置WebView默认值字体值，默认值16，取值1到72
    getSettings.setDefaultFontSize(16);

  14. setDefaultFixedFontSize(int size)
    设置WebView默认固定的字体值，默认值16，取值1到72
    getSettings.setDefaultFixedFontSize(16);

  15. setLoadsImagesAutomatically(boolean flag)
    设置WebView是否加载图片资源，默认true，自动加载图片
    getSettings.setLoadsImagesAutomatically(false);

  16. setBlockNetworkImage(boolean flag)
    设置WebView是否以http、https方式访问从网络加载图片资源，默认false
    getSettings.setBlockNetworkImage(true);

  17. setBlockNetworkLoads(boolean flag)
    设置WebView是否从网络加载资源，Application需要设置访问网络权限，否则报异常
    getSettings.setBlockNetworkLoads(true);

  18. setJavaScriptEnabled(boolean flag)
    设置WebView是否允许执行JavaScript脚本，默认false，不允许
    getSettings.setJavaScriptEnabled(true);

  19. setAllowUniversalAccessFromFileURLs(boolean flag)
    设置WebView运行中的脚本可以是否访问任何原始起点内容，默认true
    getSettings.setAllowUniversalAccessFromFileURLs(false);

  20. setAllowFileAccessFromFileURLs(boolean flag)
    设置WebView运行中的一个文件方案被允许访问其他文件方案中的内容，默认值true
    getSettings.setAllowFileAccessFromFileURLs(false);

  21. setGeolocationDatabasePath(String databasePath)
    设置WebView保存地理位置信息数据路径，指定的路径Application具备写入权限

getSettings.setGeolocationDatabasePath(String path);

  1. setAppCacheEnabled(boolean flag)
    设置Application缓存API是否开启，默认false，设置有效的缓存路径参考setAppCachePath(String path)方法
    getSettings.setAppCacheEnabled(true);

  2. setAppCachePath(String appCachePath)
    设置当前Application缓存文件路径，Application Cache API能够开启需要指定Application具备写入权限的路径
    getSettings.setAppCachePath(String appCachePath);

  3. setDatabaseEnabled(boolean flag)
    设置是否开启数据库存储API权限，默认false，未开启，可以参考setDatabasePath(String path)
    getSettings.setDatabaseEnabled(false);

  4. setDomStorageEnabled(boolean flag)
    设置是否开启DOM存储API权限，默认false，未开启，设置为true，WebView能够使用DOM storage API
    getSettings.setDomStorageEnabled(true);

  5. setGeolocationEnabled(boolean flag)
    设置是否开启定位功能，默认true，开启定位
    getSettings.setGeolocationEnabled(false);

  6. setJavaScriptCanOpenWindowsAutomatically(boolean flag)
    设置脚本是否允许自动打开弹窗，默认false，不允许
    getSettings.setJavaScriptCanOpenWindowsAutomatically(true);

  7. setDefaultTextEncodingName(String encoding)
    设置WebView加载页面文本内容的编码，默认“UTF-8”。
    getSettings.setDefaultTextEncodingName("UTF-8");

  8. setUserAgentString(String ua)
    设置WebView代理字符串，如果String为null或为空，将使用系统默认值
    getSettings.setUserAgentString(String ua);

  9. setNeedInitialFocus(boolean flag)
    设置WebView是否需要设置一个节点获取焦点当被回调的时候，默认true
    getSettings.setNeedInitialFocus(false);

  10. setCacheMode(int mode)
    重写缓存被使用到的方法，该方法基于Navigation Type，加载普通的页面，将会检查缓存同时重新验证是否需要加载，如果不需要重新加载，将直接从缓存读取数据，允许客户端通过指定LOAD_DEFAULT、LOAD_CACHE_ELSE_NETWORK、LOAD_NO_CACHE、LOAD_CACHE_ONLY其中之一重写该行为方法，默认值LOAD_DEFAULT
    getSettings.setCacheMode(WebSettings.LOAD_DEFAULT);

  11. setMixedContentMode(int mode)
    设置当一个安全站点企图加载来自一个不安全站点资源时WebView的行为，android.os.Build.VERSION_CODES.KITKAT默认为MIXED_CONTENT_ALWAYS_ALLOW，android.os.Build.VERSION_CODES#LOLLIPOP默认为MIXED_CONTENT_NEVER_ALLOW，取值其中之一：MIXED_CONTENT_NEVER_ALLOW、MIXED_CONTENT_ALWAYS_ALLOW、MIXED_CONTENT_COMPATIBILITY_MODE.

getSettings.setMixedContentMode(WebSettings.MIXED_CONTENT_COMPATIBILITY_MODE);

WebViewClient

从名字上不难理解，这个类就像WebView的委托人一样，是帮助WebView处理各种通知和请求事件的，我们可以称他为WebView的“内政大臣”。

1.这个方法只在与服务器无法正常连接时调用，类似于服务器返回错误码的那种错误（即HTTP ERROR），该方法是不会回调的，因为你已经和服务器正常连接上了（全怪官方文档(︶^︶)）；
2.这个方法是新版本的onReceivedError()方法，从API23开始引进，与旧方法onReceivedError(WebView view,int errorCode,String description,String failingUrl)不同的是，新方法在页面局部加载发生错误时也会被调用（比如页面里两个子Tab或者一张图片）。这就意味着该方法的调用频率可能会更加频繁，所以我们应该在该方法里执行尽量少的操作。

比如你对web的某个js做了本地缓存，希望在加载该js时不再去请求服务器而是可以直接读取本地缓存的js，这个方法就可以帮助你完成这个需求。你可以写一些逻辑检测这个request，并返回相应的数据，你返回的数据就会被WebView使用，如果你返回null，WebView会继续向服务器请求。

WebChromeClient

如果说WebViewClient是帮助WebView处理各种通知、请求事件的“内政大臣”的话，那么WebChromeClient就是辅助WebView处理Javascript的对话框，网站图标，网站title，加载进度等偏外部事件的“外交大臣”。

以下两个方法是为了支持web页面进入全屏模式而存在的（比如播放视频），如果不实现这两个方法，该web上的内容便不能进入全屏模式。

这时我们就需要重写该方法，在我们尚未获取web页面上的video预览图时，给予它一个本地的图片，避免空指针的发生。

onPermissionRequestCanceled(PermissionRequest request)：该方法在web权限申请权限被取消时回调，这时应该隐藏任何与之相关的UI界面。

Js与WebView交互

既然嗨鸟应用大行其道，那么毫无疑问Android与JavaScript的交互我们也必须了解清楚，下面来介绍一下JavaScript与Android是如何互相调用的。

利用WebView调用网页上的JavaScript代码

在WebView中调用Js的基本格式为

webView.loadUrl("javascript:methodName(parameterValues)");

现有以下这段JavaScript代码

  function readyToGo() {
      alert("Hello")
  }

  function alertMessage(message) {
      alert(message)
  }

  function getYourCar(){
      return "Car";
  }
  1. WebView调用JavaScript无参无返回值函数
String call = "javascript:readyToGo()";
webView.loadUrl(call);
  1. WebView调用JavScript有参无返回值函数
String call = "javascript:alertMessage(\"" + "content" + "\")";
webView.loadUrl(call);
  1. WebView调用JavaScript有参数有返回值的函数
@TargetApi(Build.VERSION_CODES.KITKAT)
private void evaluateJavaScript(WebView webView){
    webView.evaluateJavascript("getYourCar()", new ValueCallback<String>() {
        @Override
        public void onReceiveValue(String s) {
            Log.d("findCar",s);
        }
    });
}

JavaScript通过WebView调用Java代码

从API19开始，Android提供了@JavascriptInterface对象注解的方式来建立起Javascript对象和Android原生对象的绑定，提供给JavScript调用的函数必须带有@JavascriptInterface。

演示一 JavaScript调用Android Toast方法

  1. 编写Java原生方法并用使用@JavascriptInterface注解
@JavascriptInterface
public void show(String s){
    Toast.makeText(getApplication(), s, Toast.LENGTH_SHORT).show();
}

2.注册JavaScriptInterface

webView.addJavascriptInterface(this, "android");
addJavascriptInterface的作用是把this所代表的类映射为JavaScript中的android对象。

3.编写JavaScript代码

function toastClick(){
    window.android.show("JavaScript called~!");
}

演示二 JavaScript调用有返回值的Java方法

1.定义一个带返回值的Java方法，并使用@JavaInterface：

@JavaInterface
public String getMessage(){
    return "Hello,boy~";
}

2.添加JavaScript的映射

webView.addJavaScriptInterface(this,"Android");

3.通过JavaScript调用Java方法

function showHello(){
    var str=window.Android.getMessage();
    console.log(str);
}
Android 中Webview 自适应屏幕

//设置加载进来的页面自适应手机屏幕

settings.setUseWideViewPort(true);
settings.setLoadWithOverviewMode(true);

第一个方法设置webview推荐使用的窗口，设置为true。第二个方法是设置webview加载的页面的模式，也设置为true。

这方法可以让你的页面适应手机屏幕的分辨率，完整的显示在屏幕上，可以放大缩小。

WebView设置字体默认大小
WebSettings settings = webView.getSettings();  
settings.setDefaultFontSize(22);

Android Webview总结
WebView·开车指南

上一篇 下一篇

猜你喜欢

热点阅读