关于PhoneGap你应该知道的12件事 （12 things you should know about PhoneGap)

在w3ctech上的演讲稿，介绍了PhoneGap的基本概念，用法，打包，插件的开发，以Android为例介绍了PhoneGap的内部机制，以及如何调试PhoneGap应用。

Transcript

1. ܱႿ1IPOF(BQ֥ࡱ൙ Mark Dong ׬੃٦
   Adobe Developer Evangelist weibo.com/donglongfei weibo.com/javascriptdev
2. 
   1IPOF(BQ൞൉હĤ
   Adobe 董龙飞 weibo.com/donglongfei weibo.com/javascriptdev
3. ٠໙၍׮ഡСЧֹหྟ
   յЇ)5.-
   "QQ
   ҆ඇ֞؟ᇕ௜෻
   QIPOF(BQ
   QMVHJO
   Adobe 董龙飞 weibo.com/donglongfei weibo.com/javascriptdev
4. 
   
   1IPOF(BQ҂൞൉હĤ
   Adobe 董龙飞 weibo.com/donglongfei weibo.com/javascriptdev
5. +BWB4DSJQU
   'SBNFXPSL
   
   *%&
   5PPMT
   Adobe 董龙飞 weibo.com/donglongfei weibo.com/javascriptdev
6. 
   
   ఏჷ
   Adobe 董龙飞 weibo.com/donglongfei weibo.com/javascriptdev
7. !  ൓Ⴟ୍
   ࣸࣁ೶֥ J1IPOF%FW$BNQ
   !  oCSJEHJOH
   UIF
   HBQ
   CFUXFFO
   UIF
   XFC
   BOE
   UIF
   JQIPOF
   4%,p
   ! 1IPOF(BQ
   
   JUnT
   MJLF
   "*3
   GPS
   UIF
   *QIPOF
   
   /JUPCJ
   CMPH
   Adobe 董龙飞 weibo.com/donglongfei weibo.com/javascriptdev
8. 
   
   
   1IPOF(BQᄝ҂๝௜෻֥Чֹหྟ
   Adobe 董龙飞 weibo.com/donglongfei weibo.com/javascriptdev
9. Adobe 董龙飞 weibo.com/donglongfei weibo.com/javascriptdev
10. 
    
    षჷĤ
    Adobe 董龙飞 weibo.com/donglongfei weibo.com/javascriptdev
11. $BMM#BDL
    ۷଀ູ
    "QBDIF
    $PSEPWB
    Adobe 董龙飞 weibo.com/donglongfei weibo.com/javascriptdev
12. http://incubator.apache.org/cordova/
13. 
    
    յЇ
    Adobe 董龙飞 weibo.com/donglongfei weibo.com/javascriptdev
14. Adobe 董龙飞 weibo.com/donglongfei weibo.com/javascriptdev
15. ᆌؓ҂๝௜෻֥*%&
    
    4%,
    Adobe 董龙飞 weibo.com/donglongfei weibo.com/javascriptdev
16. PhoneGap Build Compile in the cloud Adobe 董龙飞 weibo.com/donglongfei weibo.com/javascriptdev
17. 
    
    ٠໙Чֹۿି
    
20. 
    
    ൉હ൞1IPOF(BQ
    Adobe 董龙飞 weibo.com/donglongfei weibo.com/javascriptdev
22. +4
    /BUJWF
    Adobe 董龙飞 weibo.com/donglongfei weibo.com/javascriptdev
23. /BUJWF
    8FC
    $POUSPM
    1MVHJOT
    ''*
    JavaScript/CSS/HTML5 Not Web Tech Adobe 董龙飞 weibo.com/donglongfei weibo.com/javascriptdev
24. /BUJWF
    8FC
    $POUSPM
    #SPXTFS
    ğ
    GVMM
    GVODUJPOT
    $ISPNF
    SFNPWFE
    /P
    UPQ
    CBS
    
25. ''*
    'PSFJHO
    'VODUJPO
    *OUFSGBDF
    Adobe 董龙飞 weibo.com/donglongfei weibo.com/javascriptdev
26. /BUJWF
    8FC
    7JFX
    1IPOF(BQ
    1MVHJOT
    .PCJMF
    04
    
    /BUJWF
    "1*
    )BSEXBSF
    
    Ԯۋఖ
    ๭ྙԩ৘
    ຩ઎
    l
    
    8FC
    "QQ
    
    
    
    +BWB4DSJQU
    
    $44
    
    )5.-
    
    FFI 浏览器 OS API OS API 1IPOF(BQ
    "QQ
    
27. 1IPOF(BQࡏܒ
    
    
    
    .PCJMF
    04
    8FC
    "QQ
    )5.- +BWB4DSJQU $44
    /BUJWF
    8FC
    7JFX
    8FC7JFXa6*8FC7JFXl
    1IPOF(BQ
    1MVHJOT
    ജཞ๨
    ᄎ׮Ԯۋఖ
    ᆷଲᆌ
    ഡСྐ༏
    (14
    ๙ᆩ
    ຩ઎ሑ෿
    l
    קᇅQMVHJO
    HTML5 API PhoneGap JS API OS API OS API PhoneGap Native API
28. /BUJWF
    8FC
    $POUSPM
    ಆۿିᛍফఖ
    ીႵшॿ
    
29. public class CirclesActivity extends DroidGap { @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); super.loadUrl("file:///android_asset/ www/circles.html"); } } /BUJWF
    8SBQQFS
    XJUI
    1IPOF(BQ
    Adobe 董龙飞 weibo.com/donglongfei weibo.com/javascriptdev
30. 
    
    QMVHJO
    
31. )5.-ཛଢ
    QIPOFHBQKBS
    QMVHJOTYNM
    "OESPJE.BOJGFTUYNM
    BOESPJE
    BDUJWJUZ
    Adobe 董龙飞 weibo.com/donglongfei weibo.com/javascriptdev
32. In Java
33. public class callsPGPlugin extends Plugin { // List Actions public static nal String ACTION="list"; @Override public PluginResult execute(String action, JSONArray data, String callbackId) { PluginResult result=null; if(ACTION.equals(action)){ CallLogAI callLogAI = new CallLogAI(ctx); JSONObject callsHistory=callLogAI.fetchCallLogs(null); Log.d("RESULT=", callsHistory.toString()); result=new PluginResult(Status.OK,callsHistory); }else{ result=new PluginResult(Status.INVALID_ACTION); Log.d("CallsPlugin","Invalidate action:" + action); } return result; } } Javaקᇅplugin Adobe 董龙飞 weibo.com/donglongfei weibo.com/javascriptdev
34. ᇿҨplugin <?xml version="1.0" encoding="UTF-8"?> <plugins> <plugin name="App" value="com.phonegap.App"/> <plugin name="Geolocation" value="com.phonegap.GeoBroker"/> <plugin name="Device" value="com.phonegap.Device"/> …… <plugin name="Temperature" value="com.phonegap.TempListener"/> <plugin name="FileTransfer" value="com.phonegap.FileTransfer"/> <plugin name="Capture" value="com.phonegap.Capture"/> <plugin name="CallsHistoryPlugin" value="com.mark.phonegap.plugin.callsPGPlugin" /> </plugins> Adobe 董龙飞 weibo.com/donglongfei weibo.com/javascriptdev
35. In JavaScript Adobe 董龙飞 weibo.com/donglongfei weibo.com/javascriptdev
36. +BWBTDSJQUࢤ१ var CallsListing=function(){}; CallsListing.prototype.list=function(successCallback,failureCallback){ return PhoneGap.exec(successCallback, failureCallback, 'CallsHistoryPlugin', 'list',['test'] ); }; PhoneGap.addConstructor(function(){ PhoneGap.addPlugin("callsListing",new CallsListing); });
37. window.plugins.callsListing.list( function(r){printResult(r)}, function(e){console.log(e)} ); ൐ႨᆀטႨplugin +BWBTDSJQUࢤ१
38. ཬࢲ
    
39. window.plugins.callsListing.list( function(r){printResult(r)}, function(e){console.log(e)} ); CallsListing.prototype.list=function(success Callback,failureCallback){ return PhoneGap.exec(successCallback, failureCallback, 'CallsHistoryPlugin', 'list',['test’]); }; public class callsPGPlugin extends Plugin { // List Actions public static nal String ACTION="list"; @Override public PluginResult execute(String action, JSONArray data, String callbackId) { <plugin name="CallsHistoryPlugin" value="com.mark.phonegap.plugin.callsPGPlu gin" />
40. 
    
    ೂޅൌགྷ+4აЧֹ"1*֥ࢌ޺
    
41. "OESPJE
    
42. $BMMCBDL4FSWFSğ9NM)UUQ3FRVFTUTFWFS
    
    8FC$ISPN$MJFOUğ
    onJsPrompt
    BEE+BWB4DSJQU*OUFSGBDF
    
43. $BMMCBDL4FSWFSğ9NM)UUQ3FRVFTUTFWFS
    
    8FC$ISPN$MJFOUğ
    ڭۂonJsPrompt
    'SPN
    +4
    UP
    /BUJWF
    'SPN
    /BUJWF
    UP
    +4
    
44. CallsListing.prototype.list=function(successCallback,fai lureCallback){ return PhoneGap.exec(successCallback, failureCallback, 'CallsHistoryPlugin', 'list',['test’]); }; PhoneGap.exec = function(success, fail, service, action, args) { … var r = prompt(JSON.stringify(args), "gap:"+JSON.stringify([service, action, callbackId, true])); … +BWBTDSJQU Adobe 董龙飞 weibo.com/donglongfei weibo.com/javascriptdev
45. Droidgap.java public boolean onJsPrompt(WebView view, String url, String message, String defaultValue, JsPromptResult result) { …… String r = pluginManager.exec(service, action, callbackId, message, async); …… } Pluginmanager.java public String exec( nal String service, nal String action, nal String callbackId, nal String jsonArgs, nal boolean async) { …… cr = plugin.execute(action, args, callbackId); ctx.sendJavascript(cr.toErrorCallbackString(callbackId)); …… } +BWB
46. Pluginmanager.java ctx.sendJavascript(cr.toErrorCallbackString(callbackId)); $BMMCBDL4FSWFSKBWB
    ğ
    9)3
    TFSWFS
    PhoneGap.Channel.join(function() { // Start listening for XHR callbacks setTimeout(function() { if (PhoneGap.UsePolling) { PhoneGap.JSCallbackPolling(); } l
    +BWBTDSJQU +BWB
47. *04
    
48. +4֞/BUJWF֥๙࿟
    document.location = “gap://Class.method/args” /BUJWF֞+4֥๙࿟
    UIWebView.stringByEvaluatingJavaScriptFromString webView =[[UIWebView alloc] initWithFrame:webViewBounds]; ൌ২߄6*8FC7JFX
    Adobe 董龙飞 weibo.com/donglongfei weibo.com/javascriptdev
49. 
    
    EFCVH
    
50. XFJOSF
    
51. 
    
    
    
    8FJOSF஥ᇂູ4FSWFSđ षؿᆀ൐Ⴈ$ISPNF 4BGBSJषؿ۽ऎটჹӱט ൫၍׮ႋႨ
    Adobe 董龙飞 weibo.com/donglongfei weibo.com/javascriptdev
52. <script src="http://192.168.1.101:8080/target/target-script-min.js#anonymous"> </script> Adobe 董龙飞 weibo.com/donglongfei weibo.com/javascriptdev
53. 1IPOF(BQ
    %FCVH
    4FSWFS
    Adobe 董龙飞 weibo.com/donglongfei weibo.com/javascriptdev
54. 
    
    ਫ਼ཌ๭
    
55. 9
    
    
    
    1FSGPSNBODF
    
    8$
    DPNQBUJCMF
    đၞႨྟ
    $BMFOEBS
    
    .FTTBHF
    đ#MVFUPPUIđ
    "VEJP7JEFP
    
56. Mark Dong Developer Evangelist dong@adobe.com weibo.com/donglongfei weibo.com/javascriptdev