Attached Property in WPF: Complete Guide with Examples

Attached Property in WPF is an important concept in Windows Presentation Foundation that allows one control or class to provide additional information or behavior to another control.

If you are learning WPF, XAML, Dependency Properties, or custom controls, understanding attached properties is essential. You have probably already used attached properties without realizing it. Properties such as Grid.Row, Grid.Column, Canvas.Left, and DockPanel.Dock are all examples of WPF attached properties.

In this article, we will understand what an attached property is, why it is used, how it differs from a dependency property, and how to create a custom attached property in WPF using C#.

What Is an Attached Property in WPF?

An Attached Property in WPF is a special type of dependency property that is defined in one class but can be attached to and used by another control or UI element.

For example:


<Grid> 
	<Button Grid.Row="1" Grid.Column="2" Content="Submit" />
</Grid>

The Button class does not define the Row or Column properties. Instead, the Grid class defines these as attached properties using Grid.Row and Grid.Column. These properties can then be attached to a Button or any other UI element placed inside a Grid.

This is the basic concept behind an attached property in WPF, one class defines the property, while another control can use that property to provide additional information or behavior.

Why Are Attached Properties Used in WPF?

Attached properties are useful when one element needs to provide information about another element without requiring the second element to inherit from the first.

A common example is the WPF Grid. Consider this XAML:


<Grid>
	<Grid.RowDefinitions>
		<RowDefinition Height="Auto" />
		<RowDefinition Height="Auto" />
	</Grid.RowDefinitions>
	<Button Grid.Row="0" Content="Save" />
	<TextBox Grid.Row="1" />
</Grid>

The Grid needs to know which row each child element belongs to. Instead of defining a separate Row property in every possible WPF control, WPF uses an attached property called Grid.Row.

This allows the Grid class to provide and store layout information on its child elements, such as specifying which row or column an element should occupy.

The same concept of attached properties is also used by several other WPF panels to provide layout-related information to their child elements.

Common Examples of Attached Properties in WPF

You may already be using attached properties in your WPF applications.

Grid.Row
Grid.Column
Canvas.Left
Canvas.Top
DockPanel.Dock

Attached Property vs Dependency Property

Dependency Property	Attached Property
Usually represents a property of a control	Usually provides information to another element
Commonly declared with `Register()`	Commonly declared with `RegisterAttached()`
Example: `TextBox.Text`	Example: `Grid.Row`
Usually belongs to the control	Can be used on another `DependencyObject`
Commonly used in custom controls	Commonly used for layout and reusable behaviors

How to Create an Attached Property in WPF

Creating a custom attached property involves three main steps:

Register the attached property.
Create a Set method.
Create a Get method.

Let's create a simple example. Suppose we want to add a Highlight property that can be used on any WPF control.

We want to write:


<Button local:ControlHelper.Highlight="True" Content="Submit" />

Step 1: Create a Helper Class


public static class ControlHelper 
{
	
}

Step 2: Register the Attached Property


public static readonly DependencyProperty HighlightProperty = DependencyProperty.RegisterAttached( "Highlight", typeof(bool), typeof(ControlHelper), new PropertyMetadata(false));

Step 3: Create the Get Method


//The method follows the naming convention: Get + PropertyName
public static bool GetHighlight(DependencyObject element) 
{ 
	return (bool)element.GetValue(HighlightProperty); 
}

Step 4: Create the Set Method


//The method follows the naming convention: Set + PropertyName
public static void SetHighlight( DependencyObject element, bool value) 
{ 
	element.SetValue(HighlightProperty, value); 
}

Complete Attached Property Example


public static class ControlHelper 
{ 
	public static readonly DependencyProperty HighlightProperty = DependencyProperty.RegisterAttached( "Highlight", typeof(bool), typeof(ControlHelper), new PropertyMetadata(false)); 
    public static void SetHighlight( DependencyObject element, bool value) 
    { 
    	element.SetValue(HighlightProperty, value); 
    } 
    public static bool GetHighlight( DependencyObject element) 
    {
    	return (bool)element.GetValue(HighlightProperty); 
    } 
}

Now the property can be used from XAML like below.


<Window x:Class="WpfApp.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:WpfApp">
	<StackPanel Margin="20">
		<TextBox Width="200" Height="30" local:ControlHelper.Highlight="True" />
		<Button Content="Save" Width="100" Margin="0,10,0,0" local:ControlHelper.Highlight="False" />
	</StackPanel>
</Window>

Summary

WPF Attached Property is a powerful feature that allows a property to be defined in one class and used by other controls. It is implemented using dependency properties and is commonly used by WPF layout panels such as Grid.Row, Grid.Column, Canvas.Left, and DockPanel.Dock. Developers can also create custom attached properties to add reusable behavior or metadata to WPF controls.

Thanks