Hardcore WPF (Windows Presentation

Foundation)

casey chesnutbrains-N-brawn.com

Madison .NET 11/06

Source

• Fundamental demos– http://www.brains-n-brawn.com/artifacts/

HardcoreWPF.zip

• /backRow demo– http://www.brains-N-brawn.com/backRow/

brains-N-brawn.com

• Pervasive Computing– Tablet PC (MVP 03)

– Compact Framework (MVP 04)

– Advanced Web Services (MVP 05)

– Media Center (MVP 06)

– Speech– Location Based Services– Artificial Intelligence– 3D

Which of these would you like to see?

OUTLINE

• Overview

• Fundamentals – demos!

• Application Models

• /backRow demo!

OUTLINE : Overview

Now

• GDI (20 years), GDI+, WinForms

• DirectX (11 years), Direct3D

• Quartz, DirectShow (8 years)

• Problems– Showing their age– Each API is different– Mixing APIs is challenging

Which of these have you worked with?

Next Gen

• WPF – replaces GDI

• Direct3D – large games, used by WPF

• Media Foundation – ultimately will replace DirectShow

• MCML –markup language for Media Center Edition applications

• XNA – small games

WPF

• Compositing– UI, Documents, Media, 3D, Browser, …

• Declarative programming with XAML markup• For Designers and Developers• Rewritten from scratch

– Built on top of Direct3D– Hardware accelerated– Vector based– Resolution independent (1/96 inch)– Retained graphics

Platforms

• Vista• XP SP2• Server 2003 SP1

• Renders the same on each• Remote Desktop transport• Subsets of WPF (XPS, WPF/E) will make

it to other platforms

Tiers

• Tier 2 – DirectX 9, Shader 2.0, 128 megs video ram (hardware rendering)

• Tier 1 – DirectX 7, 32 megs video ram (mixed hw/sw rendering)

• Tier 0 – below (software rendering)

• Defaults to 60 fps

• Anti-aliasing

Timeline

• Pillar of .NET 3.0– Class libraries built on .NET 2.0– WPF, WCF, WF, InfoCard– Past Release Candidate– Go-live licenses available

• Released with Vista

• “Orcas”, .NET 3.X coming after that

Installation

• Visual Studio 2005

• .NET 3.0 (pre-installed with Vista)– Runtime

• Windows SDK– MSBuild, XAMLPad, samples

• Orcas extension for VS 2005– Visual designer, schemas, project templates

Tools

• Windows SDK– XAMLPad, Perforator, UISpy, XPS Conformance,

WICExplorer• VS 2005

– Orcas Extensions (beta)• Electric Rain Zam 3D• Mobiform Aurora• Microsoft Expression

– Graphics Designer– Interactive Designer

• “Orcas”, Cider

XAMLPad

Microsoft Expression Interactive Designer

OUTLINE : Fundamentals

• XAML, Application, Navigation, Layout, Content, Data Binding, Dependency Property, Styles, Templates, Controls, Events, Shapes, Documents, Imaging, BitmapEffects, Animation, Media, Brushes, 3D

XAML

• Declarative object instantiation• Not exclusive to WPF• Separates UI and logic

– Common language for Designers and Developers– Parallel development– Localization, Branding– Targeted UI (devices, users, …)

• Tool support• Supports C# and VB.NET

HelloWorldXamlPage

HelloWorldCodePage

Application

• Global

• Message handling

• App events (e.g. startup, shutdown)

• NavigationService

• Properties collection

• StartupUri

VS.NET WPF app from scratch

DragDrop Cider controls from Toolbox

XAML

• Object elements, Attribute syntax• Property elements, Abbreviated syntax• Content syntax• Attached properties, Attached events• Markup extensions

– Binding syntax, Resource syntax

• Xml Namespaces• Code-behind vs Inline vs Code-only

XamlSyntax

Window

• Window

• NavigationWindow

• Page

MainWindowTransparency

Navigation

• NavigationWindow and Frame

• Hyperlink

• NavigationService

• URI, fragment support

• Events

• Journal

• PageFunctions

http://localhost/PageNavigation/PageNavigation.xbap

Events

• RoutedEvents– Tunneling (Preview*) and Bubbling

• ElementTree

• Stylus support for Tablet PCs

• Attach handler in XAML or Code

• Styles/Templates can handle events

• Bind to element with Name or x:Name

Layout

• Dynamic sizing and positioning• Panels are key

– Grid, StackPanel, DockPanel, WrapPanel, Canvas, …

• Alignment– Stretch (Size to container)– Left, Right, Center (Size to content)

• Margin (parent) and Padding (content)• Overflow

– Clip, Wrap, Scroll, Scale

PanelLayout

Content

• Rich Content– ContentControl– HeaderedContentControl– ItemsControl– HeaderedItemsControl

ToolTip

Interop

• HwndSource, HwndHost

• Interops with WinForms, Win32, DirectX, …

• ActiveX interop is through WinForms interop

• Cannot share airspace, so compositing will not work

InteropWinForm

Data Binding

• Data models : XML, Objects, DataSets, WCF, LINQ, …

• Binding syntax• DependencyProperty• DataContext, DataTemplate• INotifyPropertyChanged,

INotifyCollectionChanged• Modes : OneTime, OneWay, TwoWay,

OneWayToSource

TwoWayBinding

DependencyProperty

• Value depends on some other property– User for DataBinding, Styles, Animation, …

• Validation

• Inheritance

• AttachedProperties

• Default values

Styles

• Similar to CSS

• Resources

• Setters

• Triggers

• Inheritance

• … Templates

• … Animation

StyledButton

Templates

• Controls are built based on their functionality

• The default template can be changed to radically change how the control renders

• The goal is to avoid having to create user drawn controls

TemplateButton

Controls

• Comes with a set of standard set of common controls for UI

• UserControl– Simple reusable control– Similar to application development

• Control– Provides templating– For reuse between many applications

VS.NET Toolbox

Shapes

• 2D Geometric Shapes– Ellipse– Line– Path– Polygon– Polyline– Rectangle

Shapes

Documents

• Flow vs Fixed (XPS)• Packaging• Document viewing• Typography

– ClearType– OpenFont– Font can be deployed with an Application

• Printing• Annotating

FlowDocument

File – Print - XPS

Imaging

• BMP, JPEG, PNG, TIFF, WDP, GIF, ICON• BitmapFrame• Rotation• Image, BitmapImage for XAML• CroppedBitamp, FormatConvertedBitmap• Clipping• Stretching• Metadata

Imaging

BitmapEffect

• Applied to Visuals

• Can be chained

• Blur

• OuterGlow

• DropShadow

• Bevel

• Emboss

BitmapEffect

Animation

• Dependency Properties

• Animation Types : Double, Color, String, Point, Int32, Path, …

• Targets : From, To, By

• Time based : duration, repetition, start times, …

• Storyboards : pausing, stopping, resume

• Key-Frame support

AnimatedButton

Media

• Audio

• Video

MediaInk

Brushes

• SolidColorBrush

• Gradients– LinearGradientBrush– RadialGradientBrush

• ImageBrush

• DrawingBrush – vector and bitmap

• VisualBrush – any Visual!

Brushes

3D

• Basic 3D Support• Viewport3D• Cameras• Models• Materials• Lights• Transforms• Hit Testing• Animations

ThreeD

OUTLINE : App Models

• Loose XAML

• Windows Application

• XBAP / WBA

• WPF/E

• XPS

Loose XAML

• XAML without any code

• Opens in IE

• Can be dynamically generated

Applications

• Windows application

• EXE with a Window or NavigationWindow

• Installed

• Offline and Online

• Full access

XBAP / WBA

• Hosted in a browser, IE6 and above– Other browsers, FireFox with a plugin

• Online only

• Internet zone permissions

• Embed in webpage using IFrame– Cannot interact with hosting page

• Media Center, Sidebar Gadgets

WPF/E

• Multiple browsers– Browsers IE5.5+, Mozilla, Firefox, Opera,

Safari

• Multiple platforms– MS : Win2K+, MAC OS X 10– 3rd party : Linux, Solaris

• Multiple devices– Desktop, PPC, SP

WPF/E

• Subset of WPF e.g. no 3D

• Shooting for 2 meg runtime install

• Object tag for embedding in HTML

• WPF + JScript, IL

• Public beta bits are late (Q3 06), browser release (1st half 07), device support (2nd half 07)

XPS

• XML Paper Specification

• Subset of WPF

• Fixed immutable layout

• Zip format with resources

• Viewers can be ported to other platforms– Open package specification– XPS

• Vista printer spool format

OUTLINE : /backRow Demo

• brains-N-brawn.com/backRow/

Resources

• Books– Applications = Code + Markup– Programming Windows Presentation Foundation – XAML in a Nutshell

• Forum

Windows Presentation Foundation ("Avalon“)• Newsgroup

microsoft.public.windows.developer.winfx.avalon

Resources

• Webcastshttp://sessions.mix06.com

• eLearning

Developing Rich Experiences with Microsoft® .NET Framework 3.0 and Visual Studio® 2005

• SamplesC:\Program Files\Microsoft\SDKs\Windows\v6.0\

Samples\WPFSamples.zip

Resources

• Sites– http://wpf.netfx3.com/– WPF Windows SDK Documentation– My Five Day Course For Hitting the WPF

Curve/Cliff – www.brains-N-brawn.com/backRow/

Questions