Android中WebView的使用

来源：互联网发布：淘宝裤子褶皱平铺拍摄编辑：程序博客网时间：2024/06/08 10:57

WebView的优点

可以直接显示和渲染web页面，直接显示网页
webview可以直接用html文件（网络上或本地assets中）作布局
和JavaScript交互调用

WebView的基本使用

<WebView        android:id="@+id/webView1"        android:layout_width="fill_parent"        android:layout_height="fill_parent"        android:layout_marginTop="10dp" />

同时，因为要房访问网络，所以manifest中必须要加uses-permission：

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

在activity中即可获得webview的引用，同时load一个网址：

webview = (WebView) findViewById(R.id.webView1);webview.loadUrl("http://www.baidu.com/");

通过这种方式去加载一个WebView你会发现,他是跳转到系统的浏览器中,那么我们该如何解决呢?

webview.setWebViewClient(new WebViewClient(){            @Override            public boolean shouldOverrideUrlLoading(WebView view, String url) {                view.loadUrl(url);                return true;            }        });

若自己定义了一个页面加载进度的progressbar，需要展示给用户的时候，可以通过如下方式获取webview内页面的加载进度：

webview.setWebChromeClient(new WebChromeClient(){            @Override            public void onProgressChanged(WebView view, int newProgress) {                //可以在这里设置progressBar进度            }        });

每个页面，都有一个标题，比如www.baidu.com这个页面的title即“百度一下，你就知道”，那么如何知道当前webview正在加载的页面的title呢：

webview.setWebChromeClient(new WebChromeClient(){            @Override            public void onReceivedTitle(WebView view, String title) {                titleview.setText(title);//a textview            }        });

那么如果我们的WebView加载时出现错误需要怎么处理呢?

webview.setWebViewClient(new WebViewClient(){   @Override    public void onReceivedError(WebView view, int errorCode,        String description, String failingUrl) {    switch(errorCode)    {        case HttpStatus.SC_NOT_FOUND:        //去加载我们的本地html文件        view.loadUrl("file:///android_assets/error_handle.html");        break;    }      }  });

WebView与Js的交互

1. webview调用js

mWebView.loadUrl("javascript:do()");

以上是webview在调用js中的一个叫做do的方法，该js所在的html文件大致如下：

<html>  <script language="javascript">    /* This function is invoked by the webview*/    function do() {      alert("1");    }  </script>  <body>    <a><div style="width:80px;      margin:0px auto;      padding:10px;      text-align:center;      border:2px solid #111111;" >        <img id="droid" src="xx.png"/><br>        Click me!    </div></a>  </body></html>

2. js调用webview
我们假设下列的本地类是要给js调用的：

package com.test.webview;class DemoJavaScriptInterface {  DemoJavaScriptInterface() {  }  /**   * This is not called on the UI thread. Post a runnable to invoke   * loadUrl on the UI thread.   */  public void clickOnAndroid() {      mHandler.post(new Runnable() {    public void run() {        //TODO    }      });  }    }

首先给webview设置：

mWebview.setJavaScriptEnabled(true);

随后将本地的类（被js调用的）映射出去：

mWebView.addJavascriptInterface(new DemoJavaScriptInterface(), "demo");

“demo”这个名字就是公布出去给JS调用的，那么js久可以直接用下列代码调用本地的DemoJavaScriptInterface类中的方法了：

WebView与JavaScript相互调用混淆问题

若webview中的js调用了本地的方法，正常情况下发布的debug包js调用的时候是没有问题的，但是通常发布商业版本的apk都是要经过混淆的步骤，这个时候会发现之前调用正常的js却无法正常调用本地方法了。

这是因为混淆的时候已经把本地的代码的引用给打乱了，导致js中的代码找不到本地的方法的地址。

解决这个问题很简单，即在proguard.cfg文件中加上一些代码，声明本地中被js调用的代码不被混淆。下面举例说明：

第五节中被js调用的那个类DemoJavaScriptInterface的包名为com.test.webview，那么就要在proguard.cfg文件中加入：

-keep public class com.test.webview.DemoJavaScriptInterface{    public <methods>;}

若是内部类，则大致写成如下形式：

-keep public class com.test.webview.DemoJavaScriptInterface$InnerClass{    public <methods>;}

若android版本比较新，可能还需要添加上下列代码：

-keepattributes *Annotation*  -keepattributes *JavascriptInterface*

0 0