Android版添加phonegap--Sqlite實現離線功能技術教程

1、創建Phonegap環境
1) 在Phonegap官網下載Phonegap最新版本的開發包Phonegap1.9.0

2) 建立Android項目，將Phonegap1.9.0包中的XML文件夾拷進項目中的res文件夾
裏，在文件夾asset中創建文件夾www，並把cordova-1.9.0.js拷進www文件夾中。

3)在工程中加入corvoda-1.9.0.jar，經過buildpath導入工程中。

4)在AndroidManifest.xml里加入如下代碼：      
<supports-screens
android:largeScreens="true"         
android:normalScreens="true"         
android:smallScreens="true"         
android:xlargeScreens="true"         
android:resizeable="true"         
android:anyDensity="true"/>

<uses-permission android:name="android.permission.CAMERA"/>
<uses-permission android:name="android.permission.VIBRATE"/>
<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION"/>
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION"/>
<uses-permission android:name="android.permission.ACCESS_LOCATION_EXTRA_COMMANDS"/>
<uses-permission android:name="android.permission.INTERNET"/>
<uses-permission android:name="android.permission.RECEIVE_SMS"/>
<uses-permission android:name="android.permission.RECORD_AUDIO"/>
<uses-permission android:name="android.permission.RECORD_VIDEO"/>
<uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS"/>
<uses-permission android:name="android.permission.READ_CONTACTS"/>
<uses-permission android:name="android.permission.WRITE_CONTACTS"/>    
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>  
<uses-permission android:name="android.permission.GET_ACCOUNTS"/>
<uses-permission android:name="android.permission.BROADCAST_STICKY"/>  

5)把src中的Activity改爲繼承DroidGap，setContextView()改爲
super.loadUrl("file:///android_asset/www/index.html")
並在www文件夾創建index.html文件，在html文件中導入cordova-1.9.0.js
<script type="text/javascript" charset="utf-8" src="cordova-1.9.0.js"></script>
完成以上步驟，Phonegap環境配置成功。
 
2、經過ajax請求服務器獲取JSON數據
//經過ajax請求服務器取得數據
function request(){    
//創建一個XMLHttpRequest對象      
var xmlhttp;
if (window.XMLHttpRequest){
xmlhttp=new XMLHttpRequest();
}else{     
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}   
xmlhttp.open("GET","http://10.108.1.113:8080/PassengerService/servlet/mServlet",true);  
xmlhttp.send();
xmlhttp.onreadystatechange=function(){   
if (xmlhttp.readyState==4 && xmlhttp.status==200){          
var result=xmlhttp.responseText;          
var shu=parserJSON(result);         
}else{  
window.plugins.simpleplugin.selectDB();
        }
       }
 }
xmlhttp.onreadystatechange=function(){   
if(xmlhttp.readyState==4 && xmlhttp.status==200){          
var result=xmlhttp.responseText;          
var shu=parserJSON(result);         
}else{  
window.plugins.simpleplugin.selectDB();
}
       }
       }

3、解析JSON數據
@param JSONdata //傳入要解析的JSON數據格式的字符串
function parserJSON(JSONdata){  
var JSONobj=eval('('+JSONdata+')');
//window.plugins爲引用插件。調用插件simpleplugin的insertDB方法，解析JSON的同時插入進數據庫中    
for(var i=0;i<JSONobj.passengers.length;i++){
window.plugins.simpleplugin.insertDB(JSONobj.passengers.length,'Passengers', JSONobj.passengers[i].passenger_id,      
JSONobj.passengers[i].passenger_name,      
JSONobj.passengers[i].icon_url,          
JSONobj.passengers[i].job);  
}
}

4、離線功能：離線功能是指把從服務器得到的數據保存進數據庫中。在不能使用網絡的狀況下，能從數據庫取出數據，達到離線功能。
1)調用Phonegap的api，製做數據庫插件。新建SimplePlugin.js文件
Phonegap.addConstructor(function(){  
Phonegap.addPlugin('simpleplugin', new SimplePlugin());
});
//插件名爲simpleplugin，在html文件中調用插件語句爲window.plugins.simpleplugin。當調用插件時，自動建立SimplePlugin的對象，並能調用該對象的方法。  

2) 編寫插件裏的方法  
db.transaction(populateDB,successCB,errorCB);
var SimplePlugin = function(){
};  
SimplePlugin.prototype.createDB = function(table_name){
Var db=window.openDatabase("db_amberlo", "1.0", "Cordova Demo", 200000); db.transaction(
function CreateDB(tx){    
tx.executeSql('CREATE TABLE IF NOT EXISTS '+table_name+    
'(passenger_id INTEGER primary key AUTOINCREMENT,'+
'passenger_name varchar(20), '+ 'icon_url varchar(50), '+'job varchar(20))');
},
errorCB, successCB);
};  
var count=0;
var nowNum=0;  
SimplePlugin.prototype.insertDB=
function(num,table_name,passenger_id,passenger_name,icon_url,job){  
var db=window.openDatabase("db_amberlo", "1.0", "Cordova Demo", 200000); nowNum=num;  
db.transaction(function queryID(tx){
tx.executeSql('SELECT passenger_id FROM Passengers where passenger_id='+passenger_id,[],function queryFinish(tx,result){     
var len2 = result.rows.length;
if(len2==0){  
db.transaction(
function InsertDB(tx){   
count++;  
tx.executeSql('INSERT INTO '+table_name
+'(passenger_name,icon_url,job)VALUES ("'+ passenger_name+'","'  
+job + '")');
},errorCB, successCB_show);
  }
},errorCB);
},errorCB);
};
SimplePlugin.prototype.selectDB=function(){  
var db=window.openDatabase("db_amberlo", "1.0", "Cordova Demo", 200000); db.transaction(queryDB,errorCB);
}
function queryDB(tx){  
tx.executeSql('SELECT * FROM Passengers', [],querySuccess,errorCB);
}    
var total=document.getElementById("ul_first");
var image=new Array();  
var h33=new   Array();  
var p11=new   Array();  
var p22=new   Array();
for(var i=0;i<results.rows.length;i++){   
var li=document.createElement("li");  
total.appendChild(li);  
var a=document.createElement("a");
a.setAttribute("href","#");
var img=document.createElement("img");   
image[i]=img;
image[i].src="file:///android_asset/www/passenger-1.0.1/female.PNG";    
var h3=document.createElement("h3");   
h33[i]=h3;
h33[i].innerHTML= results.rows.item(i).position+"&nbsp;&nbsp;"
+results.rows.item(i).passenger_name
+"&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;"+results.rows.item(i).company;    
p1=document.createElement("p");   
p11[i]=p1;
p11[i].innerHTML=
results.rows.item(i).card_kind+"&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;"+results.rows.item(i).job;    
var p2=document.createElement("p");   
p22[i]=p2;
p22[i].innerHTML="旅客職位:" + results.rows.item(i).job;    
li.appendChild(a);   
a.appendChild(img);   
a.appendChild(h3);
a.appendChild(p1);
a.appendChild(p2);
$('ul').listview('refresh');

KeyMob移動廣告平臺爲應用開發者提供高效穩定的移動廣告SDK，支持主流智能手機操做系統，擁有插屏、全屏廣告、視頻廣告等豐富廣告形式，幫助應用開發者將流量快速轉化爲廣告收入。