What is PhoneGap?Its a tool for building mobile apps using web-tech.              HTML for layout ( Better yet HTML5 )    ...
The Situation?iPhone – Objective C.   Android – Java        Blackberry – Java             Windows Mobile - .NET or unmanag...
The Distribution?Apple App Store   Android Market      Blackberry App World           Nokia Ovi Store                 Sams...
So What Happens?Fragmentation.    Cost.        Nightmares.
Why HTML ? Scalability.    Platform Independent.            Custom User Interface                 Custom fonts            ...
Going Native !  Create an HTML5 App that can work offline.     Join hands with PhoneGap!           Use native features usi...
How To Build A Mobile Appvar idea = "An app than solves all your problems";[ios,android,blackberry].forEach(function(platf...
Same with PhoneGapaddJavascript(" phoneGap.js ",head);var idea = " An app than solves all your problems ";var HTML5app = w...
Phone Gap isCross-PlatformiOS, Android, BlackBerry 4.6+, webOS, Symbian...Open Source - MIT outbound, MIT + Apache inbound...
Core
PhoneGap apps are just web pages?- Yes, web pages that access device functionality.- Apps can still provide a rich experie...
What Native APIs are available ?Geolocation   Accelerometer      Notifications          Media playback              Camera...
Geolocation !function getLocation() {debug.log("Getting your Current Location");navigator.notification.activityStart();   ...
Accelerometer!function needforspeed() {debug.log("Watching the Accelerometer");     var win = function(a){     debug.log(r...
Contacts!function thirdPerson() {debug.log("Getting the Second Contact");     navigator.contactManager.get(function(c) {  ...
Vibration!navigator.notification.vibrate();//grrrrrrrr
ASK !
Now... go write some apps!*http://phonegap.comhttp://groups.google.com/group/phonegap                                     ...
Phonegap
Phonegap
Phonegap
Phonegap
Phonegap
Phonegap
Upcoming SlideShare
Loading in...5
×

Phonegap

4,037

Published on

Published in: Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
4,037
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
69
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Phonegap

  1. 1. What is PhoneGap?Its a tool for building mobile apps using web-tech. HTML for layout ( Better yet HTML5 ) JavaScript for accessing device functionality CSS for rich look and feel. ( Better yet CSS3 )
  2. 2. The Situation?iPhone – Objective C. Android – Java Blackberry – Java Windows Mobile - .NET or unmanaged C++ Nokia – C++, Java, Python, Flash, WRT Palm – Web Tech
  3. 3. The Distribution?Apple App Store Android Market Blackberry App World Nokia Ovi Store Samsung App Store LG Application Store Windows Marketplace and many more ….
  4. 4. So What Happens?Fragmentation. Cost. Nightmares.
  5. 5. Why HTML ? Scalability. Platform Independent. Custom User Interface Custom fonts Free: as in freedom.
  6. 6. Going Native ! Create an HTML5 App that can work offline. Join hands with PhoneGap! Use native features using JS! Compile Applications for multiple platforms Publish and Share !
  7. 7. How To Build A Mobile Appvar idea = "An app than solves all your problems";[ios,android,blackberry].forEach(function(platform){createMobileApp(idea,platform);})// using native APIs and toolsfunction createMobileApp(idea,platform){ var app,profit; platform.registerForDeveloperProgram(); platform.downloadAndInstallSDK(); platform.learnNativeAPIs(); app = platform.writeNativeApp(idea); app.buildForPlatform(); profit = app.submitToAppStore(); return profit; }
  8. 8. Same with PhoneGapaddJavascript(" phoneGap.js ",head);var idea = " An app than solves all your problems ";var HTML5app = writeAppWithHTML5(idea);createMobileApp(HTML5app, [ios, android, blackberry]);function createMobileApp (HTML5app, platforms){ var app, profit = 0; platforms.forEach(function (platform) { platform.registerForDeveloperProgram(); platform.downloadAndInstallSDK(); app = platform.buildNativeAppWithPhoneGap(HTML5app); app.buildForPlatform(); profit += app.submitToAppStore(); }); return profit; }
  9. 9. Phone Gap isCross-PlatformiOS, Android, BlackBerry 4.6+, webOS, Symbian...Open Source - MIT outbound, MIT + Apache inbound Web Technologies - defer to native support Extensible – any[many] native code available any JS libraries available through <script>
  10. 10. Core
  11. 11. PhoneGap apps are just web pages?- Yes, web pages that access device functionality.- Apps can still provide a rich experience, especially with CSS transitions and tweening animations.- There are even games built with PhoneGap! Bubble Drop >
  12. 12. What Native APIs are available ?Geolocation Accelerometer Notifications Media playback Camera Device info Contacts Online/Offline SMS / Telephone Magnetometer!
  13. 13. Geolocation !function getLocation() {debug.log("Getting your Current Location");navigator.notification.activityStart(); var win = function(p) { debug.log(p.latitude + " - " + p.logitude); navigator.notification.activityStop(); }; var fail = function() { debug.log("You Have no Location. Bump!"); }; navigator.geolocation.getCurrentPosition(win,fail); }
  14. 14. Accelerometer!function needforspeed() {debug.log("Watching the Accelerometer"); var win = function(a){ debug.log(roundNumber(a.x)+" - "+roundNumber(a.y)+ " - "+roundNumber(a.z)); }; var fail = function(){ //We never fail right ? }; navigator.accelerometer.watchAcceleration(win,fail,{frequency:100}); }
  15. 15. Contacts!function thirdPerson() {debug.log("Getting the Second Contact"); navigator.contactManager.get(function(c) { debug.log("Contact 2: " + c.contacts[1].name); });}
  16. 16. Vibration!navigator.notification.vibrate();//grrrrrrrr
  17. 17. ASK !
  18. 18. Now... go write some apps!*http://phonegap.comhttp://groups.google.com/group/phonegap Reach The Presenter afzaal@afzaalace.com Twitter @afzaalace
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×