Monday, 3 October 2011

Attached Property in Silverlight 4.0

Hi Friends,

In this article you will learn attached property in silverlight 4.0
There are two types of properties in Silverlight
1.     Dependency Property:  In the last article you learn dependency property briefly
2.   Attached Property: In this article you will learn briefly attached property.

In this article I will cover following topics about attached property
1.     Introduction of attached property
2.    What is attached property?
3.     Why we need attached property?
4.    How to register custom attached property in silverlight
5.     Some Attached properties in silverlight

  1. Introduction of attached property

An attached property is a new concept that is defined by Extensible Application Markup Language (XAML). The attached properties are intended to be used as global properties that are settable on any type of object. In WPF/Silverlight, attached properties are typically defined as a form of a dependency property that does not have the conventional property 'wrapper'.
2. What is attached Property??

Attached properties are a specialized type of dependency property that is immediately
recognizable in markup due to the TypeName.AttachedPropertyName syntax. For example,
Canvas.Left is an attached property defined by the Canvas type. What makes
attached properties interesting is that they’re not defined by the type you use them
with; instead, they’re defined by another type in a potentially different class hierarchy.
Attached properties allow flexibility when defining classes because the classes
don’t need to take into account every possible scenario in which they’ll be used and
define properties for those scenarios. Layout is a great example of this. The flexibility
of the Silverlight layout system allows you to create new panels that may never have
been implemented in other technologies—for example, a panel that lays elements out
by degrees and levels in a circular or radial fashion versus something like the built-in
Canvas that lays elements out by Left and Top positions.

3.   3.   Why we need attached properties?

The attached properties are a very powerful tool for dynamic extension of classes without inheritance. They also allow us to keep the properties located at their logical places – use what you need only when you need it. Moreover they allow the place, where the property is defined and the place, where it is stored, to be completely different classes that know nothing about each other. Like in the above example the Dock property value is stored in the button instance not in the DockPanel itself.
With the attached properties you can make your classes structure much more comprehensible for the developer by using only the properties that are valid in the specific context.

The good news is that many advantages from the dependency properties model are coming out of the box for the attached properties such as caching, data binding, default values, expressions, styling (which is nothing more than a set of predefined property values), property invalidation and more.

4.  How to create Attached property with example

1. Declare the attached property as static and readonly field in your class.

public static readonly DependencyProperty DockProperty = DependencyProperty.RegisterAttached
(“Dock”, // property name
typeof(Dock), // property type
typeof(DockPanel), // type of the property provider
new PropertyMetadata(Dock.Left, new PropertyChangedCallback(DockPanel.OnDockChanged))); // Property Metadata

2. Create GetDock and SetDock methods that are associated to the attached property.

public static Dock GetDock(UIElement element)
   if (element == null)
      throw new ArgumentNullException(“element”);
   return (Dock)element.GetValue(DockProperty);

public static void SetDock(UIElement element, Dock dock)
   if (element == null)
      throw new ArgumentNullException(“element”);
   element.SetValue(DockProperty, dock);

3. Create a callback method invoked when the property value is changed.

private static void OnDockChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
   // Do something when the property is changed.

   UIElement reference = d as UIElement;
   if (reference != null)


The following example code demonstrates how to set the attached property in the xaml markup:

<Button  x:Name=”Item1″  Text=”Item1″  DockPanel.Dock=”Top”/>

The code assumes that the Dock property is an attached property declared in the DockPanel class. 

5.    5.   List of some attached properties in Silverlight

Below you can find a list of some of the attached properties available in .NET Framework. This list is a short reference that was not meant to be complete. I decided to put it here to give you an idea about the way Microsoft uses the attached properties.
Canvas.Top – Define the distance for a control from the top edge of its container;
Canvas.Left – Define the distance for a control from the left edge of its container;
Canvas.ZIndex – Z Index of the control;
Grid.Row – Define the row index for a control placed in a Grid container;
Grid.Column – Define the row index for a control placed in a Grid container;
ScrollViewer.HorizontalScrollBarVisibility – Define the visibility of the horizontal scrollbar;
ScrollViewer.VerticalScrollBarVisibility – Define the visibility of the vertical scrollbar;
ToolTipService.ToolTip – Define the tool tip associated with a control;
and many more….

Hi friends In the next article you will learn routed events briefly .................


Post a Comment