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

Blog

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 R.java.
  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/project.properties and change ‘assets.dir=’ to ‘assets.dir=assets’. En route, add ‘assets.available=true’

Enjoy!

  1. Tomas at 09:54AM on 02/02/2012

    Thanks for keeping this online!

  2. Boris at 12:11PM on 25/04/2012

    Thanks for sharing. Will certainly give it a shot since NetBeans is my IDE of choice. Eclipse isn’t bad but its WTP can’t compete with the level of JS syntax checking NetBeans has to offer, and I’ve experienced much less crashes with NetBeans.

  3. Frank at 01:21AM on 07/05/2012

    This is great up to step 12.

    But step 13 says "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)"

    Looking at non-Android projects, I do have nbproject/build-impl.xml.

    But I don’t have an nbproject folder or a build-impl.xml file in my Android project.

    I’ve tried putting those lines into ant.properties and project.properties and local.properties (even though it says not to alter the last 2) but none of them make any difference. :(

    I’m running Netbeans 7.1.1, in case that makes a difference.

  4. cesarlarsson@gmail.com at 01:15PM on 23/05/2012

    Frank I have the same problem do you solve it?

  5. Kkk at 05:26PM on 14/02/2013

    Hi! I have the same problem… I don’t have nbproject folder…