在Android应用中,需要使用WebView控件对Web程序进行解析,这个控件实际上使用了Webkit内核的内嵌浏览器.
下面以一个简易浏览器的例子来讲述WebView的使用步骤:
1 由于涉及到访问网络,所以必须要在AndroidManifest添加访问网络权限:
<uses-permission android:name="android.permission.INTERNET" />2 然后在布局文件里,添加WebView控件.
因为为了做成一个浏览器的样子，这里除了添加WebView外,还添加了一个EditText用于输入网址,以及一个按钮,用来触发访问网址。除此之外，还添加了四个按钮，分别用来控制“后退”“前进”“主页”“设置成无图模式”等动作。详细代码如下：
<?xml version="1.0" encoding="UTF-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/tab1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#CCCCCC"
android:orientation="horizontal" >
<EditText
android:id="@+id/url"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="5"
android:inputType="textUri"
android:text="www.baidu.com" />
<Button
android:id="@+id/visit"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="访问" >
</Button>
</LinearLayout>
<ProgressBar
android:id="@+id/loadding_progress"
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="fill_parent"
android:layout_height="12dp"
android:max="100" />
<WebView
android:id="@+id/wv"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="12" />
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#CCCCCC"
android:orientation="horizontal" >
<LinearLayout
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="1"
android:gravity="center" >
<ImageButton
android:id="@+id/back"
android:layout_width="20dp"
android:layout_height="20dp"
android:background="@drawable/backbutton" >
</ImageButton>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="1"
android:gravity="center" >
<ImageButton
android:id="@+id/ahead"
android:layout_width="20dp"
android:layout_height="20dp"
android:background="@drawable/aheadbutton" >
</ImageButton>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="1"
android:gravity="center" >
<Button
android:id="@+id/home"
android:layout_width="20dp"
android:layout_height="20dp"
android:background="@drawable/homebutton" >
</Button>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="1"
android:gravity="center" >
<Button
android:id="@+id/nopicture"
android:layout_width="20dp"
android:layout_height="20dp"
android:background="@drawable/wutubutton" >
</Button>
</LinearLayout>
</LinearLayout>
</LinearLayout>3 接下来，分开多个模块来讲述WebView的多个功能。
- 首先，肯定要讲述如何实现加载页面
WebView wv = (WebView) findViewById(R.id.wv);
wv.loadUrl("http://www.baidu.com");
- 加载页面时,监听加载页面开始,结束等事件
这里通过重写WebViewClient的onPageFinished,onPageStarted方法。来完成想在加载页面开始以及结束时的动作。
class myWebClient extends WebViewClient {
@Override
public void onPageFinished(WebView view, String url) {// 加载页面结束时触发
// TODO Auto-generated method stub
//可以在这里结束进度条
super.onPageFinished(view, url);
}
@Override
public void onPageStarted(WebView view, String url, Bitmap favicon) {// 加载页面开始时触发
// TODO Auto-generated method stub
//可以在这里启动一个进度条,用来提示用户正在加载
super.onPageStarted(view, url, favicon);
}
}- 在上一点虽然可以监听加载页面的开始与结束,但无法知道加载过程中的进度。这里可以通过重写WebChromeClinent的onProgressChanged方法来知道加载过程中的进度。
wv.setWebChromeClient(new WebChromeClient() {
public void onProgressChanged(WebView view, int newProgress) {
Log.i(TAG, "加载进度" + newProgress);
loadProgressBar.setProgress(newProgress);
//当进度达到100,则隐藏进度条
if (newProgress >= 100) {
loadProgressBar.setAlpha(0);
}
}
});- 在WebView使用javaScript
webSettings = wv.getSettings();
webSettings.setJavaScriptEnabled(true);//设置可以用javaScript- 处理在WebView所点击的链接
当单击在WebView上的链接时，默认行为是利用默认的网页浏览器打开。
因此如果要处理在WebView所点击链接，要为您的WebView提供一个WebViewClient，使用setWebViewClient()。
wv.setWebViewClient(new WebViewClient() {
public boolean shouldOverrideUrlLoading(final WebView view,final String url) {
wv.loadUrl(url);// 载入网页
return true;
}// 重写点击动作,用webview载入
});- 访问浏览的历史记录
可以先通过WebView的canGoBack()方法与canGoForward()方法来判断是否有能返回或者前进的历史记录。
若有，在通过WebView的goBack()方法与goForward方法来返回或者前进。
case R.id.back:
if (wv.canGoBack()) {
wv.goBack();
}
break;
case R.id.ahead:
if (wv.canGoForward()) {
wv.goForward();
}
break;- 设置无图模式
通过WebSettings的setBlockNetworkImage()方法便可以实现。
wv.getSettings().setBlockNetworkImage(true);- 设置缓存
在谈设置缓存前，先了解一下有哪些缓存模式：
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，都使用缓存中的数据。
根据上述各种缓存模式的解释，缓存策略应该为，判断是否有网络，有的话，使用LOAD_DEFAULT，无网络时，使用LOAD_CACHE_ELSE_NETWORK。
在设置缓存前，应该给缓存设置一个路径，以及控制缓存大小：
设置缓存路径可以通过WebSettings的setAppCachePath()方法来实现;
而设置缓存大小,可以通过WebSettings的setAppCacheMaxSize()方法来实现。
然后设置缓存，就可以通过WebSettings的setAppCacheEnabled(true)来实现;
关键代码为：
//设置缓存,缓存大小为
webSettings.setAppCacheEnabled(true);
webSettings.setAppCachePath(CachePath.getCachePath());
webSettings.setAppCacheMaxSize(1024*1024*8);
//当有网时,缓存模式设置为LOAD_DEFAULT;当没网时,缓存模式设置为LOAD_CACHE_ELSE_NETWORK;
if (checkNet.isNetWorkConnected()) {
webSettings.setCacheMode(WebSettings.LOAD_DEFAULT);
}else {
webSettings.setCacheMode(WebSettings.LOAD_CACHE_ELSE_NETWORK);
}