Kraig Brockschmidt
Purchase Now !
Just with Paypal
Just with Paypal
Book Details
Price
|
3.00 USD |
|---|---|
Pages
| 537 p |
File Size
|
13,826 KB |
File Type
|
PDF format |
ISBN
| 978-0-7356-7261-1 |
Copyright
| 2012 Microsoft Corporation |
Kraig Brockschmidt has worked with Microsoft since 1988, focusing primarily on helping developers through writing, education, public speaking, and direct engagement. Kraig is currently a Senior Program Manager in the Windows Ecosystem team working directly with key partners on building apps for Windows 8 and bringing knowledge gained in that experience to the wider developer community. His other books include Inside OLE (two editions), Mystic Microsoft, The Harmonium Handbook, and Finding Focus. His website is www.kraigbrockschmidt.com.
Who This Book Is For
Who This Book Is For
This book is about writing WinRT apps using HTML5, CSS3, and JavaScript. Our primary focus will be on applying these web technologies within the Windows 8 platform, where there are unique considerations, and not on exploring the details of those web technologies themselves. For the most part, then, I'm assuming that you're already at least somewhat conversant with these standards. We will cover some of the more salient areas like the CSS grid, which is central to app layout, but otherwise I trust that you're capable of finding appropriate references for everything else.
I'm also assuming that your interest in Windows 8 has at least two basic motivations. One, you
probably want to come up to speed as quickly as you can, perhaps to carve out a foothold in the Windows Store sooner rather than later. Toward that end, I've front-loaded the early chapters with the most important aspects of app development along with "Quickstart" sections to give you immediate experience with the tools, the API, and core platform features. On the other hand, you probably also want to make the best app you can, one that performs really well and that takes advantage of the full extent of the platform. Toward this end, I've also endeavored to make this book comprehensive, helping you at least be aware of what's possible and where optimizations can be made.
Many insights have come from working directly with real-world developers on their real-world apps. As part of the Windows Ecosystem team, myself and my teammates have been on the front lines bringing those first apps to the Windows Store. This has involved writing bits of code for those apps and investigating bugs, along with conducting design, code, and performance reviews with members of the core Windows engineering teams. As such, one of my goals with this book is to make that deep understanding available to many more developers, including you!
Table of Contents
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
Chapter 1: The Life Story of a WinRT App: Platform Characteristics of Windows 8
Leaving Home: Onboarding to the Store .... 17
Discovery, Acquisition, and Installation ... 20
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
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 ....
What We’ve Just Learned ......... 75
Chapter 3: App Anatomy and Page Navigation
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
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
The Control Model for HTML, CSS, and JavaScript ......125
HTML Controls ........126
WinJS stylesheets: ui-light.css, ui-dark.css, and win-* styles ....129
Extensions to HTML Elements ......130
WinJS Controls .....130
WinJS Control Instantiation ....132
Example: WinJS.UI.Rating Control 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
Custom Controls .........147
Custom Control Examples ..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
Collection Control Basics ....168
Quickstart #1: The HTML FlipView Control Sample
Quickstart #2a: The HTML ListView Essentials Sample
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
How Templates Really Work.....191
Referring to Templates .....191
Template Elements and Rendering....192
Template Functions (Part 1): The Basics .....193
ListView Features and Styling ....195
When Is ListView the Wrong Choice? .......195
Options, Selections, and Item Methods .....197
Styling .......200
Backdrops ...201
Layouts and Cell Spanning ........202
Optimizing ListView Performance ......208
Random Access ......209
Incremental Loading .......210
Template Functions (Part 2): Promises, Promises! .....210
What We’ve Just Learned ........216
Chapter 6: Layout
Principles of WinRT app Layout .....219
Quickstart: Pannable Sections and Snap Points .....223
Laying Out the Hub .......223
Laying Out the Sections.........225
Snap Points ........225
The Many Faces of Your Display ....226
View States .........227
Screen Size, Pixel Density, and Scaling ....234
Adaptive and Fixed Layouts for Display Size ......238
Fixed Layouts and the ViewBox Control .....239
Adaptive Layouts ....241
Using the CSS Grid ........243
Overflowing a Grid Cell .....244
Centering Content Vertically ......245
Scaling Font Size .....246
Item Layout .......247
CSS 2D and 3D Transforms.............247
Flexbox ......248
Nested and Inline Grids .........249
Fonts and Text Overflow ........250
Multicolumn Elements and Regions .......251
What We’ve Just Learned ......254
Chapter 7: Commanding UI
Where to Place Commands .......257
The App Bar .........261
App Bar Basics and Standard Commands ......263
App Bar Styling ......272
Command Menus ..........274
Custom App Bars and Navigation Bars ......276
Flyouts and Menus......277
WinJS.UI.Flyout Properties, Methods, and Events .....279
Flyout Examples .......280
Menus and Menu Commands ........283
Message Dialogs ........288
Improving Error Handling in Here My Am! ......289
What We’ve Just Learned ........294
Chapter 8: State, Settings, Files, and Documents ........ 295
The Story of State ......296
Settings and State ....298
App Data Locations .....299
AppData APIs (WinRT and WinJS) .......301
Using App Data APIs for State Management ......310
Settings Pane and UI .......316
Design Guidelines for Settings ........317
Populating Commands .......320
Implementing Commands: Links and Settings Flyouts .....321
User Data: Libraries, File Pickers, and File Queries .....326
Using the File Picker ........327
Media Libraries .......336
Documents and Removable Storage........337
Rich Enumeration with File Queries....338
Here My Am! Update .......344
What We’ve Just Learned .....344
Chapter 9: Input and Sensors
Touch, Mouse, and Stylus Input ............347
The Touch Language, Its Translations, and Mouse/Keyboard Equivalents ..348
What Input Capabilities Are Present? ......355
Unified Pointer Events ...357
Gesture Events .......360
The Gesture Recognizer .....369
Keyboard Input and the Soft Keyboard ...........371
Soft Keyboard Appearance and Configuration ......371
Adjusting Layout for the Soft Keyboard .....374
Standard Keystrokes ...376
Inking .......377
Geolocation ........380
Sensors ....383
What We’ve Just Learned ....386
Chapter 10: Media
Creating Media Elements ......388
Graphics Elements: Img, Svg, and Canvas (and a Little CSS) ..390
Additional Characteristics of Graphics Elements ......393
Some Tips and Tricks .....394
Video Playback and Deferred Loading ....398
Disabling Screen Savers and the Lock Screen During Playback ...400
Video Element Extension APIs ....401
Applying a Video Effect ...402
Browsing Media Servers ......403
Audio Playback and Mixing ......403
Audio Element Extension APIs......405
Playback Manager and Background Audio ...406
Playing Sequential Audio .......410
Playlists ......411
Loading and Manipulating Media ....414
Media File Metadata .....414
Image Manipulation and Encoding ......423
Manipulating Audio and Video ..........429
Media Capture .........433
Flexible Capture with the MediaCapture Object ......435
Selecting a Media Capture Device ...439
Streaming Media and PlayTo ......440
Streaming from a Server and Digital Rights Management (DRM) .....441
Streaming from App to Network ........442
PlayTo ..............443
What We Have Learned .....446
Chapter 11: Purposeful Animations
Systemwide Enabling and Disabling of Animations ....450
The WinJS Animations Library .....451
Animations in Action ..........454
CSS Animations and Transitions .....458
The Independent Animations Sample ........463
Rolling Your Own: Tips and Tricks ......464
What We’ve Just Learned ..........469
Chapter 12: Contracts
Share ..........472
Source Apps......474
Target Apps ......480
The Clipboard .........491
Search......493
Search in the App Manifest and the Search Item Template ......496
Basic Search and Search Activation ........496
Providing Query Suggestions ..........499
Providing Result Suggestions ...503
Type to Search ......504
Launching Apps: File Type and URI Scheme Associations ...504
File Activation ......506
Protocol Activation ......508
File Picker Providers .........509
Manifest Declarations ........510
Activation of a File Picker Provider .....511
Cached File Updater ......518
Updating a Local File: UI ....521
Updating a Remote File: UI .....522
Update Events ......523
Contacts ........527
Using the Contact Picker .......529
Contact Picker Providers ........531
What We’ve Just Learned .......534
About the Author ........ 536
Survey........ 537
Bookscreen
Introduction
Welcome, my friends, to Windows 8! On behalf of the thousands of designers, program managers, developers, test engineers, and writers who have brought the product to life, I'm delighted to welcome you into a world of Windows Reimagined.
This theme is no mere sentimental marketing ploy, intended to bestow an aura of newness to something that is essentially unchanged, like those household products that make a big splash on the idea of "New and Improved Packaging!" No, Microsoft Windows truly has been reborn—after more than a quarter-century, something genuinely new has emerged.
I suspect—indeed expect—that you're already somewhat familiar with the reimagined user experience of Windows 8. You're probably reading this book, in fact, because you know that the ability of Windows 8 to reach across desktop, laptop, and tablet devices, along with the global reach of the Windows Store, will provide you with tremendous business opportunities, whether you're in business, as I like to say, for fame, fortune, fun, or philanthropy.
We'll certainly see many facets of this new user experience throughout the course of this book. Our primary focus, however, will be on the reimagined developer experience.
I don't say this lightly. When I first began giving presentations within Microsoft about building WinRT apps, as they are called (and also referred to as Windows Store apps in consumer contexts), I liked to show a slide of what the world was like in the year 1985. It was the time of Ronald Reagan, Margaret Thatcher, and Cold War tensions. It was the time of VCRs and the discovery of AIDS. It was when Back to the Future was first released, Michael Jackson topped the charts with Thriller, and Steve Jobs was kicked out of Apple. And it was when software developers got their first taste of the original Windows API and the programming model for desktop applications.
The longevity of that programming model has been impressive. It's been in place for over a quarter-century now and has grown to become the heart of the largest business ecosystem on the planet. The API itself, known today as Win32, has also grown to become the largest on the planet! What started out on the order of about 300 callable methods has expanded three orders of magnitude, well beyond the point that any one individual could even hope to understand a fraction of it. I'd certainly given up such futile efforts myself.
So when I bumped into my old friend Kyle Marsh in the fall of 2009 just after Windows 7 had been released and heard from him that Microsoft was planning to reinvigorate native app development for Windows 8, my ears were keen to listen. In the months that followed I learned that Microsoft was introducing a completely new API called the Windows Runtime (or WinRT). This wasn't meant to replace Win32, mind you; desktop applications would still be supported. No, this was a programming model built from the ground up for a new breed of touch-centric, immersive apps that could compete with those emerging on various mobile platforms. It would be designed from the app developer's
point of view, rather than the system's, so that key features would take only a few lines of code to implement rather than hundreds or thousands. It would also enable direct native app development in multiple programming languages, which meant that new operating system capabilities would surface to those developers without having to wait for an update to some intermediate framework.
This was very exciting news to me because the last time that Microsoft did anything significant to the Windows programming model was in the early 1990s with a technology called the Component Object Model (COM), which is exactly what allowed the Win32 API to explode as it did. Ironically, it was my role at that time to introduce COM to the developer community, which I did through two editions of Inside OLE (Microsoft Press) and seemingly endless travel to speak at conferences and visit partner companies. History, indeed, does tend to repeat itself, for here I am again!
In December 2010, I was part of small team who set out to write the very first WinRT apps using what parts of the new WinRT API had become available. Notepad was the text editor of choice, we built and ran apps on the command line by using abstruse Powershell scripts that required us to manually type out ungodly hash strings, we had no documentation other than functional specifications, and we basically had no debugger to speak of other than the tried and true document.writeln. Indeed, we generally worked out as much HTML, CSS, and JavaScript as we could inside a browser with F12 debugging tools, only adding WinRT-specific code at the end because browsers couldn't resolve those APIs. You can imagine how we celebrated when we got anything to work at all!
Fortunately, it wasn't long before tools like Visual Studio Express and Blend for Visual Studio became available. By the spring of 2011, when I was giving many training sessions to people inside Microsoft on building WinRT apps, the process was becoming far more enjoyable and far, far more productive. Indeed, while it took us some weeks in late 2010 to get even Hello World to show up on the screen, by the fall of 2011 we were working with partner companies who pulled together complete Store-ready apps in roughly the same amount of time.
As we've seen—thankfully fulfilling our expectations—it's possible to build a great WinRT app in a matter of weeks. I'm hoping that this present volume, along with the extensive resources on http://dev.windows.com, will help you to accomplish exactly that and to reimagine your own designs.