You are previewing Programming Windows® 8 Apps with HTML, CSS, and JavaScript .
O'Reilly logo
Programming Windows® 8 Apps with HTML, CSS, and JavaScript

Book Description

Use what you know about standards-based web technologies to build your own Windows 8 apps. Delve into platform features, app anatomy, design considerations, and core techniques—and apply real-world insights from the Windows team itself.

Table of Contents

  1. Cover Page
  2. Title Page
  3. Copyright Page
  4. Table of Contents
  5. Introduction
    1. Who This Book Is For
    2. What You’ll Need (Can You Say “Samples”?)
    3. A Formatting Note
    4. Acknowledgements
    5. Errata & Book Support
    6. We Want to Hear from You
    7. Stay in Touch
  6. Chapter 1: The Life Story of a Windows Store App: Platform Characteristics of Windows 8
    1. Leaving Home: Onboarding to the Windows Store
    2. Discovery, Acquisition, and Installation
    3. Playing in Your Own Room: The App Container
    4. Different Views of Life: View States and Resolution Scaling
    5. Those Capabilities Again: Getting to Data and Devices
    6. Taking a Break, Getting Some Rest: Process Lifecycle Management
    7. Remembering Yourself: App State and Roaming
    8. Coming Back Home: Updates and New Opportunities
    9. And, Oh Yes, Then There’s Design
  7. Chapter 2: Quickstart
    1. A Really Quick Quickstart: The Blank App Template
      1. Blank App Project Structure
    2. QuickStart #1: Here My Am! and an Introduction to Blend for Visual Studio
      1. Design Wireframes
      2. Create the Markup
      3. Styling in Blend
      4. Adding the Code
      5. Creating a Map with the Current Location
      6. Oh Wait, the Manifest!
      7. Capturing a Photo from the Camera
      8. Sharing the Fun!
      9. Extra Credit: Receiving Messages from the iframe
    3. The Other Templates
      1. Fixed Layout Template
      2. Navigation Template
      3. Grid Template
      4. Split Template
    4. What We’ve Just Learned
  8. Chapter 3: App Anatomy and Page Navigation
    1. Local and Web Contexts within the App Host
      1. Referencing Content from App Data: ms-appdata
      2. Here My Am! with ms-appdata
    2. Sequential Async Operations: Chaining Promises
      1. Error Handling Within Promises: then vs. done
      2. Debug Output, Error Reports, and the Event Viewer
    3. App Activation
      1. Branding Your App 101: The Splash Screen and Other Visuals
      2. Activation Event Sequence
      3. Activation Code Paths
      4. WinJS.Application Events
      5. Extended Splash Screens
      6. Activation Deferrals
    4. App Lifecycle Transition Events and Session State
      1. Suspend, Resume, and Terminate
      2. Basic Session State in Here My Am!
    5. Data from Services and WinJS.xhr
      1. Handling Network Connectivity (in Brief)
      2. Tips and Tricks for WinJS.xhr
    6. Page Controls and Navigation
      1. WinJS Tools for Pages and Page Navigation
      2. The Navigation App Template, PageControl Structure, and PageControlNavigator
      3. The Navigation Process and Navigation Styles
      4. Optimizing Page Switching: Show-and-Hide
    7. WinRT Events and removeEventListener
    8. Completing the Promises Story
    9. What We’ve Just Learned
  9. Chapter 4: Controls, Control Styling, and Data Binding
    1. The Control Model for HTML, CSS, and JavaScript
    2. HTML Controls
      1. WinJS stylesheets: ui-light.css, ui-dark.css, and win-* styles
      2. Extensions to HTML Elements
    3. WinJS Controls
      1. WinJS Control Instantiation
      2. Strict Processing and processAll Functions
      3. Example: WinJS.UI.Rating Control
      4. Example: WinJS.UI.Tooltip Control
    4. Working with Controls in Blend
    5. Control Styling
      1. Styling Gallery: HTML Controls
      2. Styling Gallery: WinJS Controls
      3. Some Tips and Tricks
    6. Custom Controls
      1. Custom Control Examples
      2. Custom Controls in Blend
    7. Data Binding
      1. Data Binding in WinJS
      2. One-Time Binding
      3. One-Way Binding
      4. Implementing Two-Way Binding
      5. Additional Binding Features
      6. Binding Initializers
      7. Binding Templates and Lists
    8. What We’ve Just Learned
  10. Chapter 5: Collections and Collection Controls
    1. Collection Control Basics
      1. Quickstart #1: The FlipView Control Sample
      2. Quickstart #2a: The HTML ListView Essentials Sample
      3. Quickstart #2b: The ListView Grouping Sample
      4. ListView in the Grid App Project Template
    2. The Semantic Zoom Control
    3. FlipView Features and Styling
    4. Data Sources
      1. A FlipView Using the Pictures Library
      2. Custom Data Sources
    5. How Templates Really Work
      1. Referring to Templates
      2. Template Elements and Rendering
      3. Template Functions (Part 1): The Basics
    6. ListView Features and Styling
      1. When Is ListView the Wrong Choice?
      2. Options, Selections, and Item Methods
      3. Styling
      4. Backdrops
      5. Layouts and Cell Spanning
    7. Optimizing ListView Performance
      1. Random Access
      2. Incremental Loading
      3. Template Functions (Part 2): Promises, Promises!
    8. What We’ve Just Learned
  11. Chapter 6: Layout
    1. Principles of Windows Store App Layout
    2. Quickstart: Pannable Sections and Snap Points
      1. Laying Out the Hub
      2. Laying Out the Sections
      3. Snap Points
    3. The Many Faces of Your Display
      1. View States
      2. Handling View States
      3. Screen Size, Pixel Density, and Scaling
      4. Graphics That Scale Well
    4. Adaptive and Fixed Layouts for Display Size
      1. Fixed Layouts and the ViewBox Control
      2. Adaptive Layouts
    5. Using the CSS Grid
      1. Overflowing a Grid Cell
      2. Centering Content Vertically
      3. Scaling Font Size
    6. Item Layout
      1. CSS 2D and 3D Transforms
      2. Flexbox
      3. Nested and Inline Grids
      4. Fonts and Text Overflow
      5. Multicolumn Elements and Regions
    7. What We’ve Just Learned
  12. Chapter 7: Commanding UI
    1. Where to Place Commands
    2. The App Bar
      1. App Bar Basics and Standard Commands
      2. Command Events
      3. App Bar Events and Methods
      4. Showing, Hiding, Enabling, and Updating Commands
      5. App Bar Styling
      6. Custom Icons
      7. Command Menus
      8. Custom App Bars and Navigation Bars
    3. Flyouts and Menus
      1. WinJS.UI.Flyout Properties, Methods, and Events
      2. Flyout Examples
      3. Menus and Menu Commands
      4. Context Menus
    4. Message Dialogs
    5. Improving Error Handling in Here My Am!
    6. What We’ve Just Learned
  13. Chapter 8: State, Settings, Files, and Documents
    1. The Story of State
      1. Settings and State
      2. App Data Locations
      3. AppData APIs (WinRT and WinJS)
      4. Settings Containers
      5. Versioning App State
      6. Storage Folders and Storage Files
      7. The FileIO, PathIO, and WinJS helper classes (plus FileReader)
      8. Encryption and Compression
      9. Using App Data APIs for State Management
      10. Session State
      11. Local and Temporary State
      12. IndexedDB and Other Database Options
      13. Roaming State
    2. Settings Pane and UI
      1. Design Guidelines for Settings
      2. Populating Commands
      3. Implementing Commands: Links and Settings Flyouts
      4. Programmatically Invoking Settings Flyouts
    3. User Data: Libraries, File Pickers, and File Queries
      1. Using the File Picker
      2. The File Picker UI
      3. The File Picker API (and a Few Friends)
      4. Media Libraries
      5. Documents and Removable Storage
      6. Rich Enumeration with File Queries
    4. Here My Am! Update
    5. What We’ve Just Learned
  14. Chapter 9: Input and Sensors
    1. Touch, Mouse, and Stylus Input
      1. The Touch Language, Its Translations, and Mouse/Keyboard Equivalents
      2. Edge Gestures
      3. CSS Styles That Affect Input
      4. What Input Capabilities Are Present?
      5. Unified Pointer Events
      6. Pointer Capture
      7. Gesture Events
      8. Multipoint Gestures
      9. The Input Instantiable Gesture Sample
      10. The Gesture Recognizer
    2. Keyboard Input and the Soft Keyboard
      1. Soft Keyboard Appearance and Configuration
      2. Adjusting Layout for the Soft Keyboard
      3. Standard Keystrokes
    3. Inking
    4. Geolocation
    5. Sensors
    6. What We’ve Just Learned
  15. Chapter 10: Media
    1. Creating Media Elements
    2. Graphics Elements: Img, Svg, and Canvas (and a Little CSS)
      1. Additional Characteristics of Graphics Elements
      2. Some Tips and Tricks
      3. Img Elements
      4. Svg Elements
      5. Canvas Elements
    3. Video Playback and Deferred Loading
      1. Disabling Screen Savers and the Lock Screen During Playback
      2. Video Element Extension APIs
      3. Applying a Video Effect
      4. Browsing Media Servers
    4. Audio Playback and Mixing
      1. Audio Element Extension APIs
      2. Playback Manager and Background Audio
      3. The Media Control UI
      4. Playing Sequential Audio
    5. Playlists
    6. Loading and Manipulating Media
      1. Media File Metadata
      2. Thumbnails
      3. Common File Properties
      4. Media-Specific Properties
      5. Media Properties in the Samples
      6. Image Manipulation and Encoding
      7. Transcoding and Custom Image Formats
      8. Manipulating Audio and Video
      9. Transcoding
      10. Custom Decoders/Encoders and Scheme Handlers
    7. Media Capture
      1. Flexible Capture with the MediaCapture Object
      2. Selecting a Media Capture Device
    8. Streaming Media and PlayTo
      1. Streaming from a Server and Digital Rights Management (DRM)
      2. Streaming from App to Network
      3. PlayTo
    9. What We Have Learned
  16. Chapter 11: Purposeful Animations
    1. Systemwide Enabling and Disabling of Animations
    2. The WinJS Animations Library
      1. Animations in Action
    3. CSS Animations and Transitions
      1. The Independent Animations Sample
    4. Rolling Your Own: Tips and Tricks
    5. What We’ve Just Learned
  17. Chapter 12: Contracts
    1. Share
      1. Source Apps
      2. Sharing Multiple Data Formats
      3. Custom Data Formats: schema.org
      4. Deferrals and Delayed Rendering
      5. Target Apps
      6. Long-Running Operations
      7. Quicklinks
      8. The Clipboard
    2. Search
      1. Search in the App Manifest and the Search Item Template
      2. Basic Search and Search Activation
      3. Providing Query Suggestions
      4. Providing Result Suggestions
      5. Type to Search
    3. Launching Apps: File Type and URI Scheme Associations
      1. File Activation
      2. Protocol Activation
    4. File Picker Providers
      1. Manifest Declarations
      2. Activation of a File Picker Provider
      3. File Open Provider: Local File
      4. File Open Provider: URI
      5. File Save Provider: Save a File
      6. File Save Provider: Failure Case
    5. Cached File Updater
      1. Updating a Local File: UI
      2. Updating a Remote File: UI
      3. Update Events
    6. Contacts
      1. Using the Contact Picker
      2. Contact Picker Providers
    7. What We’ve Just Learned
  18. Chapter 13: Tiles, Notifications, the Lock Screen, and Background Tasks
    1. Alive with Activity: A Visual Tour
    2. The Four Sources of Updates and Notifications
    3. Tiles, Secondary Tiles, and Badges
      1. Secondary Tiles
      2. Creating Secondary Tiles
      3. App Activation From a Secondary Tile
      4. Managing Secondary Tiles
      5. Basic Tile Updates
      6. Choosing a Tile Template
      7. Creating the Payload, Method 1: Populating Template Content
      8. Creating the Payload, Method 2: XML Strings
      9. Creating the Payload, Method 3: The Notifications Extensions Library
      10. Using Local and Web Images
      11. Branding
      12. Cycling, Scheduled, and Expiring Updates
      13. Badge Updates
    4. Periodic Updates
      1. Web Services for Updates
      2. Using the Localhost
      3. Windows Azure
    5. Toast Notifications
      1. Creating Basic Toasts
      2. Butter and Jam: Options for Your Toast
      3. Tea Time: Scheduled Toasts
      4. Toast Events and Activation
    6. Push Notifications and the Windows Push Notification Service
      1. Requesting and Caching a Channel URI (App)
      2. Managing Channel URIs (Service)
      3. Sending Updates and Notifications (Service)
      4. Raw Notifications (Service)
      5. Receiving Notifications (App)
      6. Debugging Tips
      7. Windows Azure Toolkit and Windows Azure Mobile Services
    7. Background Tasks and Lock Screen Apps
      1. Background Tasks in the Manifest
      2. Building and Registering Background Task
      3. Conditions
      4. Tasks for Maintenance Triggers
      5. Tasks for System Triggers (Non-Lock Screen)
      6. Lock Screen–Dependent Tasks and Triggers
      7. Debugging Background Tasks
    8. What We’ve Just Learned (Whew!)
  19. Chapter 14: Networking
    1. Network Information and Connectivity
      1. Network Types in the Manifest
      2. Network Information (the Network Object Roster)
      3. The ConnectionProfile Object
      4. Connectivity Events
      5. Cost Awareness
      6. Running Offline
    2. XmlHttpRequest
    3. Background Transfer
      1. Basic Downloads
      2. Basic Uploads
      3. Breaking Up Large Files
      4. Multipart Uploads
      5. Providing Headers and Credentials
      6. Setting Cost Policy
      7. Grouping Transfers
      8. Suspend, Resume, and Restart with Background Transfers
    4. Authentication, Credentials, and the User Profile
      1. The Credential Picker UI
      2. The Credential Locker
      3. The Web Authentication Broker
      4. Single Sign On
      5. Single Sign On with Live Connect
      6. The User Profile (and the Lock Screen Image)
      7. Encryption, Decryption, Data Protection, and Certificates
    5. Syndication
      1. Reading RSS Feeds
      2. Using AtomPub
    6. Sockets
      1. Datagram Sockets
      2. Stream Sockets
      3. Web Sockets: MessageWebSocket and StreamWebSocket
      4. The ControlChannelTrigger Background Task
    7. Loose Ends (or Some Samples To Go)
    8. What We’ve Just Learned
  20. Chapter 15: Devices and Printing
    1. Using Devices
      1. The XInput API and Game Controllers
      2. Enumerating Devices in a Class
      3. Windows Portable Devices and Bluetooth Capabilities
    2. Near Field Communication and the Proximity API
      1. Finding Your Peers (No Pressure!)
      2. Advertising a Connection
      3. Making a Connection
      4. Tap to Connect and Tap to Activate
      5. Sending One-Shot Payloads: Tap to Share
    3. Printing Made Easy
      1. The Printing User Experience
      2. Print Document Sources
      3. Providing Print Content and Configuring Options
    4. What We’ve Just Learned
  21. Chapter 16: WinRT Components: An Introduction
    1. Choosing a Mixed Language Approach (and Web Workers)
    2. Quickstarts: Creating and Debugging Components
      1. Quickstart #1: Creating a Component in C#
      2. Quickstart #2: Creating a Component in C++
      3. Comparing the Results
    3. Key Concepts for WinRT Components
      1. Implementing Asynchronous Methods
      2. JavaScript Workers
      3. Async Basics in WinRT Components
      4. Arrays, Vectors, and Other Alternatives
      5. Projections into JavaScript
    4. Scenarios for WinRT Components
      1. Higher Performance
      2. Access to Additional APIs
      3. Obfuscating Code and Protecting Intellectual Property
      4. Library Components
      5. Concurrency
    5. What We’ve Just Learned
  22. Chapter 17: Apps for Everyone: Accessibility, World-Readiness, and the Windows Store
    1. Your App, Your Business
      1. Side Loading
      2. Planning: Can the App Be a Windows Store App?
      3. Planning for Monetization (or Not)
      4. Free Apps
      5. Ad-Supported Apps
      6. Paid Apps and Trial Versions
      7. In-App Purchases
      8. Revenue Sharing and Custom Commerce for In-App Purchases
    2. The Windows Store APIs
      1. The CurrentAppSimulator Object
      2. Trial Versions and App Purchase
      3. Listing and Purchasing In-App Products
      4. Receipts
    3. Accessibility
      1. Screen Readers and Aria Attributes
      2. The ARIA Sample
      3. Handling Contrast Variations
      4. CSS Styling for High Contrast
      5. High Contrast Resources
      6. Scale + Contrast = Resource Qualifiers
      7. High Contrast Tile and Toast Images
    4. World Readiness and Localization
      1. Globalization
      2. User Language and Other Settings
      3. Formatting Culture-Specific Data and Calendar Math
      4. Sorting and Grouping
      5. Fonts and Text Layout
      6. Preparing for Localization
      7. Part 1: Separating String Resources
      8. Part 2: Structuring Resources for the Default Language
      9. Creating Localized Resources: The Multilingual App Toolkit
      10. Testing with the Pseudo Language
      11. Localization Wrap-Up
    5. Releasing Your App to the World
      1. Promotional Screenshots, Store Graphics, and Text Copy
      2. Testing and Pre-Certification Tools
      3. Onboarding and Working through Rejection
      4. App Updates
      5. Getting Known: Marketing, Discoverability, and the Web
      6. Connecting Your Website
      7. Final Thoughts: Qualities of a Rock Star App
    6. What We’ve Just Learned
  23. About the Author