For a while now I’ve been talking about, and upgrading, a basic PhoneGap-based RSS reader application. (See the related entries at the bottom for the earlier iterations.) I was thinking about the application this morning. One of the things I noticed about the application is that when you clicked to read a full article, the application launched the native web browser. In IOS, there wasn’t a nice way to get back to the application. On Android, you could use back, but overall, the transition was a bit jarring. I thought this would be a perfect opportunity to try the ChildBrowser plugin. The ChildBrowser plugin creates a “pop up window” that acts like an embedded browser for your application. You can load it with a URL and add event handlers for things like location changing or the browser being closed. The end result is that the user isn’t really “leaving” the application when they view a web page.
The API is really simple to use. Since I’m not concerned with any of the events thrown by the ChildBrowser and just need it to go some place, I added a class to my “Read Entry on Site” link and then added this touch handler:
That being said - I was in luck. Turns out that PhoneGap Build supports a few plugins - and one of them is the ChildBrowser. I opened up my config.xml file and added one line:
And that’s it! I uploaded my code and within about two minutes I had my iOS and Android versions up and running. I’ve included a full zip of the code as an attachment to this blog. You can download individual binaries via the embed below. Note that the iOS version will not work for you - sorry - I’m not adding to this to the AppStore.
Edit on Jan 30, 2015 - I removed the PhoneGap Build iframe embed as it was dead.