為什么要開發(fā)web app？
1.web app區(qū)別于native app，它使用html、css、js等web開發(fā)語言，在安卓項目內部使用webview來訪問這些網站地址?？梢宰龅絠os與android上保持同一開發(fā)，縮短開發(fā)周期和成本，并且可以很好地適應不同的移動終端顯示器的大小。而native app顯然要針對不同的運行平臺使用不同的技術語言開發(fā)。同時目前已有很多web app的框架和開源項目，里面實現(xiàn)了多種不同的前端效果，方便用戶直接使用。
SUI框架簡介
為了了解SUI框架，首先可以了解Framwork框架，這是一種ios風格的html框架，目前較為主流，為了方便初學者學習使用，淘寶團隊為框架翻譯了一份中文文檔。參見鏈接：http://framework7.taobao.org
Framework框架有著如下幾個特點：
1.原生的滾動條 2.輕量、高效、不依賴第三方框架 3.使用ajax來加載新頁面?
4.支持獨立的多個視圖 5.簡潔的js api 6.滑動返回、滑動操作等頁面動畫
不足：這款框架的不足之處在于對于安卓應用會偶爾產生不兼容現(xiàn)象，針對這一特征淘寶團隊在其基礎上設計出了輕量且兼容所有主流安卓設備的MSUI框架
MSUI框架（即SUI框架）：
除了保留了framework的一些特性，設計為ios風格的web app框架之外，msui框架還加入了中國地區(qū)選擇等一些獨具地方特色和實用性的組件。
SUI框架使用方法
詳見： http://m.sui.taobao.org/getting-started/
1.引用外部的資源樣式
2.以編寫web界面的方式編寫界面框架代碼
3.添加需要的sui框架內組件
web app的實現(xiàn)方法
web app的實現(xiàn)本質上就是在安卓的項目內使用webview（網絡視圖）以訪問網站的形式在安卓項目內訪問編寫好的html代碼。
實現(xiàn)步驟：
1.在要Activity中實例化WebView組件：WebView webView = new WebView(this);
2.調用WebView的loadUrl()方法，設置WevView要顯示的網頁：
互聯(lián)網用：webView.loadUrl("http://www.baidu.com");
本地文件用：webView.loadUrl("file:///android_asset/XX.html");?本地文件存放在：assets?文件中
3.調用Activity的setContentView()方法來顯示網頁視圖
4.用WebView點鏈接看了很多頁以后為了讓WebView支持回退功能，需要覆蓋覆蓋Activity類的onKeyDown()方法，如果不做任何處理，點擊系統(tǒng)回退剪鍵，整個瀏覽器會調用finish()而結束自身，而不是回退到上一頁面
5.需要在AndroidManifest.xml文件中添加權限，否則會出現(xiàn)Web page not available錯誤。
示例：MainActivity.java
packagecom.android.webview.activity;
importandroid.app.Activity;
importandroid.os.Bundle;
importandroid.view.KeyEvent;
importandroid.webkit.WebView;
publicclassMainActivityextendsActivity?{
privateWebView?webview;
@Override
publicvoidonCreate(Bundle?savedInstanceState)?{
super.onCreate(savedInstanceState);
//實例化WebView對象
webview?=newWebView(this);
//設置WebView屬性，能夠執(zhí)行Javascript腳本
webview.getSettings().setJavaScriptEnabled(true);
//加載需要顯示的網頁
webview.loadUrl("http://www.51cto.com/");
//設置Web視圖
setContentView(webview);
}
@Override
//設置回退
//覆蓋Activity類的onKeyDown(int?keyCoder,KeyEvent?event)方法
publicbooleanonKeyDown(intkeyCode,?KeyEvent?event)?{
if((keyCode?==?KeyEvent.KEYCODE_BACK)?&&?webview.canGoBack())?{
webview.goBack();//goBack()表示返回WebView的上一頁面
returntrue;
}
returnfalse;
}
