Windows Store App Development

Transcription

1 Windows Store App Development C# AND XAML PETE BROWN 11 MANNING SHELTER ISLAND

2 contents preface xvii acknowledgments xx about this book xxii about the author xxviii. about the cover illustration xxix If Hello, Modern Windows 1 -U- 1.1 Setting up the development environment Configuring the project 3 The device pane 5 * Template solution items Create the first Hello World UI Integrating with Twitter 9 The Tweet class 10* Updated UI JO* Code-behind Testing on different devices and resolutions 13 Debugging on the Simulator 13 * Debugging on a remote device Summary 18 The Modern UI Design inspiration 20 Direct influences 21 * Finding your way 22 vii

3 2.2 Governing principles Typography The importance of the layout grid Design for touch but not only for touch Modern apps on Windows 8 28 Consumer and enterprise apps elements and states Device considerations Key Windoius 8 UI Desktop or laptop 33 Tablet and smaller devices 33 Hybrid devices Summary 34 The Windows Runtime and.net Windows Store app system architecture 36 The sandbox 38 Deployment and the Windows Store 39 The driver model COM +.NET metadata = WinRT 41 COM: back to the future 42 Metadata 44 Projections Client technologies and languages A brief tour of WinRT and.net Summary 50 XAML Elements and namespaces 52 Objects as elements 52 Namespaces Properties 56 Property syntax 56 Dependency properties 58 Attached properties 61 Property paths Object trees and namescope 62 Object trees 63 Namescope Summary 68 Layout Multipass layout measuring and arranging 70 The measure pass 71 The arrange pass 71 The Layoutlnformation class 73

4 5.2 UIElement layout properties 74 Width and Height, plus ActualWidth and ActualHeight 75 Horizontal and vertical alignment 77 * Padding 78 Margins Layout rounding Performance considerations 82 Keeping the tree shallow 82 * Caching 83 Visualization 83 * Sizing and positioning Summary 84 Panels Canvas 87 Positioning in X, Y space 88 * Controlling the Z position using ZIndex 89 * Sizing child elements StackPanel and VirtualizingStackPanel Grid 94 Setting the orientation 92 ' Sizing children 93 Virtualizing for perfomiance 93 Defining rows and columns 95 * Adding and positioning elements in rows and columns 97* Using alignment and margins for sizing and positioning Creating a custom panel 102 Project setup 102 The OrbitPanel class 103* Orbits dependency property 103 * Orbit attached property 105 Custom layout Summary 111 Brushes, graphics, styles, and resources Brushes 113 Solid-color brushes 113 * Gradient brushes 116 Image brushes Resources 120 Local and page resources 121 * Application resources 123 Resource dictionaries Styles 127 Explicit or keyed styles 127 * Style inheritance 128 Implicit styles 130

5 7.4 Vector graphics 132 Line 132 Polyline 134 Paths 135 Rectangles and ellipses Bitmap images Summary 139 Displaying beautiful text Text basics 143 TextBlock 144 Inlines 146 Wrapping, ellipsis, and alignment 147 Character spacing 150 Line spacing Rich and multicolumn text 153 Rich text 154 Multicolumn and linked text OpenType text 160 Ligatures 160 * Stylistic sets 161 Font capitals 163 Fractions and numbers 164 Variants, superscript, and subscript Embedding fonts Summary 168 Controls, binding, and MWM The Model-View-ViewModel pattern 172 Using an MWM toolkit like M WM Light The model 175 The chat data service 176 The MainViexvModel and CameraVieivModel classes 178 The vietv Binding primer 183 The source and target 184 Binding mode 185 Change notification 186 " DcitaContext Entering and displaying text 190 Working with the TextBox 191 * Experimenting with the PasswordBox 192 Spell checking and, autocorrect UI element binding using sliders Working with lists 197 Observable collections 197 * Items controls 198 Data templates Making things happen with buttons and commands 200 Button and commands 201 HyperlinkButlon 203 RadioButton and CheckBox 204

6 9.7 Converting data with value converters Summary 209 View controls, Semantic Zoom, and navigation PhotoBrowser demonstration app setup 213 Creating the project 214 Creating the Photo model class 215 Loading pictures using a service class 215 Creating the MainViewModel 217 * Skeleton UI XAML and code-behind ListView and GridView 220 Vertical lists 220 * Horizontal lists and grids Grouping with the GridView 226 Grouping in the model and, viexmnodel UI layer FlipView and navigation Grouping at Vieiumodel 232 Category browser page 232 Updated. Main Page Semantic Zoom Summary 239 The app bar Project updates Controls on the bottom app bar 246 Adding and styling buttons 246 Wiring with > commands 250 Visibility and pinning Top app bar for navigation App bar popups and menus Summary 263 The splash screen, app tile, and notifications Splash screens 267 The static splash screen screens * Extended splash 12.2 Default tiles on the start page Secondary or pinned tiles 276 Creating the tile 277 Activating the app xuith the secondary tile 281

7 12.4 Tile notifications or live tiles 284 Simple text notifications 285 Images in notifications 288 Queuing multiple tile notifications Toast notifications 294 Creating the notification service 295 Enabling toast Summary 299 View states Full, filled, and snapped views The LayoutAwarePage The snapped view for the main page Visual states for view management Detail pages and app bars 309 Creating an appropriate presentation app bar Summary 317 Contracts: playing nicely with others Sharing Fixing up the Sharing your data 321 Letting others share with you Letting others search your data 332 Declaring your intentions 332 The results page and viewmodel 333 m Responding to in-app search requests 338 Responding to external search requests Summary 340 Working with files Loading files programmatically 343 New demonstration project 343 " File access permissions 34 7 Storage files and folders 348 * Using a data template selector 351 * Using file queries 354 Creating files and folders URI formats Working with file pickers 361 Using the file open picker source contract Summary Implementing the file picker

8 xiii Asynchronous everywhere Why asynchronous is important Working with lasync* WinRT methods 373 async and await: the simplest approach 374 * Long-form asynchronous operations 376 * Getting progress updates 378 Canceling the operation Working with tasks 381 Basic task operations 382 * Canceling the task 384 Conveiiing between WinRT lasync* and, Tasks Summary 387 Networking with SOAP and RESTful services Networking basics 389 Solution setup 390 * Downloading a file with HttpClient Sharing your model 393 Create the source class library 395 * Create the Modem apji compatible class library Consuming SOAP services 398 Creating the service service Referencing and using the 17.4 Structuring your client code using MWM 401 Creating the viewmodel user interface * Creating and wiring up the 17.5 Consuming data from RESTful services 406 Creating the RESTful service 407 Getting data from, the service using the viewmodel, 410 * Specifying the acceptable datatype DeserializingJSON and XML data 412 XML deserialization using XmlSerializer deserialization * JSON 17.7 Updating data using PUT, POST, DELETE, and more Summary 421 A chat app using sockets Chat app viewmodel 425 r Th,e MainViewModel class 426 * Chat,Message model class 429

9 18.2 The user interface 429 XAML skeleton 430 Styles and resources 431 App bar buttons 432 Chat app content Listening for connections Connecting to the server and sending data 439 Connecting to an endpoint 440 Sending data Refactoring for better structure and flexibility 441 The updated ChatMessage class 442 The 1MessageService interface 444 The TcpStreamMessageSeruice class 447 Updated MainVieiuModel Trying out UDP sockets 458 Creating the UdpMessageService class 459 Listening for connections 460 Connecting to another machine 461 Receiving and parsing messages Summary 464 A little UI work: user controls and Blend Updated game UI 466 Basic changes 466 * Play field area 468 Orientation and view states Designing the ship UI 470 Creating the UserControl 471 Creating the ship shape in Blend 472 Adding a label Building out the ship user control properties 476 Enabling rotation 477 * Setting the color 479 Temporarily testing the Ship control Summary 481 Networking player location Updating the" Player model 483 The PlayerLocation class class The collection of players * The updated Player Initializing the collection 486 Displaying players with an ItemsControl 488 Testing the collection 489 Wiring up the collection to service events 490

10 XV 20.3 Updating the TCP stream message service 491 Updated message service interface 491 * Sending location information 493 Reading location information Testing everything Summary 498 Keyboards, mice, touch, accelerometers, and gamepads Making input generic 502 The UnputService interface 502 * A little math help 504 Wiring up the vieiumodel Keyboard input 507 The KeyboarclInputService 508 * Virtual keys 510 Adding from the code-behind Pointer input: mouse, touch, and pen 513 Some more math 513 * A minor modification to the ship user control 517 * The PointerlnputService class 517 Adding from the code-behind Accelerometer input 522 Making sense of the input 523 * Implementing the AcceleivmeterlnputService 524 * Adding from the codebehind 525 * Accelerometer events 526 * Dealing with screen autorotation Xbox 360 gamepad input and a little C Creating the C++project 527 * Implementing the Controller class 529 * Creating the UnputService wrapper 532 Adding from the code-behind 534 * Compiling and deploying Summary 535 App settings and suspend/resume App settings UI and architecture 538 Creating the settings infrastructure settings UI Persisting and using settings * Creating a Loading and saving settings values 550 * Acting on the options 553

11 22.3 Suspend and resume 554 Suspending your app 554 Resuming activity Summary 557 Deploying and selling your app Testing for certification Sideloading for testing purposes 563 Packaging an app for sideloading 563 Getting a developer license luithout Visual Studio 565 Installing the side load app package Enabling trial mode 567 Creating the mock license data for testing 567 Checking the license state Listing your app in the Windows Store 570 Getting a Windows Store account 570 Reserving an app name 570 Submitting the app for review and approval Summary 573 index 5 75