Creating a PhoneGap powered Android application from the command line
You hate eclipse, I hate Eclipse and a lot of people do. That's why when you want to approach mobile development using one of the awesome Javascript frameworks out there, you want to use your favorite editor and go fast.
I've been experimenting lately with PhoneGap and I am going to write down the basics steps you might take to have your app deployed in your device in a matter of minutes. First of all I will assume that you have installed de Android SDK, PhoneGap and, at least, one target device in your AVT.
In this example, we will create a dummy app that tests the WriteFile feature. First, go to the tools directory in your Android SDK installation and execute:
android create project --target 1 --name FileTest --path ~/projects/android/FileTest --package com.phonegap.filetest --activity App
You should now have a FileTest folder under your $HOME/projects/android directory. You only need to write the following command to see the HelloWorld app running in your device:
ant clean install
Now comes the trickiest part but it is pretty straightforward. You will need to copy the necessary files, make a small modification in your main activity and, finally, modify your Manifest.
Copying the necessary files:
- Create a assets/www directory
- Copy phonegap.jar from your PhoneGap installation to your libs directory
- Copy the xml directory from your PhoneGap installation to your res directory
- Copy your application (index.html + extra files) to the assets/www directory
- Copy de sample AndroidManifest.xml to your project
Modify the main Activity:
Edit the src/com/phonegap/filetest/App.java file and do the following changes:
- Replace the setContentView() line with super.loadUrl("file:///android_asset/www/index.html")
- Add an import com.phonegap.*;
- Change class header so it extends from DroidGap instead of Activity.
Modify AndroidManifest.xml:
Open the sample Manifest you copy before and change:
- The android:name attribute in the main <activity> so it matches your App name. In this example it should be ".App" (NOTE THE DOT IF YOU DON'T WANT TO GET CRAZY).
- The package attribute in the manifest header so it matches yours. In this example "com.phonegap.testfile".
And that is all. Now you only will be worried about editing your JS, CSS and HTML files as a web developer with the editor or tool you like, and you will be able to compile and send your application to your Android device simply with a "ant clean install".
Happy hacking!