Category Archives: PhoneGap

PhoneGap and Dreamweaver Tutorials

Learn how to quickly build Apps using Dreamweaver CS5.5 that run on Android, iOS & More!

Session 1: Getting Setup with Dreamweaver CS5.5 and an Intro to PhoneGap – Nearly 3 Hours!

PhoneGap is an amazing framework that will allow you to code in Dreamweaver CS5.5 (or other text editors) and deploy to multiple devices. Throughout the course, our instructor Lawrence Turton, will be testing on a PC using his Android device. And like Lawrence, if you have Dreamweaver CS5.5 then you are pretty much setup already. But we’ve also included a separate setup video for Mac users to test on their iOs devices. The setup is slightly different, but after that the code to deploy is the same. Which is the beauty of using PhoneGap. Throughout the entire multi-session series, we’ll be using the same code regardless of the device type, to interact with things like the Accelerometer, Battery status, Location, Camera, Contact Book, and so on.

  • PhoneGap Tutorial Video 1 – Introduction to the Series and Initial Setup (for Mac Users, also check out the video just for you all)
  • PhoneGap Tutorial Video 2 – This nearly two hour video begins with a “hello world” app, and explores the accelerometer, detecting WIFI and other device specifics like name or OS version, how to initiate alert or confirmation popup menus, creating a stop watch function, and of course tons more about programming in general.

Session 2: PhoneGap’s Camera API, Events API, or GeoLocation API – Over 2 Hours

Choose your adventure! You can decide what you want to learn now.

  • PhoneGap Camera API Tutorial – Learn how to take a picture or use a picture from the camera library. Explore options like save-quality, allow simple editing before selection, encode as PNG or JPG, desired width or height, and more.
  • PhoneGap Events API Tutorial – We’ll look at event types, such as what to do when the device is ready, an app is paused, app is resumed, the network has gone on or offline, the user presses the back, menu, or search buttons (doesn’t apply to iOS), a call has ended, the battery hits a critical or low level, or the battery status has changed.
  • PhoneGap GeoLocation API Tutorial -Explore how to get the current location of the phone, and look at properties like latitude, longitude, altitude, accuracy, heading, speed, and more. Also learn how to watch for changes in the current location.

Session 3: Contacts API and Compass API – Over 2 Hours!

Again you can decide what you want to learn. There’s no viewing order to these…

  • PhoneGap Contacts API Tutorial – Learn how to create, clone, update, remove and find contacts in the devices contact database. Access properties of a contact, like name (first, last, nickname), phone number, email, address, IMS, organization, birthday, note, photo, category, and URL’s associated with a contact.
  • PhoneGap Compass API Tutorial – Learn how to use the compass to detects the direction or heading that the device is pointed. Options to look at are the magnetic heading, true heading (relative to geographic North), heading accuracy, and time stamp when a reading occurred.

Session 4:  Using Dreamweaver CS6 with PhoneGap and Storage API

Choose your own adventure again here in Session 4….

  • Using Dreamweaver CS6 with Phone Gap – 1 Hour: 2 Minutes – Learn how Dreamweaver CS6 integrates with the PhoneGap Build Service to compile applications in the “Cloud”.You’ll also learn how to get started with QR Codes (Quick Reference Codes) to find and install your app from the PhoneGap servers. Also discussed are many details about publishing your app for iOS, Android, Blackberry and other devices.
  • PhoneGap Storage API Tutorial – 46 Minutes – The Storage API gives you the ability to create a database on the client side rather than on a remote server. So you’ll learn how to populate a database, retrieve data, delete data, and everything else related to managing a database.

Session 5: Capture API and Media API

  • PhoneGap Capture API Tutorial – 1 Hour: 19 Minutes – This API allows you to capture an image, video, or audio. You’ll learn all the parameters involved with capturing these types of media (max duration, various modes, etc). You’ll learn how to store and retrieve the media. With these tools you could program your own voice or video recorder.
  • Also discussed are the quirks between capturing media on different devices.
  • PhoneGap Media API Tutorial- 53 Minutes – The Media API allows smooth playback of audio without slowing down your application. This is a better option than using HTML5 based audio or Flash Player audio, which could slow down your app, or in the case of Flash, isn’t available on the iOS devices. You’ll learn how to control your media with Play, Seek, Pause, Resume and Stop options.

Session 6: File API

  • PhoneGap File API Tutorial- 3 Hours: 38 Minutes – We’ve saved one of the longest tutorials for last. While most of the lessons you can watch in any order you like, our instructor requests you watch most of the previous ones first because he combines many different API’s in this final lesson. With the File API you can access the device’s file directory. So you can search, read, write, upload and transfer files with this API, making it one of the most interesting ones. And worthy of an almost 4 hour lesson!

Final Application Project

As a final example, Lawrence combines many of the PhoneGap API’s into one amazing iPhone application (tested on an iPhone 4 & 4S) . As you can see above, the app has five buttons on the bottom which navigate to:

  • Contact Window: with buttons to trigger a text, phone call or email
  • Voice Recorder: Playback a sound file you’ve recorded through the app
  • YouTube Video Playlist / Player: Create a playlist of your favorite YouTube Videos
  • Image Capture App: Take a picture from the device’s camera and insert it within another image. This could be the foundation of an amazing application. Perhaps a kid’s book featuring the child reading the book.
  • Compass: Get the magnetic heading of your device

Store Link at

Affiliate Builder Link for this product:
Affiliates should replace the ##### with their Affiliate ID. Register for your ID here
Affiliates will earn a fee for ANY product purchased on CartoonSmart by a referral not just the product they initially land on.

More images to use for promoting this product… Read the rest of this entry »

Leave a comment

Posted by on February 8, 2012 in Dreamweaver, PhoneGap


Tags: , , , , , , , , , , , , , ,