天天看点

Android WebView使用精解(一)



       Android开发中经常会需要在自己的app中嵌入浏览网页的功能,android sdk提供了具备网页浏览功能的控件-----WebView。接下来就详细的讲解WebView的使用。

  1. WebView简介。

以下是官方api中的简介:

A View that displays web pages. This class is the basis upon whichyou can roll your own web browser or simply display some online content withinyour Activity. It uses the WebKit rendering engine to display web pages andincludes methods to navigate forward and backward through a history, zoom inand out, perform text searches and more.

大意是:WebView是一个用来展示网页的view,它使用Webkit渲染引擎渲染网页内容,并且包含通过历史记录导航前进或后退的、放大或缩小网页、搜索文字等常见的浏览器方法。

  1. 权限

使用WebView通常需要访问网络,当然也可以加载本地资源,但更多的情

况是加载线上网页,因此需要添加使用网络的权限,在androidmanifest.xml的application标签外加上如下的权限:

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

  1. 基本使用
  1. 添加到布局,有两种方式将WebView添加到布局中
  1. 像其他的控件一样,在布局文件中添加

Xml文件中:

<RelativeLayoutxmlns:android="http://schemas.android.com/apk/res/android"

   xmlns:tools="http://schemas.android.com/tools"

   android:layout_width="match_parent"

   android:layout_height="match_parent"

   tools:context="${relativePackage}.${activityClass}" >

   <WebView

       android:id="@+id/webview"

       android:layout_width="match_parent"

       android:layout_height="match_parent" />

</RelativeLayout>

Activity中:

public class MainActivity extends Activity{

privateWebView mWebView;

@Override

protectedvoid onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_main);

        mWebView=(WebView)findViewById(R.id.webview);

}

}

  1. 在Java代码中使用

public class MainActivity extends Activity{

privateWebView mWebView;

@Override

protectedvoid onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        mWebView=newWebView(this);

        setContentView(mWebView);

}

}

       以上两种方式都能在页面布局中加入一个占满整个activity的WebViewm,推荐使用第一种方式,使用起来更灵活。

  1. WebView加载资源。WebView可以加载三种类型的资源,如下:
  1. 网络资源:

    mWebView.loadUrl("http://www.baidu.com");

  2. assets路径下的网页

mWebView.loadUrl("file:///android_asset/index.html");

index.html是工程assets文件夹下的一个网页文件。

  1. 本地网页

mWebView.loadUrl("file:///本地路径/index.html");

index.html存放在手机sd卡中

       注:点击网页中的链接有可能会拉起手机的浏览器,如果需要在WebView中展示链接的网页,需要做如下设置:

mWebView.setWebViewClient(newWebViewClient(){

                     @Override

                     publicboolean shouldOverrideUrlLoading(WebView view, String url) {

                            view.loadUrl(url);

                            returntrue;

                     }

              });

  1. 高级功能
  1. 支持javascript
  1. 设置WebView支持javascript:

WebSettings settings = mWebView.getSettings();

settings.setJavaScriptEnabled(true);  //允许运行javascript

settings.setJavaScriptCanOpenWindowsAutomatically(true); //运行javascript创建窗口

  1. 向WebView注入java对象

    mWebView.addJavascriptInterface(new JSInterface(),"jsInterface");

    JSInterface定义如下:

private class JSInterface{

              public String getName() {

                     return "hello";

              }

}

网页中javascript可以通过”别名.方法名(参数列表)”方式调用接口对象的方法,如

var name=jsinterface.getName();

alert(name);

  1. 注意事项

    2中的JSInterface在4.2以下系统中可以运行,但如此存在安全隐患,在4.2系统以上,google要求作为js接口的方法需要加上标注@JavascriptInterface,如下

private class JSInterface{

              @JavascriptInterface

              public String getName() {

                     return "hello";

              }

}

否则js中无法调用相关方法。

  1. 历史导航

//根据历史记录是否可以返回上一个页面

              mWebView.canGoBack();

              //根据历史记录是否可以前进到下一个页面

              mWebView.canGoForward();

              //根据历史记录是否可以前进或后退相应的步数,负数后退,正数前进

              mWebView.canGoBackOrForward(1);

              //根据历史记录后退到上一个页面

              mWebView.goBack();

              //根据历史记录前进到下一个页面

              mWebView.goForward();

              //根据历史记录前进或后退到相应的页面

              mWebView.goBackOrForward(1);

  1. 缩放。设置允许缩放:

settings.setSupportZoom(true);

settings.setBuiltInZoomControls(true);

  1. 缓存

    settings.setCacheMode(mode);

    参数mode是整型值:LOAD_DEFAULT、 LOAD_CACHE_ELSE_NETWORK, LOAD_NO_CACHE 、 LOAD_CACHE_ONLY之一;

    LOAD_DEFAULT:如果有缓存且为过期,则加载缓存内容,否则加载网络内容

    LOAD_CACHE_ELSE_NETWORK:如果有缓存,不管是否过期都加载缓存,否则加载网络内容

    LOAD_NO_CACHE:不加在缓存,只加载网络内容

    LOAD_CACHE_ONLY:不加在网络内容,只加载缓存资源

  2. 两个相关的辅助类
  1. WebViewClient,此类与网页加载的各个阶段过程相关,如网页开始加载、网页加载进度、网页加载结束等,使用如下

mWebView.setWebViewClient(newWebViewClient());

可以覆写其中相关回调执行相应的逻辑,如

//网页开始加载时回调

onPageStarted(WebViewview, String url, Bitmap favicon)

//网页加载完成时回调

onPageFinished(WebViewview, String url)

//加载错误是回调

onReceivedError(WebViewview, WebResourceRequest request, WebResourceError error)

//通知app即将加载新的url,app可以接管此url加载的操作,如果app不接管,默认行为是拉起手机浏览器加载此url,因此如果需要webview加载网页内容,则需要覆写此回调方法,如三、2、所述

shouldOverrideUrlLoading(WebViewview, String url)

  1. WebChromeClient,此类与网页渲染相关,如获取到网页标题、获取到网页图标、js弹窗等

    有些同学发现设置了

settings.setJavaScriptEnabled(true);  //允许运行javascript

settings.setJavaScriptCanOpenWindowsAutomatically(true); //运行

在网页中执行alert()函数无法弹出警告框,那是因为没有设置此辅助类,需要做如下设置

mWebView.setWebChromeClient(new WebChromeClient());

还可以覆写此类的相关回调方法,在网页ui更新或者开始渲染时执行相关逻辑,如

//网页标题变化时回调

onReceivedTitle(WebView view, String title)

//网页图标变化时回调

onReceivedIcon(WebView view, Bitmap icon)

//网页加载进度变化时回调

onProgressChanged(WebView view, int newProgress)