You are previewing PhoneGap 3.x Mobile Application Development HOTSHOT.
O'Reilly logo
PhoneGap 3.x Mobile Application Development HOTSHOT

Book Description

Create useful and exciting real-world apps for iOS and Android devices with 12 fantastic projects

In Detail

PhoneGap allows you to use your existing knowledge of HTML, CSS, and JavaScript to create useful and exciting mobile applications.

This book will present you with 12 exciting projects that will introduce you to the dynamic world of app development in PhoneGap. Starting with their design and following through to their completion, you will develop real-world mobile applications. Each app uses a combination of core PhoneGap technologies, plugins, and various frameworks covering the necessary concepts you can use to create many more great apps for mobile devices.

What You Will Learn

  • Explore localization and globalization
  • Create, save, and retrieve data using persistent device storage
  • Record audio using a microphone
  • Capture images and video using a camera
  • Share content to social media networks
  • Optimize your app for tablet-sized devices
  • Locate the user's device using geolocation
  • Interact with the accelerometer to create a fun arcade game
  • Use core and third-party plugins to extend PhoneGap
  • Look at mobile application design patterns
  • Downloading the example code for this book. You can download the example code files for all Packt books you have purchased from your account at http://www.PacktPub.com. If you purchased this book elsewhere, you can visit http://www.PacktPub.com/support and register to have the files e-mailed directly to you.

    Table of Contents

    1. PhoneGap 3.x Mobile Application Development HOTSHOT
      1. Table of Contents
      2. PhoneGap 3.x Mobile Application Development HOTSHOT
      3. Credits
      4. About the Author
      5. About the Reviewers
      6. www.PacktPub.com
        1. Support files, eBooks, discount offers and more
          1. Why Subscribe?
          2. Free Access for Packt account holders
      7. Preface
        1. What this book covers
        2. What you need for this book
        3. Who this book is for
        4. Conventions
        5. What do we build?
          1. What does it do?
          2. Why is it great?
          3. How are we going to do it?
          4. What do I need to get started?
        6. Task 1
          1. Getting ready
          2. Getting on with it
          3. What did we do?
          4. What else do I need to know?
        7. Reader feedback
        8. Customer support
          1. Downloading the example code
          2. Errata
          3. Piracy
          4. Questions
      8. 1. Your First Project
        1. What do we build?
          1. What does it do?
          2. Why is it great?
          3. How are we going to do it?
          4. What do I need to get started?
        2. Installing Node.js and configuring SDKs
          1. Getting on with it
            1. Installing node.js
            2. Configuring your path
              1. For Mac/Linux
              2. For Windows 8
            3. Configuring your platform SDKs (if not using PhoneGap Build)
              1. iOS development (Xcode)
              2. Android development
          2. What did we do?
          3. What else do I need to know?
        3. Installing Cordova/PhoneGap
          1. Getting ready
          2. Getting on with it
            1. Installing Cordova (if not installing PhoneGap)
            2. Installing PhoneGap (if not installing Cordova)
          3. What did we do?
          4. What else do I need to know?
        4. Creating your first project
          1. Getting ready
          2. Getting on with it
            1. Creating a project with the Cordova CLI
            2. Creating a project with the PhoneGap CLI
          3. What did we do?
          4. What else do I need to know?
        5. Managing your project's platforms
          1. Getting ready
          2. Getting on with it
            1. Adding platforms
          3. Listing the available platforms
          4. Removing platforms
          5. Updating platforms
          6. What did we do?
        6. Managing your project's plugins
          1. Getting ready
          2. Getting on with it
            1. Managing plugins with the Cordova CLI
              1. Installing plugins
              2. Listing plugins
              3. Removing plugins
            2. Managing plugins with the PhoneGap CLI
              1. Installing plugins
              2. Listing plugins
              3. Removing plugins
          3. What did we do?
          4. What else do I need to know?
        7. Building your project
          1. Getting ready
          2. Getting on with it
            1. Building your project using the Cordova CLI
            2. Building your project using the PhoneGap CLI
          3. What did we do?
          4. What else do I need to know?
        8. Deploying your project to a simulator/device
          1. Getting ready
          2. Getting on with it
            1. Deploying using the Cordova CLI
            2. Deploying using the PhoneGap CLI
          3. What did we do?
        9. Game Over..... Wrapping it up
        10. Can you take the HEAT? The Hotshot Challenge
      9. 2. Localization and Globalization
        1. What do we build?
          1. What does it do?
          2. Why is it great?
          3. How are we going to do it?
          4. What do I need to get started?
        2. Creating the template
          1. Getting on with it
          2. What did we do?
        3. Creating a new project based on an existing template
          1. Getting on with it
          2. What did we do?
        4. Introducing the YASMF v0.4 framework
        5. Determining the user's locale
          1. Getting on with it
          2. What did we do?
          3. What else do I need to know?
        6. Formatting numbers and dates
          1. Getting ready
          2. Getting on with it
          3. What did we do?
        7. Translating text
          1. Getting on with it
          2. What did we do?
          3. What else do I need to know?
        8. Game Over..... Wrapping it up
        9. Can you take the HEAT? The Hotshot Challenge
      10. 3. Mobile Application Design
        1. What do we build?
          1. What does it do?
          2. Why is it great?
          3. How are we going to do it?
          4. What do I need to get started?
        2. Designing the user interface
          1. Getting ready
          2. Getting on with it
          3. What did we do?
          4. What else do I need to know?
        3. Designing the data model
          1. Getting on with it
          2. What did we do?
        4. Implementing the Base Note data model
          1. Getting ready
          2. What did we do?
        5. Implementing the Note Storage model
          1. Getting on with it
          2. What did we do?
        6. Implementing the note list view
          1. Getting ready
          2. Getting on with it
          3. What did we do?
        7. Implementing the text note edit view
          1. Getting on with it
          2. What did we do?
        8. Implementing the CSS
          1. Getting ready
          2. Getting on with it
          3. What did we do?
        9. Putting it all together
          1. Getting on with it
          2. What did we do?
          3. What else do I need to know?
        10. Game Over..... Wrapping it up
        11. Can you take the HEAT? The Hotshot Challenge
      11. 4. The File API
        1. What do we build?
          1. What does it do?
          2. Why is it great?
          3. How are we going to do it?
          4. What do I need to get started?
        2. Covering the File API
          1. Getting ready
          2. Getting on with it
            1. Asynchronous callbacks
            2. Two different filesystems
            3. Requesting a quota
            4. Requesting a filesystem
            5. Directory entries
            6. File entries
            7. Reading the contents and properties of a file
            8. Writing data to a file
            9. Getting the entries in DirectoryEntry
            10. Copying and moving
            11. Removing files and directories
            12. There's even more…
          3. What did we do?
          4. What else do I need to know?
        3. Covering Promises and Q.js
          1. Getting on with it
            1. Wrapping the File API
          2. What did we do?
        4. Covering YASMF's FileManager file
          1. Getting ready
          2. Getting on with it
          3. What did we do?
        5. Changing the Note Storage model
          1. Getting ready
          2. Getting on with it
          3. What did we do?
          4. What else do I need to know?
        6. Game Over..... Wrapping it up
        7. Can you take the HEAT? The Hotshot Challenge
      12. 5. Working with Audio
        1. What do we build?
          1. What does it do?
          2. Why is it great?
          3. How are we going to do it?
          4. What do I need to get started?
        2. Covering the Media API
          1. Getting ready
          2. Getting on with it
            1. MediaError
            2. Creating a media manager
          3. What did we do?
        3. Designing the user interface
          1. Getting on with it
          2. What did we do?
        4. Designing the data model
          1. Getting on with it
          2. What did we do?
        5. Implementing the data model
          1. Getting on with it
          2. What did we do?
        6. Covering Hammer.js
          1. Getting ready
          2. Getting on with it
            1. Our taps are slow
            2. Swipe-to-delete
          3. What did we do?
          4. What else do I need to know?
        7. Covering the view stack
          1. Getting on with it
          2. What did we do?
          3. What else do I need to know?
        8. Implementing the user interface
          1. Getting on with it
          2. What did we do?
          3. What else do I need to know?
        9. Putting it all together
          1. Getting on with it
          2. What did we do?
        10. Game Over..... Wrapping it up
        11. Can you take the HEAT? The Hotshot Challenge
      13. 6. Working with Still Images
        1. What do we build?
          1. What does it do?
          2. Why is it great?
          3. How are we going to do it?
        2. Designing the user interface
          1. Getting on with it
          2. What did we do?
          3. What else do I need to know?
        3. Defining the data model
          1. Getting on with it
          2. What did we do?
        4. Covering the Camera API
          1. Getting ready
          2. Getting on with it
            1. Creating a camera manager
          3. What did we do?
          4. What else do I need to know?
        5. Implementing the data model
          1. Getting on with it
          2. What did we do?
        6. Implementing the user interface
          1. Getting on with it
          2. What did we do?
          3. What else do I need to know?
        7. Putting it all together
          1. Getting on with it
          2. What did we do?
        8. Game Over..... Wrapping it up
        9. Can you take the HEAT? The Hotshot Challenge
      14. 7. Capturing Video
        1. What do we build?
          1. What does it do?
          2. Why is it great?
          3. How are we going to do it?
        2. Designing the user interface
          1. Getting on with it
          2. What did we do?
        3. Covering the Capture API
          1. Getting ready
          2. Getting on with it
            1. Creating a video manager
          3. What did we do?
          4. What else do I need to know?
        4. Covering native, native-like, and non-native alerts
          1. Getting on with it
          2. What did we do?
          3. What else do I need to know?
        5. Implementing the data model
          1. Getting on with it
          2. What did we do?
        6. Implementing the user interface
          1. Getting on with it
          2. What did we do?
          3. What else do I need to know?
        7. Putting it all together
          1. Getting on with it
          2. What did we do?
        8. Game Over..... Wrapping it up
        9. Can you take the HEAT? The Hotshot Challenge
      15. 8. Sharing Content
        1. What do we build?
          1. What does it do?
          2. Why is it great?
          3. How are we going to do it?
        2. Handling device events
          1. Getting ready
          2. Getting on with it
          3. What did we do?
          4. What else do I need to know?
        3. Working with the sharing plugin
          1. Getting ready
          2. Getting on with it
          3. What did we do?
        4. Modifying the text note edit view
          1. Getting on with it
          2. What did we do?
          3. What else do I need to know?
        5. Modifying the image note edit view
          1. Getting on with it
          2. What did we do?
          3. What else do I need to know?
        6. Game Over..... Wrapping it up
        7. Can you take the HEAT? The Hotshot Challenge
      16. 9. Devices of Different Sizes
        1. What do we build?
          1. What does it do?
          2. Why is it great?
          3. How are we going to do it?
        2. What is responsive design?
          1. Position your containers
          2. Using percentages instead of pixels where plausible
          3. Using minimum and maximum values
          4. Using media queries (or similar)
          5. Using resolution-independent assets when possible
          6. Plan ahead
        3. Response 1 – scaling up
          1. Getting on with it
          2. What did we do?
        4. Response 2 – changing the layout
          1. Getting ready
          2. Getting on with it
          3. What did we do?
        5. Response 3 – split view
          1. Getting ready
          2. Getting on with it
          3. What did we do?
          4. What else do I need to know?
        6. Game Over..... Wrapping it up
        7. Can you take the HEAT? The Hotshot Challenge
      17. 10. Maps and GPS
        1. What do we build?
          1. What does it do?
          2. Why is it great?
          3. How are we going to do it?
          4. What do I need to get started?
        2. Designing our app's UI and its look and feel
          1. Getting on with it
          2. What did we do?
        3. Exploring geolocation
          1. Getting ready
          2. Getting on with it
          3. What did we do?
        4. Designing our data models
          1. Getting on with it
          2. What did we do?
        5. Loading the Google Maps API
          1. Getting ready
          2. Getting on with it
          3. What did we do?
          4. What else do I need to know?
        6. Implementing our data models
          1. Getting on with it
          2. What did we do?
          3. What else do I need to know?
        7. Implementing our path edit view
          1. Getting on with it
          2. What did we do?
        8. Putting it all together
          1. Getting on with it
          2. What did we do?
        9. Game Over..... Wrapping it up
        10. Can you take the HEAT? The Hotshot Challenge
      18. 11. Canvas Games and the Accelerometer
        1. What do we build?
          1. What does it do?
          2. Why is it great?
          3. How are we going to do it?
          4. What do I need to get started?
        2. Designing the game
          1. Getting on with it
          2. What did we do?
          3. What else do I need to know?
        3. Implementing the Start view
          1. Getting on with it
          2. What did we do?
          3. What else do I need to know?
        4. Implementing the Options view
          1. Getting on with it
          2. What did we do?
          3. What else do I need to know?
        5. Implementing the Game view
          1. Getting on with it
          2. What did we do?
        6. Generating levels
          1. Getting on with it
          2. What did we do?
          3. What else do I need to know?
        7. Drawing on the canvas
          1. Getting on with it
          2. What did we do?
          3. What else do I need to know?
        8. Performing updates
          1. Getting on with it
          2. What did we do?
        9. Touched-based input
          1. Getting ready
          2. What did we do?
        10. Accelerometer-based input
          1. Getting ready
          2. Getting on with it
          3. What did we do?
          4. What else do I need to know?
        11. Game Over..... Wrapping it up
        12. Can you take the HEAT? The Hotshot Challenge
      19. 12. Building a Backend – Working with Parse
        1. What do we build?
          1. What does it do?
          2. Why is it great?
          3. How are we going to do it?
        2. Configuring Parse
          1. Getting on with it
          2. What did we do?
          3. What else do I need to know?
        3. Modifying the Options view
          1. Getting on with it
          2. What did we do?
          3. What else do I need to know?
        4. Submitting scores
          1. Getting on with it
          2. What did we do?
          3. What else do I need to know?
        5. Displaying scores
          1. Getting on with it
          2. What did we do?
          3. What else do I need to know?
        6. Modifying the Start view
          1. Getting on with it
          2. What did we do?
        7. Game Over..... Wrapping it up
        8. Can you take the HEAT? The Hotshot Challenge
      20. A. User Interface Resources
        1. Flat versus skeuomorphic
        2. Human Interface/Design Guidelines
        3. Mobile pattern references
        4. User interface frameworks/libraries
        5. User interface tips
      21. B. Tips, Tricks, and Quirks
        1. Tips
          1. Prevent highlighting and outlines when tapping
          2. Include affordances
          3. Prevent unwanted text selection
          4. Improve text rendering
          5. Use native scrolling
          6. Use a scrolling library
          7. Use 3D transforms to use the GPU
          8. When using 3D transforms, hide the backface
          9. Remember perspective while using the GPU
          10. Use click prevention or prevent default actions
          11. Complex effects hinder performance
          12. Audio/video file extensions matter
          13. Careful with XHR/AJAX status values
        2. Android quirks
          1. SVG renderings for masks (<4.4)
          2. Poor rendering for rounded corners (2.x)
          3. Canvas artifacts (4.1x — 4.3.x)
          4. CSS animation artifacts (4.x; fixed for 4.4+)
          5. Horrid canvas performance (4.4.x)
          6. Blob support (<4.4)
          7. Floating input boxes
        3. The Android Emulator is slow
        4. iOS quirks
          1. Don't use private file paths
          2. Watch the status bar
          3. System fonts
          4. Rotation and viewport changes can disable scroll views
          5. Never use IFRAME with native scrolling
          6. The iOS simulator has quirks
      22. Index