1. Phonegap/Cordova
@kgutteridge

2. Why?
 Write once run anywhere
 HTML5
 Javascript
 One code base
@kgutteridge

3. Supported Platforms
 iOS >=3.2
 Android >=1.5
 Blackberry >=4.6 but really >=5
 Symbian >=1
 webOS > 1.4.5
 Samsung Bada
 Qt
 WP7
@kgutteridge

4. Background
 People at Nitobi originally "we don’t want this project
to exist its to plug gaps"
 IBM + RIM + Microsoft + Symbian + Palm
 Now adopted into the Apache Software Foundation
@kgutteridge

5. Languages
 HTML
 CSS 3
 Javascript
@kgutteridge

6. Javascript
 http://wtfjs.com/
 https://www.destroyallsoftware.com/talks/wat
@kgutteridge

7. Why?
 JIL
 Bondi
 WAC
 W3C
@kgutteridge

8. Its a hack
 Webview
 Call js from native code
 Call native code from js
@kgutteridge

9. Why?
 Accelerometer
 Camera
 Capture
 Compass
 Connection
 Contacts
 Device
 Events
 File
 Geolocation
 Media
 Notification
 Storage
@kgutteridge

10. Write once debug everywhere
 Weinre
 debug.phonegap.com
 Blackberry playbook
 Opera dragonfly
@kgutteridge

11. Why?
 Is this still the right way to build your app?
@kgutteridge

12. Installation of SDKs (iOS)
 http://phonegap.com/download
 Install xCode http://developer.apple.com
 Select new Cordova project
 Run once, will get error
 Add ‘www’ file to project
 create folder references
@kgutteridge

13. Installation of SDKs (Android)
 http://www.eclipse.org/downloads/
 http://developer.android.com/sdk/installing.html
 Start a 2.2 Android project
@kgutteridge

14. Installation of SDKs (Android)
 Create www folder in assets
@kgutteridge

15. Installation of SDKs (Android)
 Copy cordova-1.50.jar to libs
 Copy xml directory into the res directory
 Add cordova lib to build path
 Link “phonegap iOS app” into www
 Add Cordova import to main activity
 Extend DroidGap rather than Activity
 Add in onCreate
 super.loadUrl(“file://android_asset/www/
index.html”);
@kgutteridge

16. Installation of SDKs (Android)
@kgutteridge

17. Installation of SDKs (Android)
 Edit AndroidManifest.xml
<supports-screens
android:largeScreens="true"
android:normalScreens="true"
android:smallScreens="true"
android:resizeable="true"
android:anyDensity="true"
/>
@kgutteridge

18. Installation of SDKs (Android)
 Add permissions
<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.READ_PHONE_STATE" />
<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.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" />
@kgutteridge

19. Installation of SDKs (Android)
@kgutteridge

20. Installation of SDKs
 Add attribute
 configChanges="orientation|keyboardHidden"
 Add second activity
 <activity
android:name="com.phonegap.DroidGap"
android:label="@string/app_name"
android:configChanges="orientation|keyboardHidden">
<intent-filter></intent-filter>
</activity>
@kgutteridge

21. SDKs are a pain
 build.phonegap.com
@kgutteridge

22. Config.xml
 Based of W3C widget spec
<?xml version="1.0" encoding="UTF-8" ?>
<widget xmlns = "http://www.w3.org/ns/widgets"
xmlns:gap = "http://phonegap.com/ns/1.0"
id = "uk.co.kgutteridge.bigm"
versionCode="10" <!-- optional: Android only -->
version = "1.0.0">
<name>Bigm</name>
<description>
An example app for phonegap build.
</description>
<author href="http://kgutteridge.co.uk"
email="kgutteridge@gmail.com">
Kieran Gutteridge
</author>
</widget>
@kgutteridge

23. Plugins
 All phonegap apis are plugins
 https://github.com/phonegap/phonegap-plugins
@kgutteridge

24. Uh Oh?
 Add in app purchase
@kgutteridge

25. Native vs Web
 Native is native
 Platform metaphors do matter
 Password input boxes
 Clients love to pay for web technologies
 Devs love searching for the unicorn of write once run
anywhere
 Maybe other options take a look at kirinJS
@kgutteridge

26. Q+A
kieran.gutteridge@intohand.com
@kgutteridge
@kgutteridge