快捷導(dǎo)航

android WebView組件使用總結(jié)

更新時(shí)間：2012年12月28日 16:27:56 作者：

瀏覽器控件是每個(gè)開(kāi)發(fā)環(huán)境都具備的，這為馬甲神功提供了用武之地，windows的有webbrowser，android和ios都有webview;本篇主要介紹android的webview之強(qiáng)大,感興趣的朋友可以研究下

瀏覽器控件是每個(gè)開(kāi)發(fā)環(huán)境都具備的，這為馬甲神功提供了用武之地，windows的有webbrowser，android和ios都有webview。只是其引擎不同，相對(duì)于微軟的webbrowser，android及ios的webview的引擎都是webkit，對(duì)Html5提供支持。本篇主要介紹android的webview之強(qiáng)大。

webview組件如何使用
1)添加權(quán)限：AndroidManifest.xml中必須使用許可"android.permission.INTERNET",否則會(huì)出Web page not available錯(cuò)誤。
2)在要Activity中生成一個(gè)WebView組件：WebView webView = new WebView(this);或者可以在activity的layout文件里添加webview控件：

復(fù)制代碼代碼如下:

 
<WebView 
android:id="@+id/wv" 
android:layout_width="fill_parent" 
android:layout_height="fill_parent" 
android:text="@string/hello" 
/> 

　
3)設(shè)置WebView基本信息：
如果訪問(wèn)的頁(yè)面中有Javascript，則webview必須設(shè)置支持Javascript。
webview.getSettings().setJavaScriptEnabled(true);
觸摸焦點(diǎn)起作用
requestFocus();
取消滾動(dòng)條
this.setScrollBarStyle(SCROLLBARS_OUTSIDE_OVERLAY);
4)設(shè)置WevView要顯示的網(wǎng)頁(yè)：
互聯(lián)網(wǎng)用：webView.loadUrl("http://www.google.com");
本地文件用：webView.loadUrl("file:///android_asset/XX.html"); 本地文件存放在：assets文件中。
5)如果希望點(diǎn)擊鏈接由自己處理，而不是新開(kāi)Android的系統(tǒng)browser中響應(yīng)該鏈接。給WebView添加一個(gè)事件監(jiān)聽(tīng)對(duì)象（WebViewClient)并重寫(xiě)其中的一些方法：
shouldOverrideUrlLoading：對(duì)網(wǎng)頁(yè)中超鏈接按鈕的響應(yīng)。當(dāng)按下某個(gè)連接時(shí)WebViewClient會(huì)調(diào)用這個(gè)方法，并傳遞參數(shù)：按下的url。比如當(dāng)webview內(nèi)嵌網(wǎng)頁(yè)的某個(gè)數(shù)字被點(diǎn)擊時(shí)，它會(huì)自動(dòng)認(rèn)為這是一個(gè)電話請(qǐng)求，會(huì)傳遞url：tel:123,如果你不希望如此可通過(guò)重寫(xiě)shouldOverrideUrlLoading函數(shù)解決：

復(fù)制代碼代碼如下:

 
public boolean shouldOverrideUrlLoading(WebView view,String url){ 
if(url.indexOf("tel:")<0){//頁(yè)面上有數(shù)字會(huì)導(dǎo)致連接電話 
view.loadUrl(url); 
} 
return true; 
} 

另外還有其他一些可重寫(xiě)的方法
1，接收到Http請(qǐng)求的事件
onReceivedHttpAuthRequest(WebView view, HttpAuthHandler handler, String host, String realm)
2，打開(kāi)鏈接前的事件
public boolean shouldOverrideUrlLoading(WebView view, String url) { view.loadUrl(url); return true; }
這個(gè)函數(shù)我們可以做很多操作，比如我們讀取到某些特殊的URL，于是就可以不打開(kāi)地址，取消這個(gè)操作，進(jìn)行預(yù)先定義的其他操作，這對(duì)一個(gè)程序是非常必要的。
3，載入頁(yè)面完成的事件
public void onPageFinished(WebView view, String url){ }
同樣道理，我們知道一個(gè)頁(yè)面載入完成，于是我們可以關(guān)閉loading條，切換程序動(dòng)作。
4，載入頁(yè)面開(kāi)始的事件
public void onPageStarted(WebView view, String url, Bitmap favicon) { }
這個(gè)事件就是開(kāi)始載入頁(yè)面調(diào)用的，通常我們可以在這設(shè)定一個(gè)loading的頁(yè)面，告訴用戶程序在等待網(wǎng)絡(luò)響應(yīng)。
通過(guò)這幾個(gè)事件，我們可以很輕松的控制程序操作，一邊用著瀏覽器顯示內(nèi)容，一邊監(jiān)控著用戶操作實(shí)現(xiàn)我們需要的各種顯示方式，同時(shí)可以防止用戶產(chǎn)生誤操作。
6)如果用webview點(diǎn)鏈接看了很多頁(yè)以后，如果不做任何處理，點(diǎn)擊系統(tǒng)“Back”鍵，整個(gè)瀏覽器會(huì)調(diào)用finish()而結(jié)束自身，如果希望瀏覽的網(wǎng)頁(yè)回退而不是退出瀏覽器，需要在當(dāng)前Activity中處理并消費(fèi)掉該Back事件。
覆蓋Activity類的onKeyDown(int keyCoder,KeyEvent event)方法。

