Last updated
on 20-02-2010
at 12:00 AM


We’ve recently been looking at writing apps for phones (it’s tough to resist a bandwagon), and we found PhoneGap. It’s a framework that lets you write apps for most of the big phone platforms (iPhone, Android, Blackberry etc) in nothing but HTML and JavaScript, and still get at things like the camera. I haven’t got far enough with it to really judge it yet because it’s made to be used in Eclipse, when I actually really wanted to code in NetBeans, and setting that up is a right hassle. After doing that, I figured the internet might want this answer too.

If you’re writing phonegap stuff it’s generally easiest to make separate projects for each platform, write the one platform and then pass out the HTML/JS to the others, and write each native bit separately. With this in mind the following instructions are for setting up a Android project, but I imagine it’s not too difficult to work out the iPhone steps. At least, I hope so, I’m going to have to do it at some point.

  1. Download and set up the Android SDK. Instructions are all on that page, you can ignore the Eclipse stuff, you need to do the platform stuff.
  2. Download phonegap (I’m using 0.8) and extract it
  3. Build phonegap. This didn’t work for me, so I followed the instructions here. Essentially there are a few typos, and you need to put two semicolons in the right places.
  4. Copy the [phonegap dir]/lib/android/phonegap.js (or min.js, or both) to [phonegap dir]/android/assets/www.
  5. Install nbandroid, a NetBeans plugin for android projects.
    • By this point you’ve got all the bits you need to get everything working, and it’s just a matter of getting a project made and building in NetBeans. Essentially you make a NetBeans android project, and then splice it together with the [phonegap dir]/android folder:
  6. Make a new android project somewhere, through NetBeans.
  7. Copy the res folder from phonegap/android over the res folder NetBeans just made, and build the NetBeans project. This should create a new
  8. Copy the phonegap/android/src folder over the src folder NetBeans made.
  9. Inside NetBeans go to the Projects window → Source Packages → com.phonegap.demo, select all the files, right click and go to Refactor → Move. Move them into the package that the rest of your project is in.
  10. Copy the libs, assets and AndroidManifest.xml from phonegap/android to the NetBeans project.
  11. Add the jar in the libs folder you just copied to the libraries of the NetBeans project.
  12. Run the Android SDK Manager program and make a new Virtual Device.
    • At this point the project should build, and running it should start an emulator up, and eventually try and run the demo program. Unfortunately, the demo program will only come up with ‘…index.html file not found’, or similar, because NetBeans doesn’t correctly tell the Android SDK to get the Assets from the Assets folder you copied and put the in the apk (Android app package). To fix:
  13. In your NetBeans project open nbproject/build-impl.xml and change the line saying ‘<arg value="${asset.dir}"/>’ to ‘<arg value="${assets.dir}"/>’ (i.e. asset → assets)
  14. Go into nbproject/ and change ‘assets.dir=’ to ‘assets.dir=assets’. En route, add ‘assets.available=true’