Mobile App Development

350 Pages·2015·28.06 MB·English

Mobile App Development with HTML5
i
LearnToProgram, Inc.
ii
Mobile App Development with HTML5
Mobile App Development with HTML5
Mark Lassoff
with Tom Stachowitz
LearnToProgram, Inc.
Vernon, Connecticut
iii
LearnToProgram, Inc.
LearnToProgram.tv, Incorporated
27 Hartford Turnpike Suite 206
Vernon, CT 06066
[e-mail]
[phone]
©2015 by LearnToProgram.tv, Incorporated
ISBN-13: 978-0692405055
ISBN-10: 0692405054
All rights reserved. No part of this document may be reproduced or transmitted in any form or by any
means, electronic, mechanical, photocopying, recording, or otherwise, without prior written permission
of LearnToProgram.tv, Incorporated.
Limit of Liability/Disclaimer of Warranty: While the publisher and author have used their best efforts
in preparing this book, they make no representations or warranties with respect to the accuracy
or completeness of the contents of this book and specifically disclaim any implied warranties of
merchantability or fitness for a particular purpose. No warranty may be created or extended by
sales representatives or written sales materials. The advice and strategies contained herein may
not be suitable for your situation. You should consult with a professional where appropriate. By
following the instructions contained herein, the reader willingly assumes all risks in connection with
such instructions. Neither the publisher nor author shall be liable for any loss of profit or any other
commercial damages, including but not limited to special, incidental, consequential, exemplary, or
other damages resulting in whole or part, from the readers’ use of, or reliance upon, this material.
Mark Lassoff, Author and Publisher
Tom Stachowitz, Technical Writer
Kevin Hernandez, VP/ Production
Alison Downs, Copy Editor
Alexandria O’Brien, Book Layout
Ben Oldham, Intern
iv
Mobile App Development with HTML5
Dedication:
To the internet cats of the world. We would pet you all if we could.
v
LearnToProgram, Inc.
Courses Available from LearnToProgram, Inc.
10 Apps in 10 Weeks Introduction to Web Development
3D Fundamentals with iOS iOS Development Code Camp
Advanced Javascript Development iOS Development for Beginners Featuring iOS6/7
AJAX Development Java Programming for Beginners
Android Development for Beginners Javascript for Beginners
Become a Certified Web Developer (Level 1) Joomla for Beginners
Become a Certified Web Developer (Level 2) jQuery for Beginners
C Programming for Beginners Mobile App Development with HTML5
C++ for Beginners Mobile Game Development with iOS
Codeless Development with Adobe Muse Node.js for Beginners
Construct 2 for Beginners Objective C for Beginners
Creating a PHP Login Script Photoshop for Coders
CSS Development (with CSS3!) PHP & MySQL for Beginners
Design for Coders Programming for Absolute Beginners
Famu.os Javascript Framework Project Management with Microsoft Project
Game Development Fundamentals with Python Python for Beginners
Game Development with Python Ruby on Rails for Beginners
GitHub Fundamentals Swift Language Fundamentals
HTML and CSS for Beginners (with HTML5) SQL Database for Beginners
HTML5 Mobile App Development with PhoneGap User Experience Design
Books from LearnToProgram, Inc.
Create Your Own MP3 Player with HTML5
CSS Development (with CSS3!)
Game Development with Python
HTML and CSS for Beginners
Javascript for Beginners
PHP and MySQL for Beginners
Programming for Absolute Beginners
Python for Beginners
SQL Database for Beginners
Swift Fundamentals: The Language of iOS Development
vi
Mobile App Development with HTML5
TABLE OF CONTENTS
Chapter 1: Development Environments 13
1.1 Tools of the Trade 14
Questions for Review 25
1.2 Hello World - Your First App 26
Questions for Review 38
Chapter Summary 40
Chapter 2: HTML5 For Mobile 41
2.1 Document Structure 42
Questions for Review 50
2.2 Multi-Screen Applications 51
Questions for Review 59
2.3 Obtaining User Data 60
Questions for Review 64
2.4 Displaying Images 65
Questions for Review 73
Chapter 02 Lab Exercise 74
Chapter Summary 76
Chapter 3: CSS3 for Mobile 77
3.1 Styling Text Elements 78
Questions for Review 88
3.2 Basic Page Layout 89
Questions for Review 101
3.3 Supporting Multiple Screen Sizes 102
Questions for Review 107
Chapter 03 Lab Exercise 108
Chapter Summary 110
Chapter 4: Service-Oriented Architecture for Mobile 111
4.1 Receiving Text from the Server 112
Questions for Review 120
4.2 Sending Queries to the Server 121
Questions for Review 128
4.3 Parsing XML Data from the Server 129
Questions for Review 139
4.4 Parsing JSON Data from the Server 140
Questions for Review 150
vii
LearnToProgram, Inc.
Chapter 04 Lab Exercise 151
Chapter Summary 152
Chapter 5: Storing Data 153
5.1 Storing Data with store.js 154
Questions for Review 161
5.2 Storing Data on a Server 162
Questions for Review 168
Chapter 05 Lab Exercise 169
Chapter Summary 170
Chapter 6: Audio and Video 171
6.1 Playing Audio and Video 172
Questions for Review 176
6.2 Controlling Media with JavaScript 177
Questions for Review 181
6.3 Building a Complete Music Player 182
Questions for Review 188
6.4 Using the PhoneGap Media Object 189
Questions for Review 198
6.5 Using the Onboard Camera 199
Questions for Review 204
Chapter 06 Lab Exercise 205
Chapter Summary 206
Chapter 7: Geolocation 207
7.1 Intro to Geolocation 208
Questions for Review 213
7.2 Displaying a Map 214
Questions for Review 222
7.3 Working with the Compass 223
Questions for Review 227
Chapter 07 Lab Exercise 228
Chapter Summary 230
Chapter 8: Working with the Accelerometer 231
8.1 Obtaining Accelerometer Readings 232
Questions for Review 236
8.2 Using the Accelerometer for Input 237
Questions for Review 243
Chapter 08 Lab Exercise 244
viii
Mobile App Development with HTML5
Chapter Summary 246
Chapter 9: Interfaces with jQuery Mobile 247
9.1 jQuery Mobile Basics 248
Questions for Review 254
9.2 jQuery Mobile Pages 255
Questions for Review 259
9.3 jQuery Mobile Toolbars 260
Questions for Review 265
9.4 jQuery Mobile Buttons 266
Questions for Review 270
Chapter Summary 271
Chapter 10: Interfaces with jQuery Mobile Part II 273
10.1 jQuery Mobile Forms 274
Questions for Review 281
10.2 jQuery Mobile Listvew 282
Questions for Review 286
10.3 jQuery Mobile Events 287
Questions for Review 291
Chapter 10 Lab Exercise 292
Chapter Summary 294
Chapter 11: Other Important PhoneGap APIs 295
11.1 PhoneGap File API 296
Questions for Review 306
11.2 PhoneGap Device API 307
Questions for Review 309
11.3 PhoneGap Contacts API 310
Questions for Review 314
11.4 PhoneGap Notifications API 315
Questions for Review 318
11.5 The config.xml File 319
Questions for Review 322
Chapter Summary 323
Appendix 339
Glossary 340
ix