Browse Library
Sign In Start Free Trial
Close icon Search icon
Account
Browse Library Advanced Search Sign In Start Free Trial

Add to playlist

Create a Playlist

Modal Close icon
You need to login to use this feature.
  • Book Overview & Buying PhoneGap Beginners Guide (third edition)
  • Table Of Contents Toc
  • Feedback & Rating feedback
PhoneGap Beginners Guide (third edition)

PhoneGap Beginners Guide (third edition)

By : Ramanujam, Giorgio Natili
3.7 (6)
Buy this Book
close
close
PhoneGap Beginners Guide (third edition)

PhoneGap Beginners Guide (third edition)

3.7 (6)
By: Ramanujam, Giorgio Natili
Buy this Book

Overview of this book

This book is for web developers who want to be productive in the mobile market quickly. In fact, by using PhoneGap, it's possible to deploy native applications based on web standards. This book assumes a very small knowledge of HTML/CSS/JavaScript and mobile platforms, such as Android, BlackBerry, iOS, and Windows Phone, and takes the reader step-by-step into a deep overview of PhoneGap and its APIs.
Table of Contents (16 chapters)
close
close
close
Preface
Icon
Preface
Icon
What this book covers
Icon
What you need for this book
Icon
Who this book is for
Icon
Sections
Icon
Time for action – heading
Icon
Conventions
Icon
Reader feedback
Icon
Customer support
Lock Free Chapter
1
1. Introduction to PhoneGap
Icon
1. Introduction to PhoneGap
Icon
About PhoneGap
Icon
PhoneGap and Apache Cordova
Icon
Choosing an operating system for development
Icon
Mobile web versus mobile app
Icon
Installing dependencies
Icon
Installing PhoneGap
Icon
Setting up your development environment
Icon
Time for action – setting up Android using PhoneGap 3.x
Icon
Getting started with Android and JBoss
Icon
Time for action – using JBoss Developer Studio
Icon
Getting started with iOS and Xcode
Icon
Getting started with Windows Phone and Visual Studio
Icon
Summary
2
2. Building Your First PhoneGap Project
Icon
2. Building Your First PhoneGap Project
Icon
The structure of a PhoneGap application
Icon
Using the PhoneGap CLI
Icon
Cordova events
Icon
Time for action – the Hello World example
Icon
WebKit debugging – Chrome, Safari, and Opera
Icon
Gecko debugging – Firefox
Icon
Internet Explorer
Icon
Debugging workflow
Icon
Building and deployment
Icon
Summary
3
3. Mobile Frameworks
chevron up
Icon
3. Mobile Frameworks
Icon
Building native UI for the mobile
Icon
Achieving a native look and feel on iOS
Icon
Choosing mobile frameworks
Icon
Time for action – developing with jQuery Mobile
Icon
Selecting a framework
Icon
Summary
4
4. Working with Plugins
Icon
4. Working with Plugins
Icon
An introduction to plugins
Icon
Exploring the Device API
Icon
Time for action – accessing the Device API
Icon
Custom plugins
Icon
Summary
5
5. Using Device Storage and the Files API
Icon
5. Using Device Storage and the Files API
Icon
Application data storage
Icon
Time for action – reading and writing data on the LocalStorage
Icon
Time for action – populating a local database
Icon
Database limitations
Icon
Understanding the Files API
Icon
Time for action – listing folders
Icon
Time for action – reading and rendering an image
Icon
Time for action – downloading and saving a file
Icon
Summary
6
6. Using the Contacts and Camera APIs
Icon
6. Using the Contacts and Camera APIs
Icon
The Contacts API
Icon
Time for action – searching device contacts
Icon
Time for action – adding a new contact
Icon
Camera API or Capture API?
Icon
Accessing the camera using the Camera API
Icon
Time for action – accessing the device camera
Icon
Time for action – controlling the position of the camera roll
Icon
The Media Capture API
Icon
Time for action – manipulating images with a canvas
Icon
Summary
7
7. Accessing the Device Sensors and Locations API
Icon
7. Accessing the Device Sensors and Locations API
Icon
Introducing device sensors
Icon
Accelerometer
Icon
Time for action – handling device orientation with JavaScript
Icon
Compass
Icon
Time for action – using the Compass API
Icon
An introduction to geolocation
Icon
The PhoneGap Geolocation API
Icon
Time for action – showing device position with Google Maps
Icon
Summary
8
8. Advanced PhoneGap
Icon
8. Advanced PhoneGap
Icon
Using the Globalization API
Icon
Localizing your app
Icon
Time for action – rendering localized messages
Icon
Adding multitouch gesture support
Icon
Time for action – implementing gesture support
Icon
Handling click delays
Icon
Summary
9
9. Getting Ready for Release
Icon
9. Getting Ready for Release
Icon
Exploring JavaScript compression
Icon
Time for action – compressing files using the Closure Compiler
Icon
Time for action – using UglifyJS
Icon
Time for action – optimizing JavaScript with RequireJS
Icon
Comparing compression tools
Icon
Using template engine compression
Icon
Time for action – compiling a template using Pistachio
Icon
Creating fluid, multiple app views
Icon
Using hardware-accelerated transitions
Icon
Porting web applications
Icon
Summary
10
10. A Sample PhoneGap Project
Icon
10. A Sample PhoneGap Project
Icon
What's in the app?
Icon
Creating the project
Icon
Scope for improvements
Icon
Summary
11
A. The JavaScript Quick Cheat Sheet
Icon
A. The JavaScript Quick Cheat Sheet
Icon
The getElementById() method
Icon
The getElementsByTagName() method
Icon
The getElementsByName() method
Icon
The alert method
Icon
The toString() method
Icon
The parseInt() method
Icon
The getDate() method
Icon
The onclick event
Icon
The ondblclick event
Icon
The window.location object
Icon
Selectors using jQuery
12
B. Publishing Your App
Icon
B. Publishing Your App
Icon
Publishing on Google Play
Icon
Publishing on Blackberry World
Icon
Publishing on the Apple App Store
Icon
Publishing on the Windows Phone Store
Icon
Summary
13
C. Related Plugin Resources
Icon
C. Related Plugin Resources
Icon
Summary
14
D. PhoneGap Tools
Icon
The PhoneGap Developer App
Icon
The PhoneGap Desktop App
Icon
Summary
15
Index
Icon
Index

