Book Image

PhoneGap 2.x Mobile Application Development HOTSHOT

By : Kerri Shotts
Book Image

PhoneGap 2.x Mobile Application Development HOTSHOT

By: Kerri Shotts

Overview of this book

<p>Do you want to create mobile apps that run on multiple mobile platforms? With PhoneGap (Apache Cordova), you can put your existing development skills and HTML, CSS, and JavaScript knowledge to great use by creating mobile apps for cross-platform devices.</p> <p>"PhoneGap 2.x Mobile Application Development Hotshot" covers the concepts necessary to let you create great apps for mobile devices. The book includes ten apps varying in difficulty that cover the gamut – productivity apps, games, and more - that are designed to help you learn how to use PhoneGap to create a great experience.</p> <p>"PhoneGap 2.x Mobile Application Development Hotshot" covers the creation of ten apps, from their design to their completion, using the PhoneGap APIs. The book begins with the importance of localization and how HTML, CSS, and JavaScript interact to create the mobile app experience. The book then proceeds through mobile apps of various genres, including productivity apps, entertainment apps, and games. Each app covers specific items provided by PhoneGap that help make the mobile app experience better. This book covers the camera, geolocation, audio and video, and much more in order to help you create feature-rich mobile apps.</p>
Table of Contents (19 chapters)
PhoneGap 2.x Mobile Application Development HOTSHOT
Credits
About the Author
About the Reviewers
www.PacktPub.com
Preface
InstallingShareKit 2.0
Index

Designing the user interface and the look and feel


Conceptually, this is a pretty simple app from a user interface perspective. If you've seen a photo app on a phone, chances are you already know where we're headed. Even so, let's design a mockup, and then flesh that out a bit to come up with the assets we'll need for our look and feel.

Getting on with it

Let's examine the mockups for this project:

The left-most screen is simply a grid (1) of all the images that the user has added to the app. These images might be taken with the camera, or they might have been imported in various ways.

In the navigation bar, we'll have a fancy title – photo apps, for some reason, seem to call for something less utilitarian than some of our apps have been lately. We'll also be including an Edit button that can also change state to a Done button (2). This button indicates the current state; if a user taps Edit, the images will become selectable for batch operations such as a delete operation. In this mode, the...