Home
BBB Yahoo

PhoneGap Tips

By Robert John Stevens, CEO of WriteExpress Corporation

I am not a PhoneGap expert, but solved a few problems in getting started that I hope I can help you avoid.


Why PhoneGap?

  • You develop mobile apps by coding in HTML5, CSS3, XCode and the PhoneGap Javascript library
  • PhoneGap was bought by Adobe who is adding DreamWeaver support
  • PhoneGap writes the device-specific code for more than 100 mobile devices, saving you time, money and headache
  • PhoneGap supported platforms:
    • iOS
    • Android
    • BlackBerry
    • Symbian
    • webOS
    • Samsung Bada

How did they build PhoneGap in native code on each device?

This was important to learn when I couldn't figure out why my PhoneGap device-specific calls were not working locally in the iPhone Simulator.

  1. Instaniate a chromeless browser instance—all devices have a native browser
  2. Implement PhoneGap.exec JavaScript bridge code—a way to transfer data from JavaScript to the native side
  3. Implement native plugin code to push data from native side into JavaScript

PhoneGap Tips, and Common Mistakes to Avoid

  • Follow the Get Started Guide exactly

  • After creating a project, run it and it wlll give you an error and create the www folder. Drag the www folder right onto the project name on the left Xcode project window

  • If you are pasting samples into an existing index.html, make sure you update the phonegap.js filename to the name of whatever is in the www folder. The readme file explains this, "On first run, it will create a sample "www" folder for you inside your project. After that, you MUST drag and drop the "www" folder into your project in Xcode, to create a folder reference for it (BLUE folder)."

  • The PhoneGap.js file is auto generated for each specific device. You can delete it and xCode will re-create it.

  • The wierd "PhoneGap iPhone non-retina" text that appears when you run your app is actually a PNG splash screen named default.png in the splash folder of your project.

  • To deploy a PhoneGap app even for testing outside of the simulators (which don't seem to work well for PhoneGap), sign up with PhoneGap:Build

  • To fix the "ERROR whitelist rejection: url='http://audio.ibeat.org/content/p1rj1s/p1rj1s_-_rockGuitar.mp3'" error when running the Media play example, open the PhoneGap.plist file and add the string audio.ibeat.org to the ExternalHosts array.

  • If you get ERROR 4 and no device-specific calls work, you probaby don't have the PhoneGapLib configured. Click this link and search for the "May 8, 10:01 pm" entry for PhoneGapLib

  • If you get "ERROR whitelist rejection", URLs are still case sensitive as of phonegap-1.2.0.js. Make sure your URL case is the same in the PhoneGap.plist > ExternalHosts as the URL in your code. Also, consider the string in the ExternalHosts array. I had to use "item 0" as the key and "www.MyDomain.com" as the string. For an Amazon S3 https hosts I put "*" as the string and that worked in my local IOS simulator.

  • How to add the CoreMedia framework


How to deploy your PhoneGap Project on PhoneGap:Build

PhoneGap:Build is the fastest, easiest way to deploy your project for multiple devices. Even if you are going to just use it for testing purposes, it will save you tons of time.

  1. Buy a Macintosh
  2. Download Xcode
  3. For IOS, watch these videos to learn how to create your developer certificate, provisional profile and p12 file
  4. PhoneGap Generate—If you're having trouble using PhoneGap with XCode 4, we can generate the PhoneGap project for you - just let us know the name of your app, and we'll handle the tricky parts.

PhoneGap Alternatives


PhoneGap Build


PhoneGap Bugs


PhoneGap Chrome Extensions


PhoneGap Databases

PhoneGap Debuggers


PhoneGap Documenation

PhoneGap DOM Libs

You can use any of these:


PhoneGap FAQ

Q. What is the config.xml file used for?
A. 1) Metadata (name, description, icon, splash screen image), 2) What functionality you access on the device (e.g. you want the accelerometer functionality but not the compass).


PhoneGap Groups


PhoneGap Hosting


PhoneGap HTML5 Mobile App Frameworks


PhoneGap Tools

Minifiers/Compressors

IDE

PhoneGap Style/GUI Libs

PhoneGap Testing Frameworks

PhoneGap Videos


Copyright © 2011 Robert Stevens. All rights reserved.

This article was commenced on November 8, 2011. Last update: November 16, 2011.


Ad by Google

© 1996-2011 WriteExpress Corporation. All rights reserved.
WriteExpress®, Rhymer® and Unblocking Writers' Block® are registered trademarks of WriteExpress Corporation.