Attached Routed Event in WPF

WPF also supports Attached Routed Events. This is useful while tunneling and bubbling event through elements which don’t define that event. Routed Event can be used as an attached event. Attached events are much similar to Attached Properties. Attached properties use Property value inheritance while Attached events use bubbling and tunneling. Let’s understand Attached Event with simple example.

<Grid Button.Click="Grid_Click">

    <StackPanel Button.Click="StackPanel_Click">

        <Button Content="Click Me!" Height="35" Width="150"

        Margin="5" />

    </StackPanel>

</Grid>

private void StackPanel_Click(object sender, RoutedEventArgs e)

{

    MessageBox.Show("Stackpanel");

}

private void Grid_Click(object sender, RoutedEventArgs e)

{

    MessageBox.Show("Grid");

}

On Button Click event, it bubbled up the event to top element. StackPanel and Grid doesn’t define their own Click event. So Button.Click (Attached Routed Event) is defined on StackPanel and Grid. So when user clicks on Button, it will call StackPanel_Click first and followed by Grid_Click event.

Related links –

Routed Events in WPF

Attached Properties in WPF

Dependency Property vs. Normal Property (CLR Property)

Attached Properties in WPF

Attached properties are special type of dependency properties. The special thing about this property is that they can be set from any object of class other than they are defined. The object on which they are used is called as target object. The common attached properties are Grid.Row, Grid.Column, Canvas.Top, Canvas.Left, DockPanel.Dock, TextElement.FontSize, TextElement.FontWeight etc.

<Grid TextElement.FontStyle="Italic" TextElement.FontWeight="Bold">

    <Grid.RowDefinitions>

        <RowDefinition />

        <RowDefinition />

    </Grid.RowDefinitions>

    <Grid.ColumnDefinitions>

        <ColumnDefinition Width="0.8*" />

        <ColumnDefinition />

    </Grid.ColumnDefinitions>

    <Label Grid.Row="0" Grid.Column="0"

           Content="Enter value:" VerticalAlignment="Center"

           Margin="5"  />

    <TextBox Grid.Row="0" Grid.Column="1"

             Name="MyText" Height="25" Margin="5" />

    <Button Grid.Row="1" Grid.ColumnSpan="2"

            Content="Save" Height="30" Width="100" />

</Grid>

In above XAML code you can see the use of attached properties like TextElement.FontStyle, TextElement.FontWeight, Grid.Row, Grid.Column etc. You also noticed that these properties are setting from other instances like TextElement.FontStyle attached property value set from Grid similar Grid.Row value set from Label and TextBox etc.

You can also create your own Attached Dependency Property.  

<Window x:Class="WpfApplication1.AttachedPropertyDemo"

        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

        xmlns:local="clr-namespace:WpfApplication1"

        Title="AttachedPropertyDemo" Height="200" Width="250">

    <Window.Resources>

        <local:AttachedPropertySample local:AttachedPropertySample.TextAttachedProperty="Attached Property Test" x:Key="TestAttachedProperty" />

    </Window.Resources>

<Grid>

</Grid>

</Window>

public class AttachedPropertySample : DependencyObject

{

    //Register Attached Property

    public static DependencyProperty MyAttachedProperty =

        DependencyProperty.RegisterAttached("TextAttachedProperty",

        typeof(string), typeof(AttachedPropertySample),

        new PropertyMetadata("Test",

        new PropertyChangedCallback(OnMyAttachedPropertyChanged)));

    //Get Attached Property Value

    public static string GetTextAttachedProperty(
                         AttachedPropertySample attachedSample)

    {

        return (string)attachedSample.GetValue(MyAttachedProperty);

    }

    //Set Attached Property Value

    public static void SetTextAttachedProperty(
                  AttachedPropertySample attachedSample, string value)

    {

        attachedSample.SetValue(MyAttachedProperty, value);

    }

    //On Value change of Attached Property

    public static void OnMyAttachedPropertyChanged(
           DependencyObject dObject, DependencyPropertyChangedEventArgs e)

    {

        MessageBox.Show(e.NewValue.ToString());

    }

}

You can also create Attached ReadOnly Dependency Property for that you need to register dependency property using DependencyProperty.RegisterAttachedReadOnly. This readonly attached properties can be created similar to readonly dependency properties. You can go through my post related dependency property here and checkout how to create readonly dependency properties.


You might also like
Dependency Property
WPF Class Hierarchy
XAML Overview