很好的兩篇文章,轉過來希望更多的人看到
第一篇:
- 建立通訊機制,提供接口給瀏覽器端,方便 JavaScript 進行調用。
- 數據隊列的維護,以保證瀏覽器端的調用後產生的數據可以回送。
- 插件體系的建立,提供整個框架的可擴展性。
- DroidGap、App
- CallbackServer
- Plugin、PluginManager
&& defaultValue.substring(0, 4).equals("gap:")) {
JSONArray array;
try {
array = new JSONArray(defaultValue.substring(4));
String service = array.getString(0);
String action = array.getString(1);
String callbackId = array.getString(2);
boolean async = array.getBoolean(3);
String r = pluginManager.exec(service, action, callbackId, message, async);
result.confirm(r);
} catch (JSONException e) {
e.printStackTrace();
}
}
// Polling for JavaScript messages
else if ......
- 利用查詢之前提到的 HashMap<String, String> 將 service 和 className 對應起來,這樣我們就獲得了提供功能的插件類的位置。
- 通過 getClassByName 來獲得插件類。
- 完成類型檢測,確定對應的類是一個插件類。
- 執行 addPlugin 方法,其中則將第 2 步中獲得插件類的 className 和具體的 Plugin 接口的實現綁定,具體的實現就是上文中提到的 HashMap<Strig,IPlugin>。
- 判斷 Plugin 是否需要異步執行,再根據情況,選擇直接執行或者是建立新的線程來執行。
- 完成執行後,得到的數據會根據情況交給 CallbackServer 來處理,PluginManager 會調用 DroidGap 中的 sendJavaScript 來將數據交給 CallbackServer,事實上,DroidGap 中的 sendJavaScript 不過是對 CallbackServer 中的 sendJavaScript 包裝,實際調用的是 CallbackServer 中的 sendJavaScript 方法,這涉及到了 CallbackServer 類,隨後就會說明。
- 首先利用 ServerSocket 監聽端口,具體端口則自由分配。
- 在 accept 後則是對 HTTP 協議的解析,和對應的返回 status code。
- 在驗證正確後,利用 getJavascript 方法得到維護的 LinkedList<String>() 中的保存的 js 代碼,如果爲空則返回 null。
- 這些具體的 string 類型的 js 代碼則利用 socket 作爲 response 返回給前端。
if (success || fail) {
PhoneGap.callbacks[callbackId] = {success:success, fail:fail};
}
var r = prompt(PhoneGap.stringify(args), "gap:"+
PhoneGap.stringify([service, action, callbackId, true]));
// If a result was returned
if (r.length > 0) {
eval("var v="+r+";");
// If status is OK, then return value back to caller
if (v.status === PhoneGap.callbackStatus.OK) {
......
}else if ......
}
public PluginResult execute(String action, JSONArray args, String callbackId) {
PluginResult.Status status = PluginResult.Status.OK;
PluginResult r=null;
if (action.equals("sayHello")){
r = new PluginResult(status,"Hello");
}else if (action.equals("saySth")){
r = new PluginResult(status,args);
}
return r;
}
- 如果 action 的參數是 sayHello,則返回字符串“Hello”。
- 如果是 saySth,則返回 args 中的內容。
}
Hello.prototype.saySth = function(msg, callback, fail) {
return PhoneGap.exec(function(args) {
callback(args);
}, function(args) {
if(typeof fail == 'function') {
fail(args);
}
}, 'Hello', 'saySth', [msg]);
}
Hello.prototype.sayHello = function(callback, fail) {
return PhoneGap.exec(function(args) {
callback(args);
}, function(args) {
if(typeof fail == 'function') {
fail(args);
}
}, 'Hello', 'sayHello',['sayHello']);
}
PhoneGap.addConstructor(function() {
PhoneGap.addPlugin('hello', new Hello());
//PluginManager.addService("Hello","qj.Hello");
})
this.pluginManager.addService("Hello", "qj.Hello");
|
function(arg){alert(arg);});
window.plugins.hello.saySth("Bingo",function(arg){alert(arg);},
function(arg){alert(arg);});
-
訪問 官方網站在線文檔,瞭解更多的 PhoneGap 使用細節。
-
訪問 Phonegap 在 hithub 上的代碼,瞭解更多的 PhoneGap 代碼細節。
-
訪問 Android 的開發者網站,瞭解更多的 Android 的開發細節。
-
隨時關注 developerWorks 技術活動和 網絡廣播。
-
訪問 developerWorks Open source 專區獲得豐富的 how-to 信息、工具和項目更新以及 最受歡迎的文章和教程,幫助您用開放源碼技術進行開發,並將它們與
IBM 產品結合使用。
this.pluginManager.addService("Hello", "qj.Hello");
|
第二篇
轉自:http://blog.csdn.net/iefreer/article/details/7054241
PhoneGap(1.1.0)是如何工作的
利用PhoneGap可以快速開發覆蓋所有主流智能手機的應用程序。寫一次,多個平臺運行。
其基本策略是使用WEB編程技術(HTML5/CSS/JS),把應用程序構建在html控件中,
利用額外的javascript封裝包屏蔽底層平臺的接口差別,對開發者提供統一的JS接口,從而實現跨平臺的特性。
當然要實現跨平臺,也會犧牲一些本地應用的功能以及性能。
技術取捨最終取決於手機平臺和瀏覽器技術的發展和具體的業務應用場景。
本文以Android平臺爲例,簡單介紹這個平臺是如何工作的。
1、代碼結構
- src
- assets
- www
- index.html
- main.js
- pg*.css
- phonegap-*.js
- bin
- libs
a)src目錄包含了工程的java源代碼,用戶自定義的程序YourAppActivity主活動派生自DroidGap,其代表了PhoneGap Android應用程序。
DroidGap最重要的成員變量是WebView控件,可以理解爲PhoneGap的應用程序的宿主。HTML代碼就依賴於WebView來解析和呈現。
b)www目錄包含了程序的主頁面index.html,該頁面在程序啓動時被加載。phonegap*.js就是PhoneGap的JS對設備本地功能如Contacts、Campass、Camera等的封裝包。main.js是處理主頁面用戶請求的js腳本。*.css用來控制樣式。
c)bin目錄包含了應用程序經PhoneGap編譯後的輸出
d)libs包含了PhoneGap java實現庫。
2、處理流程
程序開始的時候觸發loadUrl服務,加載應用程序主頁面index.html;
當用戶在頁面中操作時,比如下面的代碼片斷是想獲取本地通訊錄:
<div data-role="button" οnclick="get_contacts();">Get Phone's Contacts</div>
將觸發main.js中的get_contacts函數,該函數將執行PhoneGap.exec(...)命令主入口,該命令以gap:的格式開頭:
PhoneGap.exec(successCB, errorCB, "Contacts", "search", [fields, options]);
其中Contacts是Plugin,search是作用於該Plugin上面的動作。
exec函數將調用javascript的prompt函數,最終觸發DroidGap包中(WebView)的onJsPrompt偵聽器,
在偵聽函數中派發給Contacts插件處理該動作。
最終返回處理結果,並呈現。