1. Technology

WPF Introduction - Tutorial One

XAML and WPF

By

Normally when I write tutorials, I start by knowing a decent amount on the subject and filling in the gaps. This time, I'm writing this tutorial purely for myself (and sharing it!), to summarize and focus on the relevant stuff.

I've decided that 2013 is the year when I learn WPF. So I'm going to learn it from books, web articles etc, and experiment and write each tutorial based on that knowledge.

Think of it as another set of C# Tutorials. If you don't know C# then please start with C# for beginners. Want to see how to do things in C#?

I've not really looked at WPF before but (a) I've had to develop for it at work (but way more more C# than WPF) and (b) the growing realization that it's a major part of Windows 8. It's going to be around for quite a while, so time to learn it with all its subtleties.

What is WPF?

Short for Windows Presentation Foundation, WPF is a computer-software graphical subsystem for rendering user interfaces in Windows-based applications. (Thanks Wikipedia!).

It's part of .NET and simply put is an alternative and more advanced GUI compared to Winform which is the traditional "Gray boxes" user interface that Windows Apps have had for many years.

Or as I've heard it described, WPF is a set of objects that make it easier to build cool controls.

As I write this the current version of WPF is 4.5. It was introduced in 2006 at version 3 and has been part of Microsoft Vista, Windows 7 and 8.

Particularly important things to bear in mind with WPF.

  • It's built upon Direct3D and uses hardware acceleration for drawing graphics. It can draw in software if the hardware support isn't there but when it is, it takes advantage of it.
  • It lets you use controls made up of other controls, much more than ever possible with WinForms. User Interfaces can be very colorful, sophisticated and well just fancy.
  • XAML (pronounced "Zammel") lets you use declarative programming to define user interfaces and how they interact. This can include animation as well.

What do I program WPF in?

Currently C# in XP and Windows 7 but I understand in Windows 8 that C++, JavaScript and Visual Basic.NET can also be used to develop for it. The common and very important part of WPF is XAML which is a very clever, powerful and complex form of XML. It's possible to write complex GUIs in XAML without a line of C# code.

XAML is short for "eXtensible Application Markup Language". You can write WPF applications 100% in code with no XAML but in these tutorials, we'll be using XAML.

Introducing XAML

If you've lived under a rock for the last twelve years you may not be familiar with XML (not XAML). XML short for Extensible Markup Language is a Unicode text document that describes and may contain structured data made up of elements and attributes.

XAML is XML but describes the mapping of elements and attributes to objects, properties and values of properties. If you want to know more about XAML, this PDF link will download an 86 page open specification from Microsoft.

Viewing/Using XAML

Internet Explorer will let you view XAML and execute it. Try creating a text file, rename it to ex1.xaml and paste this in.

<Label xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" Content="David Wrote This"/>

Now open it in Internet Explorer and you'll see the text displayed. This is the same as if you'd written this C#:

System.Windows.Controls.Label lbl = new System.Windows.Controls.Label();
lbl.Content = “David Wrote This”;

Then of course you'd have to compile and run that C#. If we had used say a button and added a Click event then we'd need to hook up the XAML to a C# method to handle the code.

Namespaces

In C# the concept of namespaces is common. It's a place to declare classes, structs, interfaces, enums, delegates and other namespaces. These may have the same name as other classes etc declared in other namespaces but the namespace makes them globally unique.

David.Sort is not the same as Fred.Sort Where there is a Sort method in both David and Fred namespaces.

In WPF controls the namespace is accessed by the xmlns (short for XML namespace) declared by the control. So you'll find Labels and buttons declared in the "http://schemas.microsoft.com/winfx/2006/xaml/presentation". It looks like a URL but is the name of the namespace.

There's one namespace used as the root object in a XAML file and a second one is needed as well. You'll often see this at the top of most XAML files.

<Window xmlns=”http://schemas.microsoft.com/winfx/2006/xaml/presentation”
     xmlns:x=”http://schemas.microsoft.com/winfx/2006/xaml”>

The second namespace is mapped to System.Windows.Markup that defines all the XAML keywords.

In the next tutorial, I'll look at Attribute properties and type converters.

  1. About.com
  2. Technology
  3. C / C++ / C#
  4. C# / C Sharp
  5. Learn C Sharp
  6. WPF Introduction - Tutorial One

©2014 About.com. All rights reserved.