Social Icons

Tuesday, 30 July 2013

WPF Tutorial: Markup Extensions - XAML based and WPF based Markup Extensions, How to use Markup extensions for binding elements in WPF

Markup Extensions in WPF:


In my previous articles i explained many articles on Asp.Net ,Oops Concepts and WPF.
   Now we will see one successive WPF Tutorials i.e Markup Extensions in WPF.


Markup Extensions:

Markup Extensions are used to assign complex values to properties in XAML which are not possible using markup language. These markup extensions are enclosed in braces{} and keyword immeadiatly followed by  the left brace, indicates which markup extensions you are using. For the markup extension you can set one or more properties.


Markup Extensions are classified into two categories.
  • XAML based Markup Extensions 
  • WPF based Markup Extensions.

XAML based Markup Extensions:

These are the markup extensions that can be used in XAML but not possible to implement them through
C#.Net code as they have no classes in .Net Framework.

The following are XAML based Markup Extensions.

{x:null} - Used to assign null to a property using XAML markup.

{x:Type} - Used to specify the type of element in XAML markup.
{x:Type }

{x:Array} - Used to declare an array with in a XAML markup.

{x:Static} - Used to assign a static collection to a property of the control.

WPF based Markup Extensions:

These are markup extensions that can be used in XAML an also C#.Net code as they have classes in .Net Framework.

StaticResource :
 Used to bind a style or Resource during compilation to use this Markup Extension in XAML, use the  following syntax.

{StaticResource Resource Key =}
{StaticResource }

Dynamic Resource:
 This is same as static resource except that it will bind the specified resource or style dynamically at run time and not during compilation. 
To use this markup extension in XAML syntax is as follows

{DynamicResource ResourceKey=}
{DynamicResource }

Used to Bind one control to another control. WPF support a feature called data binding which is
implemented using this Markup Extensions.

Elementname and Path.

ElementName property is used to specify name of the control to which you want to bind and Path is used
to specify property name of the control to which you want to bind.

It has property mode also to specify whether the Binding is oneway/twoway.
The following example takes two textboxes and a slider and Bind FontSize Property of one TextBox and Text Property of another TextBox to the value of the slider using Binding Markup Extension.

      Add a window to the project and design as follows with a slider and two Textboxes by binding FontSize Property of the first Textbox and Text property of the another Textbox to the value of the slider as below. 

You can find Tutorial for above Markup Extension Binding Example here

In the above example at runtime when you move the slider automatically the font size of the 1st textbox will change and also the value displayed in the 2nd textbox which is current value of the slider.

When you change the value of in 2nd textbox and press the tab then automatically value of the slider also changed because by default mode property of binding markup extension is set to twoway.


I hope you got clear idea on WPF Markup Extensions. 
This article is the one successive WPF Tutorials  i.e 

                          What is WPF and its features
                          Architecture of WPF
                          Windows Forms vs Windows Presentation Foundation
                          What is XAML and its parts
                          XAML Markup Extensions   etc.

Don't forget to comment and share for our friends if like this post. Thank You.         

No comments:

Post a Comment

Please Give your Valuable Suggestions,Questions and Comments to improve my blog.