A huge change in WPF and the way a developer creates a GUI for an application is XAML (eXtensible Application Markup Language). It's an declarative XML-based language used to describe an GUI in WPF or a workflow in Windows Workflow Foundation (WF).

Typically the XAML code would be generated through a designer like for example Microsoft Expression Blend or Microsoft Visual Studio. Of cause, you can write the code by hand. WPF allows for the definition of both 2D and 3D objects, rotations, animations, and a variety of other effects and features. Everything described in the XAML way could be expressed in a more traditional language of the .NET Framework, for example C#.

A great advantage of XAML is the separation of code which describes the GUI and the business logic. There is a way to include for example C# code direct into the XAML definition, but in "the normal" environment both code would be separated in different files (more about that in a few sentences). More advantages of XAML are:

• The GUI could change during runtime,
• A very easy way to implement different styles for the GUI,
• The GUI is extended with vector images and other things (2D, 3D),
• High user experience.

Another feature is XBAP (XAML Browser Application) and the possibility to view the results of an XAML file directly in the browser (Loose XAML). For XBAP and XAML you need the .NET Framework 3.0 or higher installed on the client machine (this is a difference between Silverlight).

Let me show you an example. The following picture is a little overview of the .NET Framework 3.0 and the new included APIs:

This image wasn't created with an conventional application like Paint, Photoshop or something else. As you can see, it's a real WPF application.

The next image is the WPF application I've created for the first image. You can see that's a real application.

1. Pure code applications without XAML,
2. Pure XAML applications without code (Loose XAML),
3. Mixed applications including XAML and code-behind-files.

Pure code:

In an application with pure code you can do everything as in XAML. There's nothing particular new to the "old" development with .NET 2.0 and Windows Forms. I think it's a little bit pointless, to use WPF without XAML. Of cause there are situations where you would use a WPF application without XAML. For example if you must generate the code dynamically at runtime.

Pure XAML:

An application with pure XAML is a great possibility to share a design while they're in draft or to show somebody (a customer for example) how the GUI would look like.
Pure XAML, also known as "Loose XAML", could be opened in the browser. You only need to install .NET 3.0 or higher on the client. But there are some limitations: Loose XAML couldn't contain code, because the code must be compiled to work, but to load and execute XAML in the browser it must be in plain text and no binary format. For that reason exists another solution.

Mixed applications:

Mixed applications with XAML and code-behind-files in an .NET language are, I think so, the typical usage of WPF in an application. With that approach you can easily split the GUI- from the business-logic. The XAML and the code are connected with partial classes, introduced in .NET 2.0.
Another type of mixed application is XBAP. A XBAP application is loaded in the browser and directly executed. Since it's compiled, you can, unlike "Loose XAML", use code-behind-files, process events for example and interact with the user.

Let me continue with the examples, shown above as screenshots:

First here is the code for the grid-layout:

XAML Grid-Layout (32 lines, approx. 2,89 KBytes)

This code paints the Borders with rounded corners, the shadows behind them (Borders too) and the text in the TextBlock elements. As you can see, the Borders with the TextBlock elements inside have two events: MouseEnter and MouseLeave. This events are used to display a little hover effect when the mouse enters the Border. To use this XAML code for an mixed application with an output type "WPF Application" we need only a few lines of code. The missing code for the example of the application is shown here:

Missing code for the WPF Application (8 lines, approx. 342 Bytes)

If you want to show the Grid in a browser, you need to modify the code a little bit for different reasons. The root element in the XAML code for a WPF application is a Window element. This represents a new Window, that can be initialized and shown, like a Form in Windows Forms 2.0. A browser don't know anything about a Window; it uses pages. The next code snippet shows the code you must use for a "Loose XAML" example that can be opened and shown in a browser. The complete list of changes is listed after the link:

Complete Loose XAML example (37 lines, approx. 2,84 KBytes)

Which changes I've made to use the Grid for Loose XAML:

1. I changed the root element from Window to Page and deleted the properties "WindowStartupLocation" and "ResizeMode", because this properties are useless in a page element.
2. I deleted the events "MouseEnter" and "MouseLeave". The event handlers are declared in a C# code-behind-file and this files need the application to be compiled. As we learned above, a Loose XAML Page can't be compiled.

Last but not least we can use the Grid code in a XBAP application. In Visual Studio 2008 we need therefor a new Project. In this project Visual Studio automatically adds a file for the Page and a code-behind file for, in this example, the event handlers programmed in C#.

In this way we used the same Grid, sometimes with little modifications, as an WPF Window Application, as Loose XAML and in a XBAP Application. This fascinated me just right from the moment I read about this. The same code for all application types. Great possibilities.

You can download the complete Visual Studio 2008 Solution here. It contains two projects, one for the WPF application and another for the XBAP application.