Differences between events and bubbling events in WPF and tunnel events (Preview events)

Summary:

1: What is a routing event;

2: interrupt Event Routing;

3: Custom routing events;

4: Why do I need to customize routing events;

5. What are bubble events and preview events (tunnel events );

1: What is a routing event?

The event in WPF is a routing event. The so-called routing event is defined in msdn as follows:

Function Definition: A routing event is an event that calls a handler for multiple listeners in the element tree, rather than for the objects that trigger the event.

Implementation Definition: A routing event is a CLR event that can be supported by routedevent instances and handled by the Windows Presentation Foundation (WPF) Event System.

However, these two types of definitions are abstract. Let's look at a more specific definition:

       <Border Height="50" Width="250" BorderBrush="Gray" BorderThickness="1" >            <StackPanel Background="LightGray" Orientation="Horizontal" MouseUp="StackPanel_MouseUp">                <TextBlock Name="YesTB" Width="50"  MouseUp="YesTB_MouseUp" Background="Blue" >Yes</TextBlock>            </StackPanel>        </Border>

In this example, the event routing is:

Textblock --> stackpanel --> border->...

2: interrupt Event Routing
All routing events share a common event data base class routedeventargs. Routedeventargs defines a handled attribute with a Boolean value. The purpose of the handled attribute is to allow any event handler in a route to mark a route event as "handled" by setting the value of handled to true ".

        private void StackPanel_MouseUp(object sender, MouseButtonEventArgs e)        {            MessageBox.Show("Panel");        }        private void YesTB_MouseUp(object sender, MouseButtonEventArgs e)        {            MessageBox.Show("button");            e.Handled = true;        }

In the preceding example, the stackpanel_mouseup event is no longer triggered.

3: Custom route events

As shown in the following example, first register a routedevent using the registerroutedevent method. According to the Conventions, routedevent static field names should be suffixedEventEnd. In this example, the event name is tap and the Event Routing Policy is bubble. After registering a call, you can add and remove the Common Language Runtime (CLR) event accessors for the event.

Please note that although this event is triggered by the ONTAP virtual method in this specific example, the way you trigger the event or the way the event responds to changes depends on your needs.

Note that this example mainly implements an entire subclass of the button. This subclass is built as a separate Assembly and will be used in a separate eXtensible Application Markup Language (XAML) page is instantiated as a custom class. This is to illustrate the concept that the control that creates a subclass can be inserted into a tree composed of other controls. In this case, custom events on these controls have the same Event Routing functionality as any inherent Windows Presentation Foundation (WPF) element.

public class MyButtonSimple: Button{    // Create a custom routed event by first registering a RoutedEventID    // This event uses the bubbling routing strategy    public static readonly RoutedEvent TapEvent = EventManager.RegisterRoutedEvent(        "Tap", RoutingStrategy.Bubble, typeof(RoutedEventHandler), typeof(MyButtonSimple));    // Provide CLR accessors for the event    public event RoutedEventHandler Tap    {            add { AddHandler(TapEvent, value); }             remove { RemoveHandler(TapEvent, value); }    }    // This method raises the Tap event    void RaiseTapEvent()    {            RoutedEventArgs newEventArgs = new RoutedEventArgs(MyButtonSimple.TapEvent);            RaiseEvent(newEventArgs);    }    // For demonstration purposes we raise the event when the MyButtonSimple is clicked    protected override void OnClick()    {        RaiseTapEvent();    }}

<Window      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"    xmlns:custom="clr-namespace:SDKSample;assembly=SDKSampleLibrary"    x:Class="SDKSample.RoutedEventCustomApp"    >    <Window.Resources>      <Style TargetType="{x:Type custom:MyButtonSimple}">        <Setter Property="Height" Value="20"/>        <Setter Property="Width" Value="250"/>        <Setter Property="HorizontalAlignment" Value="Left"/>        <Setter Property="Background" Value="#808080"/>      </Style>    </Window.Resources>    <StackPanel Background="LightGray">        <custom:MyButtonSimple Name="mybtnsimple" Tap="TapHandler">Click to see Tap custom event work</custom:MyButtonSimple>    </StackPanel></Window>

4: Why do I need to customize routing events?

Until now, we do not need custom routing events. However, when we create custom control, it is necessary to create some routing events related to the business.

For example, if you create a question type display control for the online exam, you can design a custom event for the control to "Submit ". In this way, this question type control not only has some common events, but also looks more "business ".

5. What are bubble events and preview events (tunnel events)

 There are two types of routing events: bubble events and preview events (tunnel events ). The example above is a bubble event.

A bubble event is the most common event in a WPF route. It indicates that the event is propagated (propagated) from the source element to the visible tree until it is processed or reaches the root element. In this way, you can process events for objects at the upper level of the source element. For example, you can attach a button. Click handler to an embedded grid element instead of directly attaching it to the button itself. A bubble event has a name indicating its operation (for example, mousedown ).

Tunnel events use another method, starting from the root element, traversing down the element tree until the source element of the event is processed or reached. In this way, the upstream element can be intercepted and processed before the event reaches the source element. According to naming conventions, a tunnel event has a prefix Preview (for example, previewmousedown ).

In the first example of this article, if we change mouseup to previewmouseup, what will happen.

Differences:

Bubble event: click on yestb. The "button" is displayed first, and the "Panel" is displayed ".

Preview event (Tunnel event) Event: click on yestb to bring up a "Panel" and a "button ".

When we see this difference, the timing for adding E. Handled = true is also different. First,

In the example of a bubble event, add E. Handled = true to yestb_previewmouseup. After adding the event, click yestb and only the "button" will pop up ".

In the preview event (Tunnel event) Example: E. Handled = true in stackpanel_previewmouseup. After adding it, click yestb. Only the "Panel" will pop up ".

 

 

From: http://www.cnblogs.com/luminji/archive/2011/02/04/1949142.html