Setting up PhoneGap/Cordova for Android on 32-bit Windows 7

I tried to follow the getting-started instructions in the PhoneGap documentation, but found a fair amount of trial and error was involved. Hopefully this guide will mean that in future getting set up will take less than three hours…

Pre-requisites:

  • node.js
  • JDK
    • Dependency for ant – at present time needs to be < v8
    • Path to JDK folder needs to be in JAVA_HOME environment variable
  • ant
    • can be installed via npm
    • You need to make ant available in your PATH environment variable – for me ant was in C:\Users\[username]\AppData\Roaming\npm\node_modules\ant\ant\bin

Step 2 Install SDK + Cordova
Setting up an emulator
PhoneGap instructions:

Download and install Eclipse Classic
Download and install Android SDK
Download and install ADT Plugin

  • Eclipse and the ADT bundle arrive as zip files. If using 7-Zip, you’ll need to run it as an administrator if you want to extract files to the Program Files Folder.

Download the latest copy of PhoneGap and extract its contents.

  • I found cordova, which like phonegap is available through npm, worked better, and is what is used in most of the documentation examples

Step 3: set up environment variables

  • Make sure you’ve got the ant and JDK settings in your environment variables (see pre-requisites)
  • You’ll need to add to the PATH environment variable the paths to the platform-tools and tools directories in your download of the Android SDK

Step 4: Set up new project.
Creating the project
The PhoneGap documentation tells you to use
$ cordova create hello com.example.hello HelloWorld
Notice the use of cordova instead of phonegap (see comments on Step 2)

Setting it up in Eclipse
If you follow the PhoneGap instructions and go straight to setting up the project in Eclipse, you won’t get anywhere. What the document completely fails to mention is that you won’t see any projects when you select Android Project from existing code and navigate to the hello folder, because you haven’t created one yet.

If you look in the PhoneGap documentation, after running create there is a section on adding platforms:
$ cordova platform add android
(Note: if you didn’t make ant available when installing the pre-requisistes, you will see
Error: ERROR : executing command 'ant', make sure you have ant installed and added to your path.
If you didn’t make the JDK available, when trying to run $ ant you’ll see
Unable to locate tools.jar. Expected to find it in C:\[path to JRE]\tools.jar)

The next instruction to Run As > Android Application won’t work yet either because they haven’t yet told you how to set up an AVD.

Setting up an AVD
Their ‘instructions’ on how to set one up are a bit sketchy. Better instructions are available in Chris Bitting’s blog post.

  • Note: I needed to run the Android SDK Manager as an admin to install the necessary items.
  • The Virtual Device Manager will not accept a device name with spaces in (it won’t actually tell you what’s wrong, but the OK button will be greyed out).
  • The laptop I’m developing on is woefully under-powered and the BIOS doesn’t offer the option to enable the Intel Virtualization Technology to run an Intel image, so I needed to choose a small device size and launch from snapshot.

5A. Deploy to Emulator
I didn’t manage to get my project deployed to an emulator via Eclipse, but I had more success via the command line using
$ cordova emulate android
after starting the emulator via Virtual Device Manager.
(Be warned – it takes several minutes to deploy and launch on the emulator…)

References
PhoneGap
Getting Started with Android
The Command-Line Interface

Android
Get the Android SDK
Installing the Eclipse Plugin

The Definitive Guide to Angular on Mobile
Installing & starting with PhoneGap on Windows for cross platform mobile development
AVD Manager – Cannot Create Android Virtual Device
Unable to locate tools.jar
Why is the Android emulator so slow?

Advertisements

About Jennifer Phillips Campbell

Software Developer and Medieval Historian
This entry was posted in Uncategorized. Bookmark the permalink.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s