GETTING STARTED WITH PHONEGAP

 Creating Mobile applications is something a lot of web developers are keen to get into.

The problem with creating these applications when coming from a web background is that new languages need to be learned.

With PhoneGap that need is gone, PhoneGap allows you to build web applications with languages you are already familiar with like HTML, CSS and JavaScript.

WHAT IS PHONEGAP ?

PhoneGap is an open source framework that aids in the development of cross-platform applications with languages familiar to web developers.

For anyone from a web background this is a great solution and it also has the benefit of being a cross-platform approach to mobile development.

Since we all want to work with different platforms, there’s no installation guide that’s better than PhoneGap’s own guide, follow the instructions there to install PhoneGap in your preferred environment.

THE DEVICE API’S

The good thing about working with PhoneGap is that we have access to a lot of device API’s like:

• Accelerometer — The accelerometer allows us to tap in to the motion sensor in the mobile device.
• Camera — We can capture a photo using the device’s camera.
• Compass — With compass we can get the direction the device is pointing in.
• Capture — The capture provides us access to the audio, image, and video capture capabilities of the device.
• Connection — Check if the user has an internet connection and get its details.
• Contacts — With this API we can access the contacts database on the device.
• Device — This API helps us get information about the device itself.
• File — Using the JavaScript File we can read, write and navigate through the user’s files on the device.
• Events — This API allows us too hook up to a user event and add a callback to it. An example could be the device ready event, lowering down the sound or even hooking up a function when the user’s battery is critically low.
• Geolocation — This API is widely used in the mobile world and it makes your application aware of where it’s located.
• Globalization — The globalization object obtains information and executes specific functions taking into consideration the user’s locale and timezone.
• Media — With the Media API you can record and play audio files.
• Notification — This API gives you a way to notify the user in a visual, audible or tactile way.
• InAppBrowser — The InAppBrowser is used to launch URL’s in a web browser.
• Splashscreen — Enables developers to show or hide the application’s splash screen.
• Storage — With this API you can hook into the device storage options.

As you can see using PhoneGap and the Javascript API’s there really isn’t an app you can’t build. The best thing about working with PhoneGap is that all of this is achieved in a simple manner.

If for instance, you want your app to measure the device’s motion you would use the accelerometer API. A simple example measuring three axis would look something like this:

document.addEventListener("deviceready", loaded, false);
function loaded(){
navigator.accelerometer.getCurrentAcceleration(success, error);
}
function success(acceleration){
alert(
'Acceleration X: ' + acceleration.x + '\n' +
'Acceleration Y: ' + acceleration.y + '\n' +
'Acceleration Z: ' + acceleration.z + '\n'
);
}
function error(){
alert("There was an error");
}

As you can see the first thing we did was check if the device was ready, if that comes back true we start the accelerometer and get its current position and in there we passed a success callback and an error callback; in the former I created an alert with the acceleration in all 3 axis and in the latter just a simple error alert to let the user know that something went wrong.

CONCLUSION

In this first part we took a look at what PhoneGap is, what its capabilities are, and we even saw how to use one of its device API’s. We’ll continue with this in the second part of this tutorial where we’ll be looking at more device APIs like the camera and geolocation.

BY SARA VIEIRA