WPF Tutorial for Beginners: Learn in 1 Day
What is WPF?
WPF is a short abbreviation of Windows Presentation Foundation. It is an ideal framework for building Windows applications. The idea behind the introduction of WPF framework was that user could develop a rich user interface comprising of 3D, animation, rich color with minimum code complexity.
WPF can be considered as an evolution over WinForms. It produces easy to operate graphical display system for windows. It offers easy separation between UI and the business logic.
WPF is a vector-based rendering engine uses hardware acceleration of modern graphics cards which makes the Ul faster and highly scalable. WPF applications can be deployed in your system as a standalone desktop program or hosted as an embedded object in a website.
There are many reasons for using WPF platform some prominent ones are-
- An ideal platform to use if you require to deal with various media types
- WPF allows you to create a skinned user interface. It also helps you when you need to load portion of the UI or want to bind XML data
- It allows you to take the benefit of the large .NET class library as it is built on .NET technology
- Resolution independence, so application developed using WMF can be run on mobile devices or a 20-inch monitor
- WPF builds on DirectX instead of WinAPI. It offers the client computer’s graphics system. Therefore, offering greater graphic rendering power
- Supports a flow document model which enables “desktop publishing” quality of the layout
- Appearance and behavior are loosely coupled. This allows designers and developers to work on two separate models
- In WMF framework you can graphically design tools on simple XML documents instead of parsing code
- Allows you to use hardware acceleration for drawing the GUI, for better performance
History of WPF
Windows 1.0 was the first GUI environment from Microsoft. It is working as a layer on top of DOS, relying on the GDI and USER systems for graphic and user interface.
DirectX was introduced in the year 1995, as a high-performance graphics system. It was aimed at games and other graphics related environments. Over the years there are many versions released with Directx9 that provides a library to use with mange.Net code.
|WPF version||Release Year||.Net Version||Visual Studio Version||Features|
However, WPF development can be done with VS 2005.
|3.5||2007||3.5||VS 2008||Modification and improvements in:|
Application model, binding, controls, documents, annotations, and 3-D Ul elements.
|3.5 SP1||2008||3.5 SP1||N/A||Native splash screen support. New web browser control, DirectX pixel shader support.|
|4.0||2010||4.0||VS 2010||New controls: Calendar. DataGrid, DatePicker. Multi-Touch and Manipulation|
|4.5||2012||4.5||VS 2012||Faster setup time and improved performance for Bitmap effects. New controls: Calendar. DataGrid, DatePicker.|
Multi-Touch and Manipulation
|4.5.1||2013||4.5.1||VS 2013||New Ribbon control|
New INotifyDataErrorlnfo interface
|4.5.2||2014||4.5.2||NA||No Major Change|
No Major Change
|4.6||2015||4.6||VS 2015||Transparent child window support|
HDPI and Touch improvements
Features of WPF
- Documents and Printing
- Security, Accessibility & Localization
- Offers Interoperability with Windows Forms controls
- Direct3D is used in graphical applications where performance is important
- Uses the video card hardware for rendering
- Vector-based graphics allows you to scale your application without loss of quality
- WPF supports floating-point logical pixel system and 32-bit ARGB color
- Redefine Styles and Control Templates
- Building international fonts from composite fonts
- WPF text rendering helps you to takes advantage of ClearType technology
- Allows you to use the caching technique of pre-rendered text in the video memory
- Resource-based Approach for every control
- Presentation timers are initialized & managed by WPF
- The relationship between video and animation is also supported
- In WPF a style is a set of properties which should be applied to content used for visual rendering
- Templates in WPF helps you to change the Ul of your document
- Commands are more abstract and loosely- coupled version of events
- WPF support for commands reduces the amount of code we need to write
WPF Core Types and Infrastructures
Classes in WPF are divided into four different types:
These classes, known as base element classes. It provides the foundation for a model of composing user interfaces.
WPF user interfaces are composed of elements which are assembled in a tree hierarchy. It is called the element tree. The element tree is an intuitive way to layout user interface. It is a structure which allows you to get the feature of powerful UI services.
Extensible Application Markup Language which is called “XAML”, or “zammel” is a declarative way to define user interfaces.
Here is the XAML definition of a simple button:
<Button FontSize="16" HorizontalAlignment="Center" VerticalAlignment="Center" > Say Hello </Button>
Advantage of using XAML language:
- XAML separating front-end appearance from back-end logic
- XAML is the easiest method to represent user interfaces
- XAML is work effectively with tools
WPF framework supports many useful controls like:
- Editing controls like TextBox, CheckBox, RadioButton
- List controls such as ListBox, ListView, TreeView
- User information such as Label, ProgressBar, ToolTip
- Action such as Menu, Button, and ToolBar
- Appearances such as Border, Image, and Viewbox
- Common dialog boxes such as OpenFileDialog and PrintDialog.
- Containers such as TabContro, ScrollBar, and GroupBox
- Layouts like DocPanel, StackPanel, and Grid
- Navigation such as Frame and Hyperlink
The appearance of controls can be customized with styles and templates without programming. You can also create a custom control by deriving a new class from an appropriate base class.
WPF provides a feature for customizing the appearance of your application. It allows you to set objects and value for things like fonts, backgrounds, etc.
The styles feature allows you to standardize on a specific look for the entire product. It allows you to replace the default appearance while retaining its default behavior.
Data template allows you to control the default visualization of the bound data. With the help of themes, you can easily visualize styles from the operating system.
Layout & Panels
Layout helps you in proper positioning and sizing control. It is part of the process of composing the presentation for the user. The WPF framework eases the layout process and offers better adaptability of the UI appearance.
The layout infrastructure is offered by various classes are
1) StackPanel 2)DockPanel 3) WrapPanel 4) Grid and 5) Canvas
WPF provides an improved graphics system like
- WPF uses device-independent units, enabling resolution and device independence. Therefore, each pixel, which is device-independent, automatically scales with the dots-per-inch setting system
- WPF uses double instead of float and supports a wider array of colors
- The WPF graphics engine is designed in such a way that it can take advantage of graphics hardware when available
Documents and Printing
WPF framework offers three types of documents:
- Fixed documents: This type of document supports WYSIWYG presentation.
- Flow documents: Allows you to adjust and reflow content based on run-time variables like window size and device resolution.
- XPS documents: It is a paginated representation of electronic paper in an XML- based format. XPS is an open source and cross-platform document format.
WPF enables better control over the print system. It includes remote printing and queues. Moreover, XPS documents can be printed directly without converting it into a print format.
WPF is a part of the .NET framework. It contains both managed and unmanaged code. The important components of WPF architecture are explained in the below-given figure:
The most important components of part of WPF architecture are −
- PresentationFramework: Helps you to create top-level elements like Controls, styles, layout, windows, etc.
- PresentationCore: It holds base types such as UIElement, Visual from all Controls and shapes are Derived in PresentationFramework.dll.
- CLR: It makes the development process productive by offering features like memory management, error handling, etc.
- Milcore: Milcore is a part of the unmanaged code which offers tight integration with DirectX.
- DirectX: It is the low-level API which allows rendering graphics of WPF. DirectX talks interact with drivers and render the content.
- User32: It is the is a core API which is widely used by many programs. It manages memory and process separation. User32 helps you to decides which element will be placed where on the screen.
- Kernel: Input originates as a signal on a kernel mode device driver and gets routed to the correct process and by connecting with Windows kernel and User32.
Building Your First WPF
In this section, we will develop a basic WPF application. So, let’s start the simple implementation by following the steps given below.
Step 1) In Visual Studio Go to File > Project
Step 2) In the new project window
- Select WPF App
- Enter Name as “MyWPF”
- Click OK
Step 3) Visual Studio creates two files by default
- XAML File (MainWindow.xaml)
- CS File (MainWindow.xaml.cs)
The MainWindow.xaml has
- A Design Window
- XAML File
In the XAML windows, the following tags are written be the default
The Grid is the first element by default.
The MainWindow.xaml.cs contains the corresponding code behind the XAML design file
Step 4) In toolbox,
- Drag TextBox element to the design window
- A TextBox will appear in the design window
- You will see XAML code for TextBox added
Step 5) Change text to “First WPF Program.”
Step 6) Click the Start Button
Step 7) You will see a Window at Output
Congratulations! You have designed and created your first WPF application.
WPF vs. WinForms
It’s a newer framework, so it is more in tune with current standards.
It’s older, so it is more tried and tested.
It’s flexible and features rich. You can design very rich applications without coding or buying controls.
Not so feature rich
Developers of 3rd party controls are focussed on compatibility with WPF as it’s the future.
There are many third-party controls that you can buy or get for free.
XAML allows you to create and edit your GUI easily. It allows the work to be split between a designer (XAML) and a programmer (C#, ASP.net, etc.).
In Windows Forms all the code written in one place.
WPF can create user interfaces for both Windows applications and web applications like Silverlight and XBAP.
No such support
WPF’s in-box control suite is limited
In-box controls are very powerful
Type of Applications built with WPF
- WPF is trying to replace webforms and windows forms – apps can be built to run in a browser or a standalone window
- Windows Forms and WPF pages can co-exist in the same application
- You can develop page/window applications
- WPF is a short abbreviation of Windows Presentation Foundation
- It is an ideal platform to use if you require to deal with various media types
- Windows 1.0 was the first GUI environment from Microsoft which was working on DOS and relying on the GDI and USER systems
- WPF offers Interoperability with Windows Forms controls
- WPF are divided into four different types like UIElement, FrameworkElement ContentElement & FrameworkContentElement
- The most important components of part of WPF architecture are PresentationFramework, PresentationCore, CLR, Milcore, DirectX, User32, and Kernel
- WPF is a newer framework compares WinForms, so it is more in tune with current standards
- Windows Forms and WPF pages can co-exist in the same application