Archive for July 27th, 2010
Phonegap Android tips
Tuesday, July 27th, 2010
I recently used Phonegap to produce my iPhone app, Boxing Coach, which I’ve been very happy with. I love phonegap and being able to avoid Obj-C for 90% of production is SO nice. Yes, I hear you out there…”Obj-C is actually not that bad…given a week of diligent study you could…blahblahblah” But I’d rather do my simple app logic in javascript and HTML5, especially if that means porting to Android with only a day or two of extra production. That’s the theory anyway.
The iPhone version of Boxing Coach, using the nice new plugins architecture of phonegap, went very well. I used iScroll to handle some scrolling mayhem, which was great. Although there’s still some issues with the onscreen keyboard messing up layout from time to time. I used the uicontrols to hook into the native iPhone tab bar functionality along the bottom, which with a couple tweaks worked well too. Local database storage worked great, audio played nicely, all in all a happy experience.
Anyway, on to Android. I’m going to condense notes here and maybe expand on them later via comments if folks are interested.
First I had some trouble setting up the Android project using the droidgap command via terminal. I’m on OS X, fyi. I checked my java, ant, android sdk all installed correctly. Had the system path stuff set up as well. Ended up being simple syntax stuff. Here’s what worked:
ruby ./droidgap “/users/max/documents/android” “MYAPPNAME” com.maxmediacorp.MYAPPNAME “/users/projects/phonegap/myapp/www” “/users/max/documents/MYAPPBUILD”
Ah, so now after following the other basic Android Getting Started instrux, I had a project in Eclipse to start tinkering with. Firs thing I had to do was replace the bottom uicontrols from iPhone build with basic html-based button images with onClick handlers. No problem, not sure why I just didn’t do that from the get go to make portability easier. Probably was just enticed by using “native” iPhone controls via phonegap 
.
The next thing I noticed when testing on the device was that it autorotated, when I wanted it to stay locked into portrait orientation. This was easily fixed by going into the manifest and adding an “android:orientation” param inside the activity node of the XML, ala
android:screenOrientation=”portrait” android:configChanges=”orientation|keyboardHidden”
Nice, now no more ugly autorotation to landscape breaking up my layout. Orientation-aware apps are overrated anyway, right? While on the topic, there was a bunch of extraneous stuff inside the manifest left over by droidgap that I removed, unneeded permissions, a camera activity? I nuked them and app still works so hopefully no harm done.
Next annoyance was anytime you used the trackball on my Nexus One, the whole app view would scroll up alarmingly off screen. Not good. Touch events were handled nicely, via the e.preventDefault I presume within the main js code. But trackball had its own rules apparently and wasn’t getting caught by phonegap. After a bit of searching through Android docs, finally stumbled on the following fix, which can be added to your main app class (the one that extends DroidGap)
@Override public boolean onTrackballEvent(MotionEvent event) {
return true;
}
No more trackball mayhem! I love simple solutions.
That’s it for now. Hope those bits are helpful to folks. I’ll post more as I come across them. My next problem is how to start/stop/restart a thread in Android to handle folks leaving my app, coming back while saving its state, etc. Who said multithreading is a good thing?
