Microsoft_Press_eBook_Programming_Windows_8_Apps_with_HTML_CSS_and_JavaScript_Second_Preview_PDF.pdf

(13825 KB) Pobierz
Programming
Windows 8 Apps
®
with HTML, CSS,
and JavaScript
SECOND
PREVIEW
Kraig Brockschmidt
PUBLISHED BY
Microsoft Press
A Division of Microsoft Corporation
One Microsoft Way
Redmond, Washington 98052-6399
Copyright © 2012 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.
ISBN: 978-0-7356-7261-1
This document supports a preliminary release of a software product that may be changed substantially prior to
final commercial release. 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.
Complying with all applicable copyright laws is the responsibility of the user. Without limiting the rights under
copyright, no part of this document may be reproduced, stored in or introduced into a retrieval system, or
transmitted in any form or by any means (electronic, mechanical, photocopying, recording, or otherwise), or
for any purpose, without the express written permission of Microsoft Corporation.
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
Introduction ....................................................................................................... 11
Who This Book Is For ................................................................................................................................................................. 12
What You'll Need ........................................................................................................................................................................ 13
A Formatting Note...................................................................................................................................................................... 13
Acknowledgements .................................................................................................................................................................... 13
Errata & Book Support .............................................................................................................................................................. 14
We Want to Hear from You ..................................................................................................................................................... 15
Stay in Touch ................................................................................................................................................................................ 15
Leaving Home: Onboarding to the Store ............................................................................................................................ 17
Discovery, Acquisition, and Installation ............................................................................................................................... 20
Chapter 1: The Life Story of a WinRT App:
Platform Characteristics of Windows 8.......................................................... 16
Playing in Your Own Room: The App Container .............................................................................................................. 23
Different Views of Life: View States and Resolution Scaling ......................................................................................... 27
Those Capabilities Again: Getting to Data and Devices ................................................................................................. 30
Taking a Break, Getting Some Rest: Process Lifecycle Management ......................................................................... 33
Remembering Yourself: App State and Roaming ............................................................................................................. 35
Coming Back Home: Updates and New Opportunities .................................................................................................. 39
And, Oh Yes, Then There’s Design ......................................................................................................................................... 40
Chapter 2: Quickstart ........................................................................................ 42
A Really Quick Quickstart: The Blank App Template ....................................................................................................... 42
Blank App Project Structure ................................................................................................................................................ 45
QuickStart #1: Here My Am! and an Introduction to Blend for Visual Studio ........................................................ 50
Design Wireframes ................................................................................................................................................................. 50
Create the Markup ................................................................................................................................................................. 53
Styling in Blend ....................................................................................................................................................................... 55
Adding the Code .................................................................................................................................................................... 59
Extra Credit: Receiving Messages from the iframe ...................................................................................................... 71
The Other Templates ................................................................................................................................................................. 73
Fixed Layout Template .......................................................................................................................................................... 73
Navigation Template ............................................................................................................................................................. 74
3
Grid Template .......................................................................................................................................................................... 74
Split Template .......................................................................................................................................................................... 74
What We’ve Just Learned ......................................................................................................................................................... 75
Chapter 3: App Anatomy and Page Navigation ........................................... 76
Local and Web Contexts within the App Host .................................................................................................................. 77
Referencing Content from App Data: ms-appdata ..................................................................................................... 81
Sequential Async Operations: Chaining Promises ............................................................................................................ 84
Debug Output, Error Reports, and the Event Viewer ................................................................................................. 87
App Activation ............................................................................................................................................................................. 89
Branding Your App 101: The Splash Screen and Other Visuals............................................................................... 89
Activation Event Sequence .................................................................................................................................................. 92
Activation Code Paths ........................................................................................................................................................... 93
WinJS.Application Events ..................................................................................................................................................... 95
Extended Splash Screens ...................................................................................................................................................... 97
App Lifecycle Transition Events and Session State ........................................................................................................... 99
Suspend, Resume, and Terminate ...................................................................................................................................100
Basic Session State in Here My Am! ...............................................................................................................................104
Data from Services and WinJS.xhr .......................................................................................................................................106
Handling Network Connectivity (in Brief).....................................................................................................................109
Tips and Tricks for WinJS.xhr ............................................................................................................................................109
Page Controls and Navigation..............................................................................................................................................111
WinJS Tools for Pages and Page Navigation ...............................................................................................................111
The Navigation App Template, PageControl Structure, and PageControlNavigator ....................................112
The Navigation Process and Navigation Styles ..........................................................................................................118
Optimizing Page Switching: Show-and-Hide ..............................................................................................................120
Completing the Promises Story ............................................................................................................................................120
What We’ve Just Learned .......................................................................................................................................................122
Chapter 4: Controls, Control Styling, and Data Binding ........................... 124
The Control Model for HTML, CSS, and JavaScript ........................................................................................................125
HTML Controls ...........................................................................................................................................................................126
4
WinJS stylesheets: ui-light.css, ui-dark.css, and win-* styles ...................................................................................129
Extensions to HTML Elements ..........................................................................................................................................130
WinJS Controls ...........................................................................................................................................................................130
WinJS Control Instantiation ...............................................................................................................................................132
Strict Processing and processAll Functions ..................................................................................................................133
Example: WinJS.UI.Rating Control ...................................................................................................................................134
Example: WinJS.UI.Tooltip Control..................................................................................................................................135
Working with Controls in Blend ...........................................................................................................................................137
Control Styling ...........................................................................................................................................................................139
Styling Gallery: HTML Controls ........................................................................................................................................141
Styling Gallery: WinJS Controls ........................................................................................................................................143
Some Tips and Tricks ...........................................................................................................................................................146
Custom Controls ........................................................................................................................................................................147
Custom Control Examples .................................................................................................................................................149
Custom Controls in Blend ..................................................................................................................................................151
Data Binding ...............................................................................................................................................................................154
Data Binding in WinJS .........................................................................................................................................................157
Additional Binding Features..............................................................................................................................................162
What We’ve Just Learned .......................................................................................................................................................165
Chapter 5: Collections and Collection Controls .......................................... 167
Collection Control Basics ........................................................................................................................................................168
Quickstart #1: The HTML FlipView Control Sample ..................................................................................................168
Quickstart #2a: The HTML ListView Essentials Sample .............................................................................................170
Quickstart #2b: The ListView Grouping Sample .........................................................................................................172
ListView in the Grid App Project Template ..................................................................................................................177
The Semantic Zoom Control .................................................................................................................................................181
FlipView Features and Styling ...............................................................................................................................................184
Data Sources ...............................................................................................................................................................................187
A FlipView Using the Pictures Library ............................................................................................................................187
Custom Data Sources ..........................................................................................................................................................189
5
Zgłoś jeśli naruszono regulamin