[轉載]馬甲神功之android版
(2011-11-23 22:27:40) 馬甲神功之android版
I. 引言
時下單純的web開發與客戶端開發居多，web應用相較桌面應用具有更新方便、維護成本低、開發迅速等特點，而客戶端則具有高實時性等優勢。題目中所謂馬甲神功，是指將web開發與客戶端開發二者結合，大體分為兩類：客戶端瀏覽器控件內嵌web應用，web應用內嵌applet對象。通俗點說B/S應用穿C/S馬甲，C/S應用穿B/S馬甲，此為馬甲精神要髓。
隨著移動設備的不斷成熟，眼下移動設備的應用已經漸近桌機。Android操作系統的手機、平板廣泛存在并深受大眾喜愛，相應基于android開發的應用也十分火爆。筆者寫此文章一篇，主要介紹android下如何馬甲及馬甲效果能達到什么程度。
II. android的馬甲WEBVIEW
瀏覽器控件是每個開發環境都具備的，這為馬甲神功提供了用武之地，windows的有webbrowser，android和ios都有webview。只是其引擎不同，相對于微軟的webbrowser，android及ios的webview的引擎都是webkit，對Html5提供支持。本篇主要介紹android的webview之強大。
A. webview組件如何使用
1) 添加權限：AndroidManifest.xml中必須使用許可"android.permission.INTERNET",否則會出Web page not available錯誤。
2) 在要Activity中生成一個WebView組件：WebView webView = new WebView(this);或者可以在activity的layout文件里添加webview控件：
<WebView
android:id="@+id/wv"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:text="@string/hello"
/>
3) 設置WebView基本信息：
如果訪問的頁面中有Javascript，則webview必須設置支持Javascript。
webview.getSettings().setJavaScriptEnabled(true);
觸摸焦點起作用
requestFocus();
取消滾動條
this.setScrollBarStyle(SCROLLBARS_OUTSIDE_OVERLAY);
4) 設置WevView要顯示的網頁：
互聯網用：webView.loadUrl("http://www.google.com");
本地文件用：webView.loadUrl("file:///android_asset/XX.html"); 本地文件存放在：assets文件中
5) 如果希望點擊鏈接由自己處理，而不是新開Android的系統browser中響應該鏈接。給WebView添加一個事件監聽對象（WebViewClient)并重寫其中的一些方法：
shouldOverrideUrlLoading：對網頁中超鏈接按鈕的響應。當按下某個連接時WebViewClient會調用這個方法，并傳遞參數：按下的url。比如當webview內嵌網頁的某個數字被點擊時，它會自動認為這是一個電話請求，會傳遞url：tel:123,如果你不希望如此可通過重寫shouldOverrideUrlLoading函數解決：
public boolean shouldOverrideUrlLoading(WebView view,String url){
if(url.indexOf("tel:")<0){//頁面上有數字會導致連接電話
view.loadUrl(url);
}
return true;
}
另外還有其他一些可重寫的方法
1，接收到Http請求的事件
onReceivedHttpAuthRequest(WebView view, HttpAuthHandler handler, String host, String realm)
2，打開鏈接前的事件
public boolean shouldOverrideUrlLoading(WebView view, String url) { view.loadUrl(url); return true; }
這個函數我們可以做很多操作，比如我們讀取到某些特殊的URL，于是就可以不打開地址，取消這個操作，進行預先定義的其他操作，這對一個程序是非常必要的。
3，載入頁面完成的事件
public void onPageFinished(WebView view, String url){ }
同樣道理，我們知道一個頁面載入完成，于是我們可以關閉loading條，切換程序動作。
4，載入頁面開始的事件
public void onPageStarted(WebView view, String url, Bitmap favicon) { }
這個事件就是開始載入頁面調用的，通常我們可以在這設定一個loading的頁面，告訴用戶程序在等待網絡響應。
通過這幾個事件，我們可以很輕松的控制程序操作，一邊用著瀏覽器顯示內容，一邊監控著用戶操作實現我們需要的各種顯示方式，同時可以防止用戶產生誤操作。
6) 如果用webview點鏈接看了很多頁以后，如果不做任何處理，點擊系統“Back”鍵，整個瀏覽器會調用finish()而結束自身，如果希望瀏覽的網頁回退而不是退出瀏覽器，需要在當前Activity中處理并消費掉該Back事件。
覆蓋Activity類的onKeyDown(int keyCoder,KeyEvent event)方法。
1. public boolean onKeyDown(int keyCoder,KeyEvent event){
2. if(webView.canGoBack() && keyCoder == KeyEvent.KEYCODE_BACK){
3. webview.goBack(); //goBack()表示返回webView的上一頁面
4.
5. return true;
6. }
7. return false;
8. }
B. Webview與js交互
Webview與js的雙向交互才是android的webview強大所在，也是馬甲精神能夠徹底執行的基礎保障。
首先，webview可以定義一個在其內嵌頁面中可以觸發的事件
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+")");
}
});
}
}
通過以上代碼，即可實現在其內嵌網頁中觸發window.demo.clickOnAndroid(str)事件并傳參數str給webview。Webview接收到str之后，可以通過以上代碼觸發其內嵌頁面中的js函數wave(str)。這樣就可以實現網頁觸發webview的事件并傳參數，webview接收參數并調用js函數。
下面看我的Html腳本：
<!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>這是一個html頁面
<br/>
輸入一個字符串：<br/>
<input id="val" />
<input type="submit" value="點擊提交給客戶端"
onclick="toclient();"/>
<br />
顯示返回：<label id="fromclient"></label>
</body>
</html>
通過腳本看到wave（str）函數是負責將原來傳給webview的數據重新拿回頁面，效果圖如下：
![[轉載]馬甲神功之android版](http://s6.sinaimg.cn/middle/71b49f51gaa36b6a6bc55&690 "[轉載]馬甲神功之android版")
另外，如果你想獲取頁面的一些處理數據并交給webview客戶端處理，可在wave函數里將數據alert，然后webview中重寫WebChromeClient的onJsAlert函數，具體代碼如下
wv.setWebChromeClient(new MyWebChromeClient());
final class MyWebChromeClient extends WebChromeClient{
@Override
public booleanonJsAlert(WebView view, String url, String message, final JsResult result) {
//message就是wave函數里alert的字符串，這樣你就可以在android客戶端里對這個數據進行處理
result.confirm();
}
return true;
}
III. 總結
馬甲精神綜合利用B/S
及C/S
的優勢，android
及iOS
的webview
強大到如此地步，更是馬甲仙人們的福音