Windows Presentation FoundationWindows Presentation Foundation

Adam Calderon

Principal Engineer

Interknowlogy LLC

adamc@interknowlogy.com

http://blogs.interknowlogy.com/adamcalderon

The next generation of Windows Forms

What is What is WPFWPF

Windows Presentation Foundation is Microsoft's unified presentation subsystem for Windows, and is exposed through WinFX and XAML. It consists of a display engine and a managed-code framework.

Windows Presentation Foundation unifies how Windows creates, displays, and manipulates documents, media, and user interface (UI), enabling developers and designers to create visually stunning, differentiated user experiences

What is WinFxWhat is WinFxWinFX is Windows Vista's managed-code programming model, building on and extending the .NET Framework. WinFX offers both practical solutions to today's software challenges and new opportunities to create software and services not possible now. It enables both developers and designers to quickly create new applications and experiences that are more reliable and secure, visually stunning, smarter about information management, better connected, and more collaborative.

What is XAMLWhat is XAML

XAML is a markup language that declaratively represents user interfaces for Windows applications, improving the richness of the tools with which developers and designers can compose and repurpose UI.

For Web developers, XAML provides a familiar UI description paradigm. XAML also enables the separation of UI design from the underlying code, enabling developers and designers to work more closely together.

Sample XAMLSample XAML<Window x:Class="WindowsApplication1.Window1" xmlns="http://schemas.microsoft.com/winfx/avalon/2005" xmlns:x="http://schemas.microsoft.com/winfx/xaml/2005" Title="WindowsApplication1"> <Grid> <Label VerticalAlignment="Top" HorizontalAlignment="Left“ Grid.Column="0" Grid.ColumnSpan="1" Grid.Row="0" Grid.RowSpan="1“ Margin="32,37,0,0" Width="115.63" Height="23" Name="label1">Hello World</Label> </Grid></Window>

WPF Application TypesWPF Application Types

Windows ApplicationWindows Application– Standard single window typeStandard single window type– Browser navigation typeBrowser navigation type

Browser ApplicationBrowser Application– Runs in a sandbox with “Internet Permissions”Runs in a sandbox with “Internet Permissions”

LayoutLayout Basics Basics

Panels layout childrenPanels layout children

Size to contentSize to content

AlignmentsAlignments

MarginsMargins

PaddingPadding

Content OverflowContent Overflow

Panels – How you layout formsPanels – How you layout forms

DockPanelDockPanel– Allocates the entire edge of the panel area to each Allocates the entire edge of the panel area to each

childchild

StackPanelStackPanel– Lays out children in a vertical or horizontal stackLays out children in a vertical or horizontal stack

GridGrid– Arranges children within a gridArranges children within a grid

CanvasCanvas– Performs no layout logic. Puts children where you tell Performs no layout logic. Puts children where you tell

it to.it to.

ControlsControls

EventsEvents

CommandsCommands

Built-In ControlsBuilt-In Controls

Control Events (Routed Events)Control Events (Routed Events)

BubblingBubbling– Starts at the current element and bubbles up to the Starts at the current element and bubbles up to the

current element’s parent and that elements parent current element’s parent and that elements parent and so on [MouseLeftButtonDown]and so on [MouseLeftButtonDown]

TunnelingTunneling– Works opposite of bubbling and starts at the root Works opposite of bubbling and starts at the root

element and works down to the originating element element and works down to the originating element [PreviewMouseLeftButtonDown][PreviewMouseLeftButtonDown]

DirectDirect– Works like standard .NET event handling with only Works like standard .NET event handling with only

direct handlers being notified of events [Click]direct handlers being notified of events [Click]

Working with EventsWorking with EventsHalting EventsPrivate void Grid_ButtonDown(object sender, RoutedEventArgs e)

{

//do something here

e.Handled = true;

}

Determining the TargetPrivate void Grid_ButtonDown(object sender, RoutedEventArgs e)

{

// who is the originator MessageBox.Show(((System.Windows.Controls.Control)e.OriginalSource).Name);

}

CommandsCommands

Logical action that can be invoke in Logical action that can be invoke in several waysseveral ways

Based on the RoutedCommand ClassBased on the RoutedCommand Class

Uses both event tunneling Uses both event tunneling [PreviewExecuteEvent] and event [PreviewExecuteEvent] and event bubbling [ExecuteEvent]bubbling [ExecuteEvent]

Standard Command ClassesStandard Command Classes

ClassClass Command TypesCommand Types

ApplicationCommandsApplicationCommands Commands common to almost all Commands common to almost all applications. Includes clipboard applications. Includes clipboard commands, undo and redo and document commands, undo and redo and document level operations (open,close,print,etc..)level operations (open,close,print,etc..)

