What is WPF (Windows Presentation Foundation)?

WPF is UI framework to implement responsive desktop apps & it build to take advantage of graphics hardware. WPF provides broad set of development features which includes extensible application markup language, data binding, controls, graphics, styles, animation, templates.

Implementation

Currently there are two way of implementing WPF app,

.NET version

This is open-source implementation of WPF application, mainly depend on .NET 5 (+ .Net core 3.1). To implement using .NET version, it requires minimum Visual Studio 2019

.Net Framework

.Net framework implementation requires minimum of Visual Studio 2008 (In this blog we will discuss implementation using .NET framework 4).

.NET Core is a cross-platform technology, although WPF isn't and only runs on Windows.
 

Markup & code-behindWPF allows you use both markup as well as code-behind application development.

Markup

WPF provide XAML to design user interface. You can use XAML to design windows, pages, dialog boxes, user controls. 

Here we have created one window and added one button to it. We can create other components as well like User Control, Page etc.
Below is the result of the window we have created.

Code-behind

Code-behind is part of development where we handle all the interactions with our app like click event, radio box selection, toolbar and menu item selection, etc.
Here we have defined click event on the button, which basically points to the method in code-behind being called when user clicks on the button.

code-behind file will look something like this.

Below is result for code we have added on click event.

Controls

WPF provides several pre-build controls to design & develop interactive user applications. Few of them are as listed below.

Layout

While creating a user interface we must need to arrange controls and display data in a specific format for better accessibility, for this, we can use inbuilt layout controls.
Grid, StackPanel, Canvas, WrapPanel, DockPanel, etc are laid out controls provided by WPF.

Here is an example of DockPanel usage.

Output:

Data Bindings

There are many cases where we need to show data to user through our application interface.
Consider we are accessing users profile data from SQL db and we need to show this profile information on UI.
We have created Person class with single property called Name & set the default value to it.

In our XAML we have define binding to the Name property. 

On the code-behind end, we have created a new object of person class & added it as data context to our current window. XAML uses data binding property used to bind data with our UI component. 

Recommendation: What’s New in .NET5 Framework

Why use WPF?

Theme & Styles

User experience with the interface is an essential part of all modern apps, which we can easily define using simple design tags for components. In traditional WinForm apps changing styles and theme is tedious task & require lots of rework. WPF allows developers to complete an entire application first without any style & theme applied and designer can design themes, layouts separately later on.
               Since WPF allows adding theme as an external resource we don’t need to re-compile our app when adding/modifying theme changes.

Separation of UI & Business Logic

WPF is designed to create loosely coupled app, where UI components and business logic can be created separately without depending on each other. You can use Model View View Model (MVVM) architecture in WPF which makes separation of UI & business logic much simpler.

Graphics & Animation

WPF allows developer to add custom animation code in code-behind as well as in XAMAL itself, which makes more convenient than traditional WinForm app.

Community & support

WPF has large community of individual developers as well as third party vendors designing ready to use custom controls. You can find lots of sample apps & demo projects for WPF and third party vendors also regularly updates their toolkit to support latest WPF development trend.

Creating your first app in WPF.

Step 1

Open Visual Studio & Select “Create New Project”

Step 2

Now you can either select WPF application for .NET core version or WPF App for .NET framework.
After selecting any one of these option click Next.

Step 3

On next screen you can define name of project, location of project on drive & development framework.
Once you choose all these simply click “create”.

Step 4

Visual studio default creates & opens this two files when creating new project.

• XAML File (MainWindow.xaml)
• CS File (MainWindow.xaml.cs)

XAML file has view split in two : Design window & XAML Tags.

Design window presents view of your current UI, You can choose to add controls here by drag-drop from the toolbox OR you can use XAML Tags to add controls to window.

MainWindow.xaml.cs contains the corresponding code behind the XAML design file.

Step 5

Drag ‘Label’ element from  tool box to design winodow. You can see XAML tag will be added automatically when you drop any control within design winodw. 

 Update Content to “First WPF App”.

Step 6

Click the “Start” button or hit the F5 key to run the application.

Step 7

You will see the window in the output