Building native UI for the mobile

When using PhoneGap, you create hybrid apps based on standards. The app is rendered to the user through a WebView, which means it is a browser instance wrapped into the app itself.

For this reason, it's important to know how to use mobile-specific HTML tags, CSS properties, and JavaScript methods, properties, and events.

The viewport meta tag

The viewport meta tag was introduced by Apple with iOS 1.0 and is largely supported in all the major mobile browsers. When a web page doesn't fit the size of the browser, the default behavior of a mobile browser is to scale it. The viewport meta tag is what you need in order to have control over this behavior.

A viewport meta tag looks like the following code snippet:

<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1, minimum-scale=1, maximum-scale=1.5, user-scalable=1">

What you are actually saying to the browser is that the default width and height...

Visually different images
CONTINUE READING
83
Tech Concepts
36
Programming languages
73
Tech Tools
Icon Unlimited access to the largest independent learning library in tech of over 8,000 expert-authored tech books and videos.
Icon Innovative learning tools, including AI book assistants, code context explainers, and text-to-speech.
Icon 50+ new titles added per month and exclusive early access to books as they are being written.
PhoneGap Beginners Guide (third edition)
End of Section 3
Next Section
notes
bookmark Notes and Bookmarks search Search in title playlist Add to playlist font-size Font size

Change the font size

margin-width Margin width

Change margin width

day-mode Day/Sepia/Night Modes

Change background colour

Close icon Search
Country selected
Close icon Your notes and bookmarks

Confirmation

Modal Close icon
claim successful
Order Page Read Now

Buy this book with your credits?

Modal Close icon
Are you sure you want to buy this book with one of your credits?
Close
YES, BUY

Submit Your Feedback

Modal Close icon
Modal Close icon
Modal Close icon