ComponentCommandsComponentCommands Operations for moving through information Operations for moving through information such as scroll up and down, move to end, such as scroll up and down, move to end, and text selectionand text selection

EditCommandsEditCommands Text editing commands such a bold, italic Text editing commands such a bold, italic and alignmentand alignment

MediaCommandsMediaCommands Media-playing operations such as Media-playing operations such as transport (play,pause,etc..), volume transport (play,pause,etc..), volume control and track selectioncontrol and track selection

Built-In ControlsBuilt-In Controls

Not wrappers around old Win32 controlsNot wrappers around old Win32 controlsNative WPF controlsNative WPF controlsSupport styling, resolution independence, data Support styling, resolution independence, data binding, composition and full binding, composition and full support for WPF graphic support for WPF graphic capabilitiescapabilitiesIncludes Most Standard ControlsIncludes Most Standard Controls– ButtonsButtons– Slider and ScrollSlider and Scroll– Text Controls (Textbox, Label)Text Controls (Textbox, Label)– Menus and ToolbarsMenus and Toolbars

Data BindingData Binding

Simple Field level Data BindingSimple Field level Data Binding

Complex Data Binding to multiple controls Complex Data Binding to multiple controls at a time (Master/Detail/Detail)at a time (Master/Detail/Detail)

Client-Side Sorting and FilteringClient-Side Sorting and Filtering

Support for binding to Objects, XML and Support for binding to Objects, XML and Relational data sourcesRelational data sources

Simple Data BindingSimple Data Binding

Simple Data Binding using Business Simple Data Binding using Business ObjectsObjects

Support for two-way synchronization in Support for two-way synchronization in simple objects via the simple objects via the INotifyPropertyChanged interfaceINotifyPropertyChanged interface

Implicit and Declarative binding via the Implicit and Declarative binding via the DataContextDataContext

Complex Data BindingComplex Data Binding

Binding to ListsBinding to Lists

Supports two-way data binding to list if list Supports two-way data binding to list if list inherits from ObservableCollection<T>inherits from ObservableCollection<T>

Data TemplatesData Templates

SortingSorting

FilteringFiltering

Master/Detail/DetailMaster/Detail/Detail

Multiple Data SourcesMultiple Data Sources

Object Data SourceObject Data Source

XML Data SourceXML Data Source

Relational Data SourceRelational Data Source

StylesStyles

Used for both Elements (Controls) and Used for both Elements (Controls) and Data TemplatesData Templates

Can be used to set properties (Font) or Can be used to set properties (Font) or define the way an object looksdefine the way an object looks

Different types: Inline, NamedDifferent types: Inline, Named

Can target a specific type and can Can target a specific type and can inherited like CSS. inherited like CSS.

Window1.xaml.csWindow1.xaml.cs

Contains:Contains:Application logicApplication logic

Created by:Created by:Application developerApplication developer

Window1.xamlWindow1.xaml

Contains:Contains:Principal UIPrincipal UI

(controls, layout, etc.)(controls, layout, etc.)

Created by:Created by:Application developer Application developer

oror designer designer

Design Experience:Design Experience:By hand or using a By hand or using a

visual toolvisual tool

Styles.xamlStyles.xaml

Contains:Contains:Application “style”Application “style”

(visual description of (visual description of UI elements)UI elements)

Created by:Created by:Application designerApplication designer

Design Experience:Design Experience:By hand or using a By hand or using a

visual toolvisual tool

Laying out files with Styles in MindLaying out files with Styles in Mind

Data model, event names, Data model, event names, element names, etc.element names, etc.

Resource names and Resource names and element types.element types.

TriggersTriggers

Property TriggersProperty Triggers

Data TriggersData Triggers

Event TriggersEvent Triggers

What else is in WPFWhat else is in WPF

Control TemplatesControl Templates

ResourcesResources

GraphicsGraphics

AnnimationAnnimation

Custom ControlsCustom Controls

Integration with VS2005 ControlsIntegration with VS2005 Controls

ClickOnce DeploymentClickOnce Deployment

ResourcesResources

Programming Windows Presentation Foundation (by Chris Sells and Ian Griffiths)

http://www.amazon.com/gp/product/0596101139/qid=1136144280/sr=8-1/ref=pd_bbs_1/102-9584211-5272153?n=507846&s=books&v=glance

WinFx December CTP

http://msdn.microsoft.com/windowsvista/getthebeta/default.aspx

Windows Vista Developers Center

http://msdn.microsoft.com/windowsvista/default.aspx

Windows Presentation Foundation Forum

http://forums.microsoft.com/MSDN/ShowForum.aspx?ForumID=119&SiteID=1