BlackWaspTM

This web site uses cookies. By using the site you accept the cookie policy.This message is for compliance with the UK ICO law.

Windows Presentation Foundation
.NET 3.0+

Windows Presentation Foundation

This is the first in a series of articles describing the use of Windows Presentation Foundation (WPF), a powerful technology for creating Microsoft Windows-based, smart client software. The tutorial begins with an overview of the benefits of WPF.

What is WPF?

Windows Presentation Foundation, hereafter referred to as WPF, is a Microsoft technology that allows you to create rich user interfaces for your Windows desktop applications. WPF was introduced with the .NET framework version 3.0 as an alternative technology to Windows Forms.

WPF aims to allow you to create much richer user experiences than you can easily develop with Windows Forms. To achieve this, WPF completely changes the underlying display technology selection. Whereas Windows Forms was based upon the pixel-based Graphics Device Interface (GDI), WPF utilises the vector-based systems of DirectX.

As most modern video cards support DirectX, WPF applications allow scaling and rotating of text and vector-based images without pixellation. You can incorporate two and three-dimensional vector graphics and animation, which automatically uses the available hardware acceleration for improved performance. You can also use WPF for business applications that do not require such graphical flourishes. For example, Visual Studio 2010 and 2012 include user interfaces developed using WPF.

Extensible Application Markup Language

You can create WPF layouts using the Visual Studio designer. As with Windows Forms, you can drag and drop controls from the toolbox onto a design surface for a Window. When you create your user interface designs in this manner, Visual Studio generates code using a new language named, "Extensible Application Markup Language". This is abbreviated to XAML, pronounced "Zamm Ell".

Unlike with Windows Forms, WPF does not hide the code that the designer generates. The XAML code is easy to view and, as it is XML-based, simple to understand. In fact, it is so easy to work with that you are actively encouraged to edit it manually. In many cases it is easier to work with the XML elements and attributes directly than to create the same results with a designer. Throughout the tutorial we will concentrate on the XAML, rather than working with the designers, as this allows greater understanding of the technology.

XAML has wider applications than the creation of WPF user interfaces. It is also the basis for designing Silverlight interfaces, Windows Phone software and applications for Windows 8 tablets. There are differences between the various XAML-based technologies but learning one variant makes the transition to others easier. We'll be concentrating on the WPF version of XAML, as it is the only one that allows you to create applications with full access to the Microsoft Windows operating system features.

Separation of Concerns

A great feature of WPF, and XAML-based applications in general, is the separation of the user interface and the other code in your software. Windows Forms applications are heavily reliant upon events, with event handlers tied to the visual controls. WPF separates the XAML code, which defines the design of an application, and the background code, which you create using a .NET language such as C#.

Although you can wire up code to control events, it is more common to take advantage of XAML's powerful data binding and commanding technologies. These allow you to loosely reference properties and methods by name in XML attributes. At runtime, controls are configured according to the named properties. Buttons and other controls are connected to commands that execute in response to user actions, with the state of linked controls changing automatically depending upon the availability of the commands.

The design and code are so loosely linked that it is possible for different people to work on these separate elements. For example, a developer can create the classes containing properties to bind to and commands to execute with no knowledge of the user interface design. With minimal details of the underlying code available, a user interface designer can create the XAML separately for the developer to integrate into the project later. Microsoft even created separate tools for these two roles. Developers are encouraged to use Visual Studio whilst designers have the Expression Studio tools, including Blend.

A further separation of concerns is provided by styling. Using a similar concept to the separation of content and style in web pages that is provided by HTML and CSS, you can define styles using XAML and apply them to multiple controls. For example, if you decide that all buttons in your software should be red and have bold text, you could define a style for this and add the style to all buttons. If you later decide that blue would be a better colour, you can update the style in one place and all the controls that use the style will take on the new look.

Improved Controls

WPF changes the way that user interface controls work. Most of the controls that Windows Forms developers are comfortable with have equivalents in WPF. The controls still include properties that allow you to change their look and behaviour, such as colour and font options. For simple applications, this can be sufficient.

To allow for more modern experiences, WPF controls are much more powerful. Firstly, they are composable. This means that you can nest controls within each other. For example, a button need not include just a text description. You could include a graphical element to go with the text. A drop-down list can be more than a series of textual items. Each user-selectable option could be an image, an animation or even a video.

WPF controls are based upon templates. A template is defined using XAML and includes all of the graphical elements that allow a control to function correctly. For example, a button's template includes the background colours, shading, lines, curves and content areas that make up a button. This information is present for each state of a button, such as the enabled, disabled, focussed, mouse-over and pressed states. The template also includes the details for animated transitions between states.

When creating your applications you can modify the templates of existing controls. This allows you to change the look and feel of the standard controls to match the design of the software you are developing.

Multimedia

Windows Forms was quite limited in its support for multimedia. WPF corrects this with standard controls for images, audio and video. Audio and video can be played in various formats and integrated into controls using control composition. You can easily include multimedia that plays automatically or that is controlled by user actions.

21 January 2013