A Jumpstart to WPF
by Kevin Grossnicklaus
ArchitectNow
Agenda








Introduction
What is WPF?
Resources
XAML
Advanced Topics
Expression Blend
Silverlight?
Conclusion/Questions
Introduction

Kevin Grossnicklaus
o
ArchitectNow- www.ArchitectNow.net (2009-Present)
•
o
Washington University - CAIT Program (2003-Present)
•
o
Instructor
SSE - www.SSEinc.com (1999-2009)
•
•

President
Chief Architect
Software Development Practice Leader
Email: kvgros@architectnow.net
WHAT IS WPF?
Windows Presentation Foundation (WPF)?


User interface framework for Windows platforms
Replaces WinForms
o


Released in 2006 with the .NET 3.0 (NetFX) distributable
Designer support built into:
o
o
o
o


WinForms = Traditional .NET Windows Application framework
Visual Studio.NET 2005 (via Plug-In)
Visual Studio.NET 2008 (natively)
Visual Studio.NET 2008 SP1 (natively)
Visual Studio.NET 2010 (natively)
New set of controls and rendering engine
Requires Windows
Windows Presentation Foundation (WPF)?





WPF UI’s traditionally “declared” in XAML (more on this later)
Separation of UI and code
Better support for powerful graphic capabilities of newer hardware

Vector vs. Bitmap graphics

Scaling
Enhanced controls and control composition
Many improvements over the years of effort invested in traditional Windows development
technologies
WinForms vs WPF

Both…
o
o
o
o
o
…used to develop rich, client-side interfaces
… are extensible through custom controls
…promote a WYSIWYG design experience
…take advantage of the local client resources
…provide a significant number of controls and widgets used to build
up interfaces
•
o
Both built-in and 3rd party
…sit on top of the MFC classes that make up the current Windows
implementation
WinForms
o
o
o
o
Generally designed with manual layout of controls at fixed sizes and
positions
Generally supports the “traditional” grey UI typical of most current LOB
applications
Essentially a port of the traditional VB6 Windows development model to
the .NET Framework
Lacking in many areas
• Support for resolution independence
• Difficult to modify look or behavior of “built-in” controls
• No support for many of Windows common actions (i.e. cut, copy,
paste)
• Difficult to localize
• Difficult to represent documents
• Difficult to represent animations and other media rich content
WPF

UI’s built through composition of various containers
o




Containers determine the layout and sizing of children
UI’s defined in external XML based file format called XAML
Applications built with a mixture of XAML UI declarations and .NET code
behind files
Supports a much cleaner and more extensible model for UI widgets than
WinForms
Significantly enhanced built-in controls
WPF (Cont.)








Full application styling
Better localization support
Resolution independence (due to vector based nature of controls)
Integrated command pattern for custom commands or common
Windows commands
“Lookless” controls that allow for any controls look and feel to
replaced
Full Ink and Tablet support out of the box
Currently being enhanced and extended
Etc, etc…
WPF: CREATING A SIMPLE
APPLICATION
WPF AND XAML RESOURCES
WPF Resources

Links:
o
o
o
o
o
o
o
www.WindowsClient.net
www.CodeProject.com
www.CodePlex.com
http://www.codeproject.com/kb/wpf/
http://Wpf.codeplex.com
Control Browser:
http://mtaulty.com/CommunityServer/blogs/mike_taultys_blog/archive/2009/02/03/silverlight-wpfcontrol-browser.aspx
LearnWPF.Net
•

Books:
http://learnwpf.com/Default.aspx
WPF Tools


Visual Studio.NET 2008 SP1
Microsoft Expression Blend (Version 2.0 or 3.0)
o

KAXAML
o

http://www.kaxaml.com/
Tools Links:
o

http://www.microsoft.com/expression/
http://blogs.msdn.com/mswanson/articles/WPFToolsAndControls.aspx
CompositeWPF:
o
http://compositewpf.codeplex.com/
WPF Examples

Family.Show
o
o

Woodgrove Financial
o

http://scorbs.com/workapps/woodgrove/FinanceApplication.xbap
VantagePoint Demos
o

http://www.vertigo.com/familyshow.aspx
http://www.codeplex.com/familyshow (Code)
http://www.mobiform.com/VantagePointDemo/VantagePointDemo.xbap
Showcase Projects
o
http://windowsclient.net/community/showcase.aspx
INTRO TO XAML
XAML

XAML = eXtensible Application Mark-up Language
o

XML syntax for declaring runtime object model (and properties of any
object)
o



Rhymes with “Camel”
Supports hierarchical object model instantiation
XAML can be used to represent any object
XAML content is kept in separate files in your VS.NET Projects with
the extension of .XAML. This content is embedded into your projects
as resources and then read and parsed at runtime.
XAML IS NOT SPECIFIC TO WPF…WPF TAKES ADVANTAGE OF
XAML!
Syntax
System.Windows.Controls.Button b = new
System.Windows.Controls.Button();
b.Click += new System.Windows.RoutedEventHandler(button_Click);
b.Content = “OK”;
Vs.
<Button Content=“OK” Click=“button_Click>
Syntax 2
System.Windows.Controls.Button b = new
System.Windows.Controls.Button();
System.Windows.Shapes.Rectangle r = new
System.Windows.Shapes.Rectangle();
r.Width = 40;
r.Height = 40;
r.Fill = System.Windows.Media.Brushes.Black;
b.Content = r;
Vs.
<Button>
<Button.Content>
<Rectangle Height=“40” Width=“40” Fill=“Black” />
</Button.Content>
</Button>
WPF Containers



Relative vs. Fixed Positioning
Nesting of Controls
Some Common WPF Containers:
o
o
o
o
o
o
StackPanel
Canvas
DockPanel
TabControl
Grid
WrapPanel
XAML DEMO
ADVANCED XAML CONCEPTS
Some Advanced XAML and WPF Concepts








Attached Properties
Markup Extensions
Resources
Commands
DataBinding
Control Composition
Transforms
Styles
EXPRESSION BLEND
Microsoft Expression Blend



Tool in the new Microsoft Expression suite of designer packages
Full support for Visual Studio.NET project and solution files
Graphic designer focused tools for editing XAML files
WPF AND SILVERLIGHT
WPF and Silverlight

Silverlight is a Browser Plug-in that renders XAML and supports a significant portion of the
full WPF functionality
o
o

Both:
o
o
o

Full WPF is limited to Windows desktops with the .NET 3.0+ Framework
Silverlight runs on Mac OSX, Windows, and Linux (via Moonlight)
Are heavily built around XAML
Have significant built-in designer support within Visual Studio.NET
Can take advantage of external tools like Expression Blend for UX design
UI’s built for the full WPF can many times be pasted into Silverlight applications
WHAT’S NEXT?
Questions?
kvgros@architectnow.net
Conclusion
Thank you for coming!