A Lap Around Windows Presentation Foundation

Why hasn’t UX taken off in software?

It’s It’s Difficult!Difficult!

Animation

2D3D

Documents

Styled Controls

Video Windows Forms

MFC

Win32

HTML

DirectX

Data Binding

Windows Presentation Foundation provides…

Unified approach to UI, Documents, Unified approach to UI, Documents, and Mediaand Media

Integration as part of developmentIntegration as part of development

and experienceand experienceIntegrated, vector-based composition Integrated, vector-based composition engineengine

Utilizing the power of the PCUtilizing the power of the PC

throughout the graphics stackthroughout the graphics stackDeclarative programmingDeclarative programming

Bringing designers directly intoBringing designers directly into

application developmentapplication development

Three “real-life” WPF Applications

Windows Presentation Foundation…

““Windows Presentation Foundation is the future of Windows Presentation Foundation is the future of Windows presentation technology”Windows presentation technology”

WPF is great for…WPF is great for…

Web sites that want to push the limits of user experiencesWeb sites that want to push the limits of user experiences

Windows applications with complex data visualization Windows applications with complex data visualization scenariosscenarios

However, other technologies are often still better choices However, other technologies are often still better choices todaytoday

Windows FormsWindows Forms is still the best solution for is still the best solution for mainstream rich client Windows applicationsmainstream rich client Windows applications

DirectXDirectX is still the platform for extremely intensive is still the platform for extremely intensive graphics (games, CAD applications)graphics (games, CAD applications)

ASP.NETASP.NET is the reach solution for server-based is the reach solution for server-based platform-agnostic applicationsplatform-agnostic applications

Architecture

What is XAML?eeXXtensible tensible AApplication pplication MMarkup arkup LLanguageanguage

Declarative markup language forDeclarative markup language fordescribing user interfacesdescribing user interfaces

Why Declarative?

vs.vs.

<Button Background="Red">Hello World!</Button><Button Background="Red">Hello World!</Button>

Button btn = new Button();btn.Background = Colors.Red;btn.Content = "Hello World!";this.Children.Add( btn );

Button btn = new Button();btn.Background = Colors.Red;btn.Content = "Hello World!";this.Children.Add( btn );

Designer Developer

Why have XAML?

First Look at XAML

Types of WPF applications

Hosted in IE7Hosted in IE7 Installed on user’s Installed on user’s systemsystem

Partial trustPartial trust Full trustFull trustLimited control of Limited control of windowwindow

Full control of windowFull control of window

Online onlyOnline only Online / OfflineOnline / OfflineBest deployed with Best deployed with ClickOnceClickOnce

Deployed with Deployed with ClickOnce or MSIClickOnce or MSI

BrowserBrowser InstalledInstalled

A Browser-Based WPF App

LayoutCanvasCanvas

StackPanelStackPanel

DockPanelDockPanel

WrapPanelWrapPanel

GridGrid

Layout Models in WPF

ControlsAll standard controls representedAll standard controls represented

Some new controlsSome new controls

Classes are unique to Windows Classes are unique to Windows Presentation FoundationPresentation Foundation

System.Windows.Controls, System.Windows.Controls, not not ssystem.Windows.Forms.Controlsystem.Windows.Forms.Controls

StyleLookless controlsLookless controls

Provide default look-and-feel, can be Provide default look-and-feel, can be overriddenoverridden

Logical Tree vs. Visual TreeLogical Tree vs. Visual TreeLogical tree is a binary representation of Logical tree is a binary representation of the source XAMLthe source XAML

Visual tree is a scene graph which contains Visual tree is a scene graph which contains all the rendering data needed to compose all the rendering data needed to compose the pagethe page

Override the Visual Tree to style Override the Visual Tree to style controlscontrols

Logical and Visual Trees

<StackPanel><StackPanel>

<ListBox><ListBox>

<ListBoxItem><ListBoxItem>CatCat</ListBoxItem></ListBoxItem>

<ListBoxItem><ListBoxItem>DogDog</ListBoxItem></ListBoxItem>

</ListBox></ListBox>

<Button><Button>Hello World!Hello World!</Button></Button>

</StackPanel></StackPanel>

ActionsTriggersTriggers

Allow some UI events to be handled by Allow some UI events to be handled by XAML, rather than code-behindXAML, rather than code-behind

Useful for things like “mouse over” effectsUseful for things like “mouse over” effects

EventsEventsControls support all standard events such Controls support all standard events such as click, key press, selection changed, etcas click, key press, selection changed, etc

Events are handled in a code-behind file Events are handled in a code-behind file using either C# or VBusing either C# or VB

Controls / Styles / Actions Triggers

Data BindingTargetTarget

Any property, any elementAny property, any element

SourceSourceCLR ObjectCLR Object

WPF ElementWPF Element

ADO.NETADO.NET

XMLXML

Multiple modelsMultiple modelsOne TimeOne Time

One WayOne Way

Two WayTwo Way

Control

“Data Item”

Property

Binding

Property

Putting it all together

XPS ContentFixed DocumentsFixed Documents

High-fidelity fixed layout for precise High-fidelity fixed layout for precise printing and viewingprinting and viewing

WYSIWYGWYSIWYG

ContentFlow DocumentsFlow Documents

Paginated, multi-column rich textPaginated, multi-column rich text

XPS Content

Co-existence with Windows Forms

WPF ships with technology allowing forWPF ships with technology allowing forthe creation of “hybrid” applications the creation of “hybrid” applications

containing containing bothboth WPF and WPF and Windows Forms content.Windows Forms content.

Goals of “Crossbow”

Preserve existing Windows Forms Preserve existing Windows Forms investmentsinvestments

Leverage existing ActiveX and 3Leverage existing ActiveX and 3rdrd party party controlscontrols

Allow customers to migrate to WPF at Allow customers to migrate to WPF at their own pace, avoiding total rewritestheir own pace, avoiding total rewrites

“Crossbow” TechnologyServices to support co-existenceServices to support co-existence

Unit conversionsUnit conversions

Focus and Keyboard managementFocus and Keyboard management

““Extensible property” managementExtensible property” management

Two “host” controlsTwo “host” controls

WindowsFormsHostWindowsFormsHost

ElementHostElementHost

Simultaneous data source bindingSimultaneous data source binding

Extend Visual Studio’s designersExtend Visual Studio’s designers

Limitations to “Crossbow”

Limited to only one top-level controlLimited to only one top-level controlHowever, that control may be a container However, that control may be a container for many childrenfor many children

Windows Forms controls will always Windows Forms controls will always appear atop WPF controlsappear atop WPF controls

Limitation to Z-Order logicLimitation to Z-Order logic

Windows Presentation Foundation Resources

Dev Center GuidelinesDev Center Guidelineshttp://msdn.microsoft.com/windowsvista/experience/http://msdn.microsoft.com/windowsvista/experience/

Windows Presentation Foundation Windows Presentation Foundation HomeHome

http://msdn.microsoft.com/windowsvista/building/presentation/http://msdn.microsoft.com/windowsvista/building/presentation/default.aspxdefault.aspx

Microsoft ExpressionMicrosoft Expressionhttp://www.microsoft.com/products/expression/en/http://www.microsoft.com/products/expression/en/default.mspxdefault.mspx

Interop / MigrationInterop / Migrationhttp://msdn.microsoft.com/winfx/reference/presentation/http://msdn.microsoft.com/winfx/reference/presentation/default.aspxdefault.aspx