復(fù)制代碼代碼如下:

 
public boolean onKeyDown(int keyCoder,KeyEvent event){ 
if(webView.canGoBack() && keyCoder == KeyEvent.KEYCODE_BACK){ 
webview.goBack(); //goBack()表示返回webView的上一頁(yè)面 
return true; 
} 
return false; 
} 

Webview與js交互
Webview與js的雙向交互才是android的webview強(qiáng)大所在，也是馬甲精神能夠徹底執(zhí)行的基礎(chǔ)保障。
首先，webview可以定義一個(gè)在其內(nèi)嵌頁(yè)面中可以觸發(fā)的事件

復(fù)制代碼代碼如下:

 
wv.addJavascriptInterface(new DemoJavaScriptInterface(), "demo"); 
private final class DemoJavaScriptInterface 
{ 
DemoJavaScriptInterface(){} 
public void clickonAndroid( final String order){ 
mHandler.post(newRunnable(){ 
@Override 
public void run(){ 
jsonText="{"name":""+order+""}"; 
wv.loadUrl("javascript:wave("+jsonText+")"); 
} 
}); 
} 
} 

通過(guò)以上代碼，即可實(shí)現(xiàn)在其內(nèi)嵌網(wǎng)頁(yè)中觸發(fā)window.demo.clickOnAndroid(str)事件并傳參數(shù)str給webview。Webview接收到str之后，可以通過(guò)以上代碼觸發(fā)其內(nèi)嵌頁(yè)面中的js函數(shù)wave(str)。這樣就可以實(shí)現(xiàn)網(wǎng)頁(yè)觸發(fā)webview的事件并傳參數(shù)，webview接收參數(shù)并調(diào)用js函數(shù)。
下面看我的Html腳本：

復(fù)制代碼代碼如下:

 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
<title>Insert title here</title> 
<script type="text/javascript" src="jquery.js"></script> 
<script> 
function toclient() 
{ 
var order=$("#val").val(); 
window.demo.clickonAndroid(order); 
} 
function wave(str){ 
//alert(str.name); 
$("#fromclient").text(str.name); 
} 
</script> 
</head> 
<body>這是一個(gè)html頁(yè)面 
<br/> 
輸入一個(gè)字符串：<br/> 
<input id="val" /> 
<input type="submit" value="點(diǎn)擊提交給客戶端" 
onclick="toclient();"/> 
<br /> 
顯示返回：<label id="fromclient"></label> 
</body> 
</html> 

通過(guò)腳本看到wave（str）函數(shù)是負(fù)責(zé)將原來(lái)傳給webview的數(shù)據(jù)重新拿回頁(yè)面，效果圖如下：
另外，如果你想獲取頁(yè)面的一些處理數(shù)據(jù)并交給webview客戶端處理，可在wave函數(shù)里將數(shù)據(jù)alert，然后webview中重寫(xiě)WebChromeClient的onJsAlert函數(shù)，具體代碼如下
wv.setWebChromeClient(new MyWebChromeClient());

復(fù)制代碼代碼如下:

 
final class MyWebChromeClient extends WebChromeClient{ 
@Override 
public booleanonJsAlert(WebView view, String url, String message, final JsResult result) { 
//message就是wave函數(shù)里alert的字符串，這樣你就可以在android客戶端里對(duì)這個(gè)數(shù)據(jù)進(jìn)行處理 
result.confirm(); 
} 
return true; 
} 

您可能感興趣的文章: