Windows 8 App Development with XAML New version

  • Slides: 34
Download presentation
Windows 8 App Development with XAML

Windows 8 App Development with XAML

New version coming soon! �Updated for Silverlight 5 �Over 115 recipes (that’s 30 extra!)

New version coming soon! �Updated for Silverlight 5 �Over 115 recipes (that’s 30 extra!) �Extended to about 700 pages (that’s 250 extra!) �Covering WP 7, MVVM, RIA Services and much more! �More info:

This is the road to development on Windows 8 In this part. . .

This is the road to development on Windows 8 In this part. . . �Styling and templating �Data in your Windows 8 apps �Getting data �Data binding �The Application Lifecycle (Copyright 2010 Windows Phone 7) �Tiles and more (Copyright 2010 Windows Phone 7) �IO’ing in Metro apps

This is the road to development on Windows 8 Covered in Part 1. .

This is the road to development on Windows 8 Covered in Part 1. . . �General XAML stuff for Windows 8 �Old and new controls �Finding your way with navigation See www. silverlightshow. net for the recording!

Default styles �Project templates provide great starting point for Metro style �Default styles are

Default styles �Project templates provide great starting point for Metro style �Default styles are included �Familiar XAML styling and resource dictionaries �Works in the same way �Dark and light resource dictionaries

Dark and light themes �Controls are styled by their control template �Resource Dictionaries containing

Dark and light themes �Controls are styled by their control template �Resource Dictionaries containing dark and light styles �Dark styles are default �Recommended for media apps, such as photos or video �generic. xaml �Light styles can be switched to quickly �Recommended for text-based apps �light_generic. xaml

Get your style right! �Windows 8 provides great controls through the platform (we’ve seen

Get your style right! �Windows 8 provides great controls through the platform (we’ve seen that earlier) �Controls can be styled, breaking down their parts �Properties �Set foreground color to blue �Templates �Change the structural appearance of a control �Visual States �Define how a control looks in a specific state

Styling remains the same as well. . . �Explicit styles (keyed) � Apply the

Styling remains the same as well. . . �Explicit styles (keyed) � Apply the style to the target when requested by key name � Great for unique styles �Based. On styles �Inherit from an explicitly keyed style �Implicit styles �Apply the style to all instances of the Target. Type �Ideal for app wide styling of a control type

Templating in Windows 8 �Metro style look and feel �Change the control to suit

Templating in Windows 8 �Metro style look and feel �Change the control to suit you �Properties �Visual States �Content

Visual State Manager (again) �Visual states give controls (and your app) a great feel

Visual State Manager (again) �Visual states give controls (and your app) a great feel �Define your app’s behavior �Change appearance �Transforms �Easing �Key. Frames �Animations

Working with data is similar to Silverlight and WP 7 �It involves �Getting data

Working with data is similar to Silverlight and WP 7 �It involves �Getting data �Working asynchronously �Using the data �Binding �Parsing �. . .

Getting data �Working with services is preferred in most cases �Relational databases should be

Getting data �Working with services is preferred in most cases �Relational databases should be behind a service �Local app storage �App has its own storage directory �Can access local file system

Supported service scenarios �Use �XML-over-HTTP �JSON-over-HTTP �ASMX Web Services �Sockets �o. Data �(no RIA

Supported service scenarios �Use �XML-over-HTTP �JSON-over-HTTP �ASMX Web Services �Sockets �o. Data �(no RIA Services at this point )

Working async gets easier �await keyword makes things easier �Doesn’t block UI thread �Doesn’t

Working async gets easier �await keyword makes things easier �Doesn’t block UI thread �Doesn’t require the ugly Dispatcher. Begin. Invoke(() => …);

Now what to do with the data? �LINQ is fully supported �Data binding to

Now what to do with the data? �LINQ is fully supported �Data binding to controls �We saw a lot of new controls �Old controls support data binding as well �Optionally grouping the data

Data binding �Data binding is the infrastructure that links properties of controls with properties

Data binding �Data binding is the infrastructure that links properties of controls with properties on your data objects �Can be done in XAML or via code �Binding actions enable customization of the binding logic �Value converters �Binding modes �One. Way, Two. Way, One. Time �All this stuff remains the same as it was before! �Not everything that is supported in data binding in WPF, SL and WP 7 is currently supported �Might change �Currently SL 4 options are supported more or less

Data templates �Enables re-usable declarative XAML to define data binding behavior and presentation �Can

Data templates �Enables re-usable declarative XAML to define data binding behavior and presentation �Can define the template for the panel in which the contents will appear �Can define the template for the items themselves

Application lifecycle

Application lifecycle

When the app is about to be shut down �On. Suspending event on app

When the app is about to be shut down �On. Suspending event on app object is your chance �Understanding user’s intentions for save �Utilize familiar serialization mechanisms available in XAML Metro style apps

Suspending and saving //Suspension. Manager. cs can be found in SDK Samples async protected

Suspending and saving //Suspension. Manager. cs can be found in SDK Samples async protected void On. Suspending(object sender, Suspending. Event. Args args) { Suspending. Deferral deferral = args. Suspending. Operation. Get. Deferral(); await Suspension. Manager. Save. Async(); deferral. Complete(); }

Resuming the application �Resuming event on app object �App still lives in resident memory

Resuming the application �Resuming event on app object �App still lives in resident memory �Scenarios around rehydrating live data Activating an app �Provide content to your Window �Determine Previous. Execution. State for lifecycle management �Navigate your app to desired view based on activation type �Activate your Window to dismiss Splash screen

Activation events �On. Launched �User invokes app from Tile or Notification �On. Search. Activated

Activation events �On. Launched �User invokes app from Tile or Notification �On. Search. Activated �User selects your app from search pane �On. Sharing. Activated �User selects your app from share pane �On. File. Picker. Activated �User selects your app via File. Picker to select files from �On. File. Activated �User selects file your app has a registered handler for

You all remember tiles from WP 7? �Represents the app while not active �It’s

You all remember tiles from WP 7? �Represents the app while not active �It’s a view in the application that engages the user �Can be updating and alive with activity �Easy to create and update! �Draw users back into your app over and over

2 types of tiles: regular ones � Tap on tile to launch or switch

2 types of tiles: regular ones � Tap on tile to launch or switch to an app � Static default tile specified in app manifest � Two sizes: � Both sizes can have live updates

2 types of tiles: Live tiles �Tiles updated using pre-defined templates �Templates provide rich

2 types of tiles: Live tiles �Tiles updated using pre-defined templates �Templates provide rich rendering options �Text-only, image-only or combination �JPEG or PNG only, max size 150 KB �Local or cloud updates �Can even use the Push Notifications

Badges �Overlays status on top of tile �Supports square and wide tiles �Number up

Badges �Overlays status on top of tile �Supports square and wide tiles �Number up to 99 or pre-defined glyph: �Always legible on top of images Badge

Secondary tiles �Tiles created by “pinning” content from app �Pin initiated by app via

Secondary tiles �Tiles created by “pinning” content from app �Pin initiated by app via simple runtime call �User confirms pin operation via system UI �Exposes a personalized surface for app �Same capabilities as app tiles �Launch leads to relevant content

Can I touch your file please? �Metro apps are more or less like Silverlight

Can I touch your file please? �Metro apps are more or less like Silverlight when it comes to storage �Files can be �App data (specific for the application) �Local on the machine �On a device or a network �On the web �Depending on the location, different restrictions and access model are in place

App data �Your Metro app has FULL access on its local folder: �C: Users<user_name>App.

App data �Your Metro app has FULL access on its local folder: �C: Users<user_name>App. DataLocalPackages< package> �Can create, delete, modify… files �Accessible via Application. Data. Current. Local. Folder

Library access �If your app wants access to a library on the device, it

Library access �If your app wants access to a library on the device, it needs to specify this in the manifest �Forget this to get an System. Unauthorized. Access. Exception �Music, Picture and Video libraries: nothing extra needed �Documents Library: also requires filetypes to be specified

I need to access C: temp �Sorry, no can do! �Only accessible via the

I need to access C: temp �Sorry, no can do! �Only accessible via the File. Picker API �Remember, about the same in Silverlight

Thank You

Thank You