PhoneGap
Developing for the iPhone
Nitobi
Jesse Macfadyen
Shazron Abdullah
Andrew Lunny
What's good about the iPhone?
- Hugely Popular Platform
- No compatibility problems (other than performance)*
- OS upgrades: next to ubiquitous
- Awesome Browser / WebView (very close to desktop Safari)
- Massive developer community, third-party support (mostly PhoneGap compatible)
- Some excellent tools (XCode, Instruments)
- iPod Touch -- cheapest first-rate mobile platform
* iPad changes this
What's bad about the iPhone?
- Have to get a certificate
- Provisioning and code-signing
- The App Review Process
- Objective-C
The Apple Path to iPhone Development
- Get an iPhone + a Mac
- Sign up with Apple
- Install XCode
- Learn Objective-C ( is this a big deal? yeah, I think so! )
- Provision your phone
- Build Your App
- Submit to Apple, and wait ...
The PhoneGap Path to iPhone Development
| Get an iPhone + a Mac | Yes |
| Sign up with Apple | Yep |
| Install XCode | Same |
| Learn Objective-C | NO! |
| Provision your phone | uh-huh |
| Build Your App | Yeah |
| Submit to Apple, and wait ... | of course ... |
So how does this work?
It all starts with UIWebView
stringByEvaluatingJavaScriptFromString
DeviceInfo = {"version":"3.0","uuid":"B486A392-2B43-551F-88E3-773FC454FD82","name":"iPhone Simulator","platform":"iPhone Simulator","gap":"0.8.0"};
stringByEvaluatingJavaScriptFromString can call js methods too!
navigator.geolocation.setLocation
So how does Javascript call Objective-C?
On the iPhone, js sets the location.
document.location = "gap://Location.start/null";
- a) the gap protocol
- b) the command handler
- c) the operation
- d) any arguments
All PhoneGap js calls are accessed through the navigator object
- navigator.geolocation : defines GPS functionality
- navigator.accelerometer : defines device position functionality
- navigator.notification : defines Alert + Prompt popup functionality + activityStart + vibrate
Where is PhoneGap.js?
This used to be an issue, thankfully the EDGE version addresses it.
There will be only one phonegap.js file and it will be built when you build your app.
How do I debug it?
How to setup for Javascript debugging
Desktop Safari is very close to Mobile Safari ( close but not exactly )
Things to keep in mind:
The iPhone simulator runs about 1000 times smoother and faster than the device, ALWAYS test on the device
Don't depend on timeouts firing on time! Use callbacks.
onDeviceReady
The new way of being sure that phonegap is ready to receive your commands.
DOM event based, so you add a listener to the document.
Let's see the code!
Bonus
- Calling Objective-C and CocoaTouch code
- Native Views
- Using external libraries
- PhoneGap plug-ins