ebook img

Programming Windows Store Apps in HTML, CSS, and JavaScript PDF

750 Pages·2013·16.45 MB·English
Save to my drive
Quick download
Download
Most books are stored in the elastic cloud where traffic is expensive. For this reason, we have a limit on daily download.

Preview Programming Windows Store Apps in HTML, CSS, and JavaScript

spine = 2.07” Programming Windows Sixth Edition WWP Programming r i Writing Windows 8 Apps with C# and XAML About the Sixth Edition ti r n o • Completely rewritten for Windows 8 gi Like Windows itself, this classic book has been reimagined for n a new world of programming and user experiences. Guided • Focuses on creating apps using C#, W Windows Store XAML, and the Windows Runtime g by developer legend Charles Petzold, Programming Windows, i • Expertly teaches essential skills in Part 1: nd Sixth Edition teaches how to use your existing C# skills with d Elementals XAML and the Windows Runtime to create full-screen, touch o r • Rounds out your Windows 8 education apps for Windows 8. woa in Part 2: Specialties s Apps with HTML, • Provides code samples in both C# Master the elementals and C++ 8 wm • Create and initialize objects with code or XAML A p • Handle user-input events such as taps ps • Manage and experiment with dynamic layout s m • Visually redefine a control’s appearance w CSS, and JavaScript • Create Windows Runtime libraries it • Use MVVM for data binding and commanding h i • Work with asynchronous methods; write your own About the Author C n # • Animate transitions and create 2D and 3D effects Charles Petzold has been writing • Manage resolution, scaling, and navigation about Windows programming a g Second Edition n for 25 years. A Windows Pioneer d Extend your skills and apps Award winner, Petzold is author X of the classic Programming Windows, the • Handle pointer, manipulation, tap, and hold events A widely acclaimed Code: The Hidden • Manipulate bitmaps and rich text Language of Computer Hardware a nd M • Work with GPS and orientation sensors Software, Programming Windows Phone 7, L • Call Win32® and DirectX® functions and more than a dozen other bo oks. l • Enable share, search, and print a SECOND n o Get C# and C++ code samples i PREVIEW Ready to download at: edition s http://go.microsoft.com/FWLink/?Linkid=277058 s e Petzold f o microsoft.com/mspress r P ISBN: 978-0-7356-7176-8 U.S.A. $59.99 Canada $62.99 [Recommended] Kraig Brockschmidt Programming/Windows SECOND PREVIEW This excerpt provides early content from a book currently in development and is still in preview format. (See additional notices below.) PUBLISHED BY Microsoft Press A Division of Microsoft Corporation One Microsoft Way Redmond, Washington 98052-6399 Copyright © 2013 Microsoft Corporation All rights reserved. No part of the contents of this book may be reproduced or transmitted in any form or by any means without the written permission of the publisher. This document is provided for informational purposes only and Microsoft makes no warranties, either express or implied, in this document. Information in this document, including URL and other Internet website references, is subject to change without notice. The entire risk of the use or the results from the use of this document remains with the user. Unless otherwise noted, the companies, organizations, products, domain names, e-mail addresses, logos, people, places, and events depicted in examples herein are fictitious. No association with any real company, organization, product, domain name, e-mail address, logo, person, place, or event is intended or should be inferred. Microsoft and the trademarks listed at http://www.microsoft.com/about/legal/en/us/IntellectualProperty /Trademarks/EN- US.aspx are trademarks of the Microsoft group of companies. All other marks are property of their respective owners. This book expresses the author’s views and opinions. The information contained in this book is provided without any express, statutory, or implied warranties. Neither the authors, Microsoft Corporation, nor its resellers or distributors will be held liable for any damages caused or alleged to be caused either directly or indirectly by this book. Acquisitions, Developmental, and Project Editor: Devon Musgrave Cover: Twist Creative • Seattle and Joel Panchot Contents Introduction .................................................................................................................................................. 12 Who This Book Is For .................................................................................................................................................................... 14 What You'll Need (Can You Say “Samples”?) ...................................................................................................................... 15 Some Formatting Notes .............................................................................................................................................................. 16 We Want to Hear from You ....................................................................................................................................................... 17 Stay in Touch .................................................................................................................................................................................... 17 Chapter 1 The Life Story of a Windows Store App: Characteristics of the Windows Platform .... 18 Leaving Home: Onboarding to the Windows Store ......................................................................................................... 20 Discovery, Acquisition, and Installation ................................................................................................................................. 22 Playing in Your Own Room: The App Container ............................................................................................................... 26 Different Views of Life: Views and Resolution Scaling ..................................................................................................... 30 Those Capabilities Again: Getting to Data and Devices ................................................................................................. 33 Taking a Break, Getting Some Rest: Process Lifecycle Management ........................................................................ 36 Remembering Yourself: App State and Roaming .............................................................................................................. 38 Coming Back Home: Updates and New Opportunities .................................................................................................. 42 And, Oh Yes, Then There’s Design ........................................................................................................................................... 43 Chapter 2 Quickstart.................................................................................................................................. 45 A Really Quick Quickstart: The Blank App Template ....................................................................................................... 45 Blank App Project Structure .................................................................................................................................................. 48 QuickStart #1: Here My Am! and an Introduction to Blend for Visual Studio ...................................................... 52 Design Wireframes .................................................................................................................................................................... 53 Create the Markup .................................................................................................................................................................... 56 Styling in Blend ........................................................................................................................................................................... 58 Adding the Code ........................................................................................................................................................................ 63 Extra Credit: Improving the App .............................................................................................................................................. 77 Receiving Messages from the iframe ................................................................................................................................. 78 Improving the Placeholder Image with a Canvas Element ....................................................................................... 79 Handling Variable Image Sizes ............................................................................................................................................. 80 Moving the Captured Image to AppData (or the Pictures Library) ....................................................................... 83 1 Using a Thumbnail Instead of the Full Image ................................................................................................................ 85 The Other Templates: Projects and Items ............................................................................................................................. 86 Navigation App Template ...................................................................................................................................................... 86 Grid App Template .................................................................................................................................................................... 87 Hub App Template .................................................................................................................................................................... 87 Split Template ............................................................................................................................................................................. 87 Item Templates ........................................................................................................................................................................... 88 What We’ve Just Learned ............................................................................................................................................................ 88 Chapter 3 App Anatomy and Performance Fundamentals .................................................................. 90 App Activation ................................................................................................................................................................................. 91 Branding Your App 101: The Splash Screen and Other Visuals .............................................................................. 92 Activation Event Sequence .................................................................................................................................................... 96 Activation Code Paths .............................................................................................................................................................. 98 WinJS.Application Events ..................................................................................................................................................... 100 Optimizing Startup Time ..................................................................................................................................................... 103 WinRT Events and removeEventListener ............................................................................................................................ 105 App Lifecycle Transition Events and Session State ......................................................................................................... 107 Suspend, Resume, and Terminate .................................................................................................................................... 108 Basic Session State in Here My Am! ................................................................................................................................ 112 Page Controls and Navigation ............................................................................................................................................... 115 WinJS Tools for Pages and Page Navigation ............................................................................................................... 115 The Navigation App Template, PageControl Structure, and PageControlNavigator ................................. 118 The Navigation Process and Navigation Styles .......................................................................................................... 125 Optimizing Page Switching: Show-and-Hide .............................................................................................................. 127 Page-Specific Styling ............................................................................................................................................................. 128 Async Operations: Be True to Your Promises ................................................................................................................... 130 Using Promises ......................................................................................................................................................................... 130 Joining Parallel Promises ..................................................................................................................................................... 132 Sequential Promises: Nesting and Chaining ................................................................................................................ 133 Managing the UI Thread with the WinJS Scheduler ..................................................................................................... 135 2 Scheduler Priorities ................................................................................................................................................................ 136 Scheduling and Managing Tasks ...................................................................................................................................... 137 Setting Priority in Promise Chains .................................................................................................................................... 139 Inside a Task .............................................................................................................................................................................. 141 Debugging and Profiling .......................................................................................................................................................... 143 Debug Output and Logging............................................................................................................................................... 143 Error Reports and the Event Viewer ................................................................................................................................ 144 Async Debugging ................................................................................................................................................................... 146 Performance and Memory Analysis ................................................................................................................................ 148 The Windows App Certification Toolkit ......................................................................................................................... 153 What We’ve Just Learned ......................................................................................................................................................... 154 Chapter 4 Web Content and Services .................................................................................................... 155 Network Information and Connectivity.............................................................................................................................. 157 Network Types in the Manifest ......................................................................................................................................... 158 Network Information (the Network Object Roster) .................................................................................................. 159 The ConnectionProfile Object ........................................................................................................................................... 161 Connectivity Events ................................................................................................................................................................ 162 Cost Awareness ........................................................................................................................................................................ 163 Running Offline ....................................................................................................................................................................... 167 Hosting Content: the WebView and iframe Elements .................................................................................................. 169 Local and Web Contexts (and iframe Elements) ........................................................................................................ 170 Dynamic Content .................................................................................................................................................................... 173 App Content URIs ................................................................................................................................................................... 175 The <x-ms-webview> Element ......................................................................................................................................... 177 HTTP Requests .............................................................................................................................................................................. 187 Using WinJS.xhr ....................................................................................................................................................................... 188 Using Windows.Web.Http.HttpClient ............................................................................................................................. 189 Suspend and Resume with Online Content ................................................................................................................. 194 Prefetching Content .............................................................................................................................................................. 196 Background Transfer .................................................................................................................................................................. 198 3 Basic Downloads ..................................................................................................................................................................... 199 Basic Uploads ........................................................................................................................................................................... 203 Completion and Error Notifications ................................................................................................................................ 204 Providing Headers and Credentials ................................................................................................................................. 205 Setting Cost Policy .................................................................................................................................................................. 205 Grouping Transfers ................................................................................................................................................................. 206 Suspend, Resume, and Restart with Background Transfers ................................................................................... 207 Authentication, the Microsoft Account, and the User Profile ................................................................................... 208 The Credential Locker ........................................................................................................................................................... 209 The Web Authentication Broker ....................................................................................................................................... 211 Single Sign-On ......................................................................................................................................................................... 215 Using the Microsoft Account ............................................................................................................................................. 216 The User Profile (and the Lock Screen Image) ............................................................................................................ 222 What We’ve Just Learned ......................................................................................................................................................... 224 Chapter 5 Controls and Control Styling ................................................................................................ 226 The Control Model for HTML, CSS, and JavaScript ........................................................................................................ 227 HTML Controls .............................................................................................................................................................................. 229 Extensions to HTML Elements............................................................................................................................................ 232 WinJS Controls .............................................................................................................................................................................. 234 Syntax for data-win-options ............................................................................................................................................... 237 WinJS Control Instantiation ................................................................................................................................................ 239 Strict Processing and processAll Functions .................................................................................................................. 240 Example: WinJS.UI.HtmlControl ........................................................................................................................................ 241 Example: WinJS.UI.Rating (and Other Simple Controls) .......................................................................................... 242 Example: WinJS.UI.Tooltip ................................................................................................................................................... 243 Example: WinJS.UI.ItemContainer .................................................................................................................................... 244 Working with Controls in Blend ............................................................................................................................................ 247 Control Styling .............................................................................................................................................................................. 250 Styling Gallery: HTML Controls ......................................................................................................................................... 252 Styling Gallery: WinJS Controls ......................................................................................................................................... 254 4 Some Tips and Tricks ............................................................................................................................................................. 262 Custom Controls .......................................................................................................................................................................... 263 Implementing the Dispose Pattern.................................................................................................................................. 266 Custom Control Examples ................................................................................................................................................... 267 Custom Controls in Blend.................................................................................................................................................... 271 What We’ve Just Learned ......................................................................................................................................................... 275 Chapter 6 Data Binding, Templates, and Collections ......................................................................... 277 Data Binseding ............................................................................................................................................................................. 278 Data Binding Basics ................................................................................................................................................................ 278 Data Binding in WinJS .......................................................................................................................................................... 280 Under the Covers: Binding mixins .................................................................................................................................... 290 Programmatic Binding and WinJS.Binding.bind ........................................................................................................ 292 Binding Initializers .................................................................................................................................................................. 294 Binding Templates ...................................................................................................................................................................... 298 Template Options, Properties, and Compilation........................................................................................................ 301 Collection Data Types ................................................................................................................................................................ 304 Windows.Foundation.Collection Types .......................................................................................................................... 304 WinJS Binding Lists ................................................................................................................................................................. 310 What We’ve Just Learned ......................................................................................................................................................... 321 Chapter 7 Collection Controls ................................................................................................................ 323 Collection Control Basics .......................................................................................................................................................... 324 Quickstart #1: The WinJS Repeater Control with HTML controls ........................................................................ 324 Quickstart #2: The FlipView Control Sample ............................................................................................................... 328 Quickstart #3: The ListView Essentials Sample ............................................................................................................ 330 Quickstart #4: The ListView Grouping Sample ........................................................................................................... 332 ListView in the Grid App Project Template .................................................................................................................. 336 The Semantic Zoom Control ................................................................................................................................................... 340 How Templates Work with Collection Controls .............................................................................................................. 343 Referring to Templates ......................................................................................................................................................... 343 Template Functions (Part 1): The Basics ........................................................................................................................ 344 5 Creating Templates from Data Sources in Blend ....................................................................................................... 347 Repeater Features and Styling ............................................................................................................................................... 351 FlipView Features and Styling................................................................................................................................................. 356 Collection Control Data Sources ........................................................................................................................................... 359 The Structure of Data Sources (Interfaces Aplenty!)................................................................................................. 360 A FlipView Using the Pictures Library ............................................................................................................................. 364 Custom Data Sources and WinJS.UI.VirtualizedDataSource .................................................................................. 366 ListView Features and Styling ................................................................................................................................................. 372 When Is ListView the Right Choice? ................................................................................................................................ 373 Options, Selections, and Item Methods ......................................................................................................................... 375 Styling .......................................................................................................................................................................................... 378 Loading State Transitions .................................................................................................................................................... 380 Drag and Drop ......................................................................................................................................................................... 382 Layouts ........................................................................................................................................................................................ 385 Template Functions (Part 2): Optimizing Item Rendering .......................................................................................... 394 What We’ve Just Learned ......................................................................................................................................................... 399 Chapter 8 Layout and Views ................................................................................................................... 401 Principles of Page Layout ......................................................................................................................................................... 403 Sizing, Scaling, and Views: The Many Faces of Your App ........................................................................................... 406 Variable View Sizing and Orientations ........................................................................................................................... 406 Screen Resolution, Pixel Density, and Scaling ............................................................................................................. 417 Multiple Views .......................................................................................................................................................................... 422 Pannable Sections and Styles ................................................................................................................................................. 426 Laying Out the Hub ............................................................................................................................................................... 427 Laying Out the Sections ....................................................................................................................................................... 428 Panning Styles and Railing .................................................................................................................................................. 429 Panning Snap Points and Limits ....................................................................................................................................... 431 Zooming Snap Points and Limits...................................................................................................................................... 432 The Hub Control and Hub App Template ......................................................................................................................... 433 Hub Control Styling ............................................................................................................................................................... 440 6 Using the CSS Grid ...................................................................................................................................................................... 441 Overflowing a Grid Cell ........................................................................................................................................................ 443 Centering Content Vertically .............................................................................................................................................. 443 Scaling Font Size ..................................................................................................................................................................... 445 Item Layout .................................................................................................................................................................................... 445 CSS 2D and 3D Transforms ................................................................................................................................................. 446 Flexbox ........................................................................................................................................................................................ 446 Nested and Inline Grids ........................................................................................................................................................ 447 Fonts and Text Overflow ...................................................................................................................................................... 449 Multicolumn Elements and Regions ............................................................................................................................... 450 What We’ve Just Learned ......................................................................................................................................................... 453 Chapter 9 Commanding UI ..................................................................................................................... 454 Where to Place Commands ..................................................................................................................................................... 455 The App Bar and Nav Bar ......................................................................................................................................................... 460 App Bar Basics and Standard Commands ..................................................................................................................... 461 App Bar Styling ........................................................................................................................................................................ 470 Command Menus ................................................................................................................................................................... 474 Custom App Bars .................................................................................................................................................................... 476 Nav Bar Features ..................................................................................................................................................................... 477 Nav Bar Styling ........................................................................................................................................................................ 486 Flyouts and Menus ...................................................................................................................................................................... 488 WinJS.UI.Flyout Properties, Methods, and Events ..................................................................................................... 490 Flyout Examples ....................................................................................................................................................................... 491 Menus and Menu Commands ........................................................................................................................................... 494 Message Dialogs .......................................................................................................................................................................... 499 Improving Error Handling in Here My Am! ...................................................................................................................... 500 What We’ve Just Learned ......................................................................................................................................................... 506 Chapter 10 The Story of State, Part 1: App Data and Settings .......................................................... 508 The Story of State ........................................................................................................................................................................ 510 App Data Locations ................................................................................................................................................................ 513 7 App Data APIs (WinRT and WinJS) ....................................................................................................................................... 514 Settings Containers ................................................................................................................................................................ 515 State Versioning ...................................................................................................................................................................... 517 Folders, Files, and Streams ....................................................................................................................................................... 518 FileIO, PathIO, and WinJS Helpers (plus FileReader) ................................................................................................ 524 Encryption and Compression ............................................................................................................................................. 525 Q&A on Files, Streams, Buffers, and Blobs .................................................................................................................... 525 Using App Data APIs for State Management ................................................................................................................... 533 Transient Session State ......................................................................................................................................................... 533 Local and Temporary State ................................................................................................................................................. 534 IndexedDB, SQLite, and Other Database Options ..................................................................................................... 536 Roaming State .......................................................................................................................................................................... 538 Settings Pane and UI .................................................................................................................................................................. 540 Design Guidelines for Settings .......................................................................................................................................... 543 Populating Commands ......................................................................................................................................................... 545 Implementing Commands: Links and Settings Flyouts............................................................................................ 547 Programmatically Invoking Settings Flyouts ............................................................................................................... 549 Here My Am! Update ................................................................................................................................................................. 551 What We’ve Just Learned ......................................................................................................................................................... 552 Chapter 11 The Story of State, Part 2: User Data, Files, and SkyDrive ............................................. 554 The Big Picture of User Data ................................................................................................................................................... 555 Using the File Picker and Access Cache ............................................................................................................................. 560 The File Picker UI..................................................................................................................................................................... 561 The File Picker API .................................................................................................................................................................. 566 Access Cache ............................................................................................................................................................................ 570 StorageFile Properties and Metadata .................................................................................................................................. 573 Availability ................................................................................................................................................................................. 574 Thumbnails ................................................................................................................................................................................ 575 File Properties ........................................................................................................................................................................... 579 Media-Specific Properties ................................................................................................................................................... 582 8

Description:
To step back for a moment, one of the key differences between traditional desktop applications and. Windows Store apps is that the latter are inherently stateful. That is, once they've run the first time, they remember their state across invocations (unless explicitly closed by the user or unless t
See more

The list of books you might like

Most books are stored in the elastic cloud where traffic is expensive. For this reason, we have a limit on daily download.