Windows Presentation Foundation!

Hey there Techxperts! This blog is about Windows Presentation Foundation. Windows Presentation Foundation is a GUI Framework developed by Microsoft to be used with the .NET framework (a Software Development Language Framework). Let us take a flash back about GUI in case you were sleeping or snoozed in your software development class. GUI is Graphical User Interface that represents how a user interacts with an application. Without a pre-defined GUI framework, a developer would have to create each and every component themselves which can take so much more time and effort. You probably have heard enough ranting about User Interface and User Experience now that you would often wonder why it so important to have a separate framework for it!

Back in the day’s computers were rare and only used by IT professionals. The software applications built back then were made according to the mind set of those IT professionals only but nowadays every nook and corner has a digital computer in the form of a personal computer, tablet, smart phone or laptop. With the wide use of digital devices, the interfaces made for the applications were made sure to be understandable to every kind of user. The User Interface should never be too simple that it makes an expert user annoyed and cannot be too complex that it confuses or frustrates a naïve user to quit the application. That is why it has become an undeniable fact that User Interface (UI) and User Experience (UX) are one the most essential aspects while developing any kind of applications nowadays. Even when there were not any digital devices the concept of UI/UX was there. The typewriter was made keeping in view size and length human fingers can cover and the press.

Windows Presentation Foundation’s Architecture:

Microsoft introduced Windows Presentation Foundation (WPF) back in 2006 in its .NET Framework 3 release. Before that other User Interface Frameworks were offered by Microsoft from which one of the most famous one is Windows Forms. Although Windows Presentation Foundation is the latest one, Microsoft is maintaining Windows Forms. Previous Graphical User Interfaces like Windows Forms and MFC (Microsoft Foundation Class Library) were just wrappers around the User32 and GDI32 DLLS but Windows Presentation Foundation is a prominent part of .NET Framework rather than just being a wrapper it has managed and unmanaged code. To understand it more efficiently following image depicts the Windows Presentation Foundation’s Architecture:

The major components of Windows Presentation Framework’s Architecture are:

· Presentation Framework

· Presentation Core

· Milcore

The first two components i.e., Presentation Framework and Presentation Core have been developed in managed code (under CLR’s control/developed within .NET Framework). The Common Language Runtime provides features such as memory management, error handling etc. to make the development process more efficient and productive. On the other side the Milcore is unmanaged code (not under CLR’s control/developed outside .NET Framework) which allows tight integration with DirectX’s displaying and rendering.

Windows Presentation Foundation vs Windows Forms:

As mentioned above that Windows had Windows Forms as a GUI Framework before Windows Presentation Foundation, you folks definitely have the query in mind that why there was the urge to make Windows Presentation Foundation when there was already a Graphical User Design Framework present as Windows Forms. Why just not improve the pervious one instead of releasing an entirely new framework? What make the new one better than the pervious one?

WinForms can be depicted as just a layer on top of the Windows Controls, but Windows Presentation Foundation has been built from outset and does not necessarily depends upon Windows Controls. In more simpler terms we can say that in earlier frameworks there was no separation between the behavior and presentation of User Interface. Both GUI and behavior were controlled by a single language i.e., C# or VB.NET which took more time as well as more efforts from developers. But with Windows Presentation Foundation users are able to design the User Interface elements with XAML and the behavior of application can be controlled using programming languages like C# and VB.NET. That is how the developers and designers can easily distinguish between the GUI look and behavior.

As soon we will engage in more depth, you will realize how Windows Presentation Foundation is more about working and creating Graphical User Interface doing things in its own original way rather than doing it the Windows way.

Windows Presentation Foundation Features:

Windows Presentation Foundation is no doubt one of the most featured frameworks for developing Graphical User Interfaces. Of many great features some are listed below:

Getting Started with WPF:

The environment setup for using WPF is quite simple all you need to do is to install an IDE that supports C# and XAML. For Windows Presentation Foundation we will be using Visual Studio as most of the developers are familiar with it. You just have to download the Visual Studio Community from the visual studio’s site and get going with the installation process. Use the link below to go to the download page of Visual Studio Community download your respective version and install the application.

https://visualstudio.microsoft.com/vs/community/

For those of you who are keen on following the absolute right instructions a detailed installation process describing link has been added below. Just make sure to follow the same exact steps and you will end up doing just fine!

https://docs.microsoft.com/en-us/visualstudio/install/install-visual-studio?view=vs-2019

Creating and Designing you first Windows Presentation Foundation Application:

If you have ever been in development, you will already know that the first program that a developer writes is the printing of a Hello World program. Guess what Techxperts, we are going to do the same. In your very first interaction with the Windows Presentation Foundation, we will be creating a Graphical User Interface for printing Hello World.

1. After you are done installing the Visual Studio Community open the application and Select the Create Project Option (Duh, pretty easy right?).

2. Now the next windows will appear, you will see plenty of options to develop different type of applications based of what programming language or technology stack you want to use. Search for WPF and select the option as shown in the figure below:

3. Now set up the project name, its destination/path and the solution name.

4. There you will see a MainWindow.xaml tab. We are going to write all of our code in that particular tab.

5. Now before writing any code we will see various XAML information key words and their roles:

The XAML Code:

Above mentioned information is pretty much the basic tags and namespaces we’ll use in this tutorial. If you have studied web development, you’d have already have a slight knowledge of what tags are. The < > contains certain keywords which perform certain objects/functions. < > represents the starting of a function/object and </> represents the ending of a function/object. Most of the name of the objects are self-explanatory and can be understood by their name, for example the “textblock” tag defines a text containing block.
Now that we have the information (table) and basic understanding of the XAML code let us take a look at how the “Hello World!” printed GUI is made using WPF.

The Hello World Output:

Click on the start/debugging icon (green play button) or press F5. If your code is free of errors, it will show the out like this:

Wolllaaaah! There you go. You have your first basic WPF XAML based Graphical User Interface that displays the Hello World Text Box.

I know the technical details right now will be pretty blur to you guys. I’ve tried to cover more details in the review video which will revise your basic concepts about the things we’ve discussed above. The video also covers more details about the code we’ve used to display the graphical user interface in more detail so don’t forget to watch the video below.