Master pages in ASP.NET 2.0 is one of the most used and important feature. Master pages allows to create a consistent look and feel of all the pages in the ASP.NET application. Unfortunately, there is no concept of master pages or master windows in Windows Presentation Foundation. In this article we are going to learn one easy way to create the master page equivalent in WPF
Introduction:
Master pages in ASP.NET 2.0 is one of the most used and important feature. Master pages allows to create a consistent look and feel of all the pages in the ASP.NET application. Unfortunately, there is no concept of master pages or master windows in Windows Presentation Foundation. In this article we are going to learn one easy way to create the master page equivalent in WPF.
Why Master Pages in WPF?
The main characteristic of master page is the consistent look and feel of the application. When developing WPF applications the most you can do is create style, themes etc. But you cannot control the layout of the page. This includes Header, Content, Footer etc.
Creating Master Page:
The concept behind creating a master page is simply adding a new custom control and exposing different regions using dependency properties. Check out the code below which is used to create the Header dependency property.
The MasterWindow is the name of the control. In the same way we can define the Content dependency property for our master window control.
The main purpose of Content property is to let the developer place the custom content in the child window . You can assume that this property is similar to the ContentPlaceHolder in ASP.NET which can be overridden by the developer.
The custom control also creates the Generic.xaml file automatically which is used to style the control. Let's add some style in the Generic.xaml file.
Master pages in ASP.NET 2.0 is one of the most used and important feature. Master pages allows to create a consistent look and feel of all the pages in the ASP.NET application. Unfortunately, there is no concept of master pages or master windows in Windows Presentation Foundation. In this article we are going to learn one easy way to create the master page equivalent in WPF.
Why Master Pages in WPF?
The main characteristic of master page is the consistent look and feel of the application. When developing WPF applications the most you can do is create style, themes etc. But you cannot control the layout of the page. This includes Header, Content, Footer etc.
Creating Master Page:
The concept behind creating a master page is simply adding a new custom control and exposing different regions using dependency properties. Check out the code below which is used to create the Header dependency property.
public static readonly DependencyProperty HeaderProperty = DependencyProperty.Register("Header", typeof (Object), |
typeof(MasterWindow), |
new UIPropertyMetadata()); |
public object Header |
{ |
get { return GetValue(HeaderProperty); } |
set { SetValue(HeaderProperty,value);} |
} |
The MasterWindow is the name of the control. In the same way we can define the Content dependency property for our master window control.
public static readonly DependencyProperty ContentProperty = DependencyProperty.Register("Content", typeof(Object), |
typeof(MasterWindow), |
new UIPropertyMetadata()); |
public object Content |
{ |
get { return GetValue(ContentProperty); } |
set { SetValue(ContentProperty, value); } |
} |
The main purpose of Content property is to let the developer place the custom content in the child window . You can assume that this property is similar to the ContentPlaceHolder in ASP.NET which can be overridden by the developer.
The custom control also creates the Generic.xaml file automatically which is used to style the control. Let's add some style in the Generic.xaml file.
|
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" |
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" |
xmlns:WPF3D="clr-namespace:WPF3D"> |
|
|
The ControlTemplate tag contains the custom controls which will be used to create the display. Currently, there is a StackPanel which contains the Label for header region and the ContentPresenter control. The ContentPresenter is responsible for injecting the content at run time. The Content property is set to TemplateBinding Content which means it will get the data from the Content dependency property.
Our master page/window is complete now let's take a look at the window which will use this master control.
Creating Window to Use Master Window Control:
Add a simple WPF window to your application. Next we need to refer to the MasterWindow window. This can be performed by adding the clr-namespace attribute in the Window object. Take a look at the code below:
1 | |
2 | xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" |
3 | xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" |
4 | Title="ChildWindow" Height="300" Width="300" |
5 | xmlns:m="clr-namespace:WPF3D"> |
The tag prefix "m" is to refer to the WPF3D namespace. Don't pay attention to 3D part of the namespace just think of it as a namespace.
Next, we need to add the MasterWindow on the page. This can be accomplished by using the following code:
1 | |
2 | |
3 | |
As, you can see the Header portion of the page automatically appears since it was part of the MasterWindow window and was defined in the Generic.xaml file.
Now, let's some custom content to the Content part of the MasterWindow.
|
|
|
|
is my content! |
|
|
|
|
|
In the above code we just added a simple TextBox in the MasterWindow.Content section. The output will be the following:
Now, you can achieve a consitent look and feel just like ASP.NET master pages.
Conclusion:
Although WPF does not provide any Master Pages like functionality out of the box but we can easily create this feature by using custom controls and dependency properties. Hopefully, this feature will be available in the new versions of the WPF framework.
