PhoneGap 3 - Sample mobile application development for Android on Windows

Sample Android App

Assumptions

You have PhoneGap and other required environment setup ready as per previous post http://informaticsindian.blogspot.com/2014/10/phonegap-3-setup-development.html

Create project

• In Command Prompt (cmd) go to the folder in which you maintain your source code and type the command below. This will create a HelloWorld app (change the name if needed).
• cordova create HelloWorld com.example.hello "Hello World"
• phonegap create E:\HelloWorld
• cd HelloWorld
• Then add the Android platform with the following command in the Command Prompt (cmd).
• cordova platform add android
• Want to remove the Android platform? Highly doubt that, but you'll never know.
• cordova platform remove android

Install plugins

• If you need any plugins (be specific!) execute the following commands in Git Shell (installed with GitHub)
• Commands in CLI:
• cordova plugin add
• phonegap local plugin add
• Replace with the addresses here below (replace also the < and >)
• Basic device information:
• device: https://git-wip-us.apache.org/repos/asf/cordova-plugin-device.git
• Network and battery status:
• network-information: https://git-wip-us.apache.org/repos/asf/cordova-plugin-network-information.git
• battery-status: https://git-wip-us.apache.org/repos/asf/cordova-plugin-battery-status.git
• Accelerometer, compass, and geolocation:
• device-motion: https://git-wip-us.apache.org/repos/asf/cordova-plugin-device-motion.git
• device-orientation: https://git-wip-us.apache.org/repos/asf/cordova-plugin-device-orientation.git
• geolocation: https://git-wip-us.apache.org/repos/asf/cordova-plugin-geolocation.git
• Camera, media capture, and media playback:
• camera: https://git-wip-us.apache.org/repos/asf/cordova-plugin-camera.git
• media-capture: https://git-wip-us.apache.org/repos/asf/cordova-plugin-media-capture.git
• media: https://git-wip-us.apache.org/repos/asf/cordova-plugin-media.git
• Access files on device or network:
• file: https://git-wip-us.apache.org/repos/asf/cordova-plugin-file.git
• file-transfer: https://git-wip-us.apache.org/repos/asf/cordova-plugin-file-transfer.git
• Notifications via dialog box or vibration:
• dialogs: https://git-wip-us.apache.org/repos/asf/cordova-plugin-dialogs.git
• vibration: https://git-wip-us.apache.org/repos/asf/cordova-plugin-vibration.git
• Contacts:
• contacts: https://git-wip-us.apache.org/repos/asf/cordova-plugin-contacts.git
• Globalization:
• globalization: https://git-wip-us.apache.org/repos/asf/cordova-plugin-globalization.git
• Splash Screen:
• splashscreen: https://git-wip-us.apache.org/repos/asf/cordova-plugin-splashscreen.git
• In-app browser:
• inappbrowser: https://git-wip-us.apache.org/repos/asf/cordova-plugin-inappbrowser.git
• Debug console:
• console: https://git-wip-us.apache.org/repos/asf/cordova-plugin-console.git
• Dialogs:
• dialogs: https://git-wip-us.apache.org/repos/asf/cordova-plugin-dialogs.git
• If you want to see which plugins have been added, execute the following commands.
• cordova plugin list
• phonegap local plugin list

Removing plugins

• If you need to remove any plugins (be specific!) execute the following commands in Git Shell (installed with GitHub)
• Commands in CLI:
• cordova plugin remove org.apache.cordova.
• phonegap local plugin remove org.apache.cordova.
• Replace with a name above (replace also the < and >)

Build and compile the app

• Make the build with the following command (in Command Prompt).
• cordova build android (it does a prepare and compile command in one)
• phonegap local build android
• Then you can run it (or add it to Eclipse or Android Studio).
• cordova emulate android
• phonegap local run android

All the sources should be ready now and you can start using PhoneGap and building your app.

Debug Console

More information about debugging webapps on Android: http://developer.android.com/guide/webapps/debugging.html

Send information to the console

In your JavaScript use one of the following commands below.

• console.log(String)
• console.info(String)
• console.warn(String)
• console.error(String)

Debug console

• To see the logcat in a Command Prompt (cmd), execute the following command.
• adb logcat
• If you want to have (way) more options, make use of eclipse. Execute the following command.
• monitor

Debugging through Chrome

You can also debug your PhoneGap application through the Chrome Developer tools. This also includes live editing of code and see instant results of that. Much easier tweaking and improving your code!