WPF中隧道路由和冒泡路由事件的示例分析

這篇文章主要介紹了WPF中隧道路由和冒泡路由事件的示例分析，具有一定借鑒價值，感興趣的朋友可以參考下，希望大家閱讀完這篇文章之后大有收獲，下面讓小編帶著大家一起了解一下。

　　WPF中使用路由事件升級了傳統應用開發中的事件，在WPF中使用路由事件能更好的處理事件相關的邏輯，我們從這篇開始整理事件的用法和什么是直接路由，什么是冒泡路由，以及什么是隧道路由。

事件最基本的用法

　　在基于事件驅動的開發中，把代碼放在響應注冊的事件的處理函數內，比如Click事件、MouseDown事件、MouseUp事件等等。每個控件響應自己的注冊事件，有很多如果在事件上有相互關聯和影響的事件，就要在一個業務邏輯里寫比較多的代碼。而路由事件主要的優勢就是路由事件可以在元素樹上進行傳遞，并且沿著元素樹的傳播途徑被事件處理程序處理。這樣我們寫代碼的過程中時就可以更好的組織代碼到合適的位置。

 　　WPF事件模型和WPF屬性模型非常類似，與依賴項屬性一樣，路由事件由只讀的靜態字段表示，在靜態構造函數中注冊，并通過標準的.NET事件定義進行封裝。這里我們只講如何更好的使用。原理部分請看源碼。比如ButtonBase提供的Click事件。

　　　　 <Button Content="事件處理程序" Click="Button_Click"/>

　　　　　private void Button_Click(object sender, RoutedEventArgs e)
    {
      //這是Click事件處理程序代碼部分。
    }

　　在注冊事件后，在事件處理程序中第一個參數 sender提供引發該事件的對象，第二個參數是EventArgs對象。在WPF中如果事件不需要傳遞額外的信息，可以使用RoutedEventArgs類，如果需要傳遞額外的信息，就要是有繼承自RoutedEventArgs的對象。比如處理inkcanvas墨跡繪制的。比如處理多點觸控的。這些都是變相繼承RoutedEventArgs類。里面會包含在這種場景下更加多的信息。 

注冊事件的幾種寫法：

1）在XAML代碼中<Button x:Name="EventMessageButton" Content="事件處理程序" MouseUp="EventMessageButton_MouseUp"/>
2）在cs代碼中 EventMessageButton.MouseUp += EventMessageButton_MouseUp;
3）在cs代碼中 EventMessageButton.MouseUp += new MouseButtonEventHandler(EventMessageButton_MouseUp);

private void EventMessageButton_MouseUp(object sender, MouseButtonEventArgs e)
{
　　//我是處理程序。
}

 第一種寫法：我們使用XAML文件中在Button元素內使用MouseUp來創建后臺事件處理代碼 Btn_eventMessge_MouseUp

 第二種寫法：我們在后臺代碼中使用MouseUp+=的方式注冊。一種是New MouseButtonEventHandler傳入方法名。一種是匿名的直接傳入方法名，這三種注冊方式達成的效果是一樣的。

而這三種實際上使用的是事件封裝器。另一種方式是通過使用UIElement.AddHandler來直接連接事件。這里看個人習慣把。但是各種寫法主要解決的問題還是解耦，因為這些會關聯到后面的命令，動畫。模板。觸發器。MVVM下的使用，等等。這是個比較長久的問題。所以在這里，能夠使用，看得明白，目前這個階段就可以了。

我們繼續往下。解除關聯

在注冊事件的時候，最好先使用-=來解除關聯，避免多次觸發不合符預期的監聽事件。斷開使用-=或者使用UIElement.RemoveHandler來解除關聯。  因為事件在多次+=注冊事件處理程序是可行的。而事件的多詞解除關系不會引發任何問題，因此不要擔心+=和-=不匹配的問題。

public MainWindow()
    {
      InitializeComponent();
 　　　　　　　　 EventMessageButton.MouseUp -= EventMessageButton_MouseUp;      　　　　　　　　 EventMessageButton.MouseUp += EventMessageButton_MouseUp;

    }

理解路由事件

我們知道了事件可以在元素上注冊事件處理程序，那么我們知道內容控件是可以相互嵌套各種奇奇怪怪的組合以達到自己想要的效果，在這種情況下我們假設一個比較常見的場景。我們有一個標簽，標簽中包含一個StackPanel面板，面板中包含一幅圖片和2個文本。

<Label BorderBrush="Black" BorderThickness="1">
      <StackPanel>
        <TextBlock Margin="3">
         我是圖片標題
        </TextBlock>
        <Image Source="1.png" Stretch="None"/>
        <TextBlock Margin="3">
          我是圖片正文
        </TextBlock>
      </StackPanel>
 </Label>

我們的控件來回嵌套內容結構很復雜了。但是我們想在用戶點擊時只在一個地方響應我們的代碼。如果為每個元素都關聯同一個事件處理程序，代碼會很亂。而且難以維護。而路由事件就是為了解決這個問題的。路由事件分為三種：

1）和普通的.NET事件類似，直接路由事件（direct event) 他們源于一個元素，不傳遞給其他元素，比如MouseEnter事件，是直接路由事件。

2）向上傳遞的冒泡路由事件（bubbling event)比如MouseDown事件，是冒泡路由事件，該事件先由被單擊的元素引發，接下來被該元素的父元素引發，然后被父元素的父元素引發，以此類推。直到元素樹的頂部。

3）向下傳遞的隧道路由事件（tunneling event) 比如PreviewKeyDown事件，隧道路由事件在事件到達恰當的空間之前為預覽事件和終止事件提供了機會，比如PreviewKeyDown事件可以截獲是否按下了某個鍵，首先在窗口級別上，然后是更具體的容器，直到當按下時具有焦點的元素。

當使用EventManager.RegisterEvent()發給發注冊路由事件時，需要傳遞一個RoutingStrategy枚舉，指示希望用于事件的事件行為。

MouseUP和MouseDown事件都是冒泡路由事件，因此當在上面的圖片中按下鼠標左鍵后順序觸發MouseDown事件的順序是冒泡的。我們使用Snoop軟件抓取一下過程：

從圖中我們看到首先觸發的是PreviewMouseDown的隧道路由。他可以讓我們有機會預覽事件或終止事件。我們看到了從MainWindow開始到最終的Image結束。我們沒有終止路由。所以進行了下一輪的冒泡路由。從Image開始到MainWindow。

整個流程就結束了。我們看到路由事件提供了對事件處理非常豐富的功能。具體的隧道或冒泡行為可以參考RoutedEventArgs中的內容。

Source 屬性是引發事件的的對象。 OriginalSource是最初是什么對象引發了事件。RoutedEvent為觸發的事件提供的RoutedEvent對象。里面是需要用到的當前的參數，比如鼠標坐標，touch等等。Handled屬性的作用是終止事件是否繼續傳遞。

我們現在開始在這個例子上添加代碼。用于演示我們怎么處理冒泡路由。

<Window x:Class="WPFEvent.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:local="clr-namespace:WPFEvent"
    mc:Ignorable="d" MouseUp="EventResponseProcess_MouseUp"
    Title="MainWindow" Height="450" Width="800">
  <Grid Margin="3" MouseUp="EventResponseProcess_MouseUp">
    <Grid.RowDefinitions>
      <RowDefinition Height="Auto"></RowDefinition>
      <RowDefinition Height="*"></RowDefinition>
      <RowDefinition Height="Auto"></RowDefinition>
      <RowDefinition Height="Auto"></RowDefinition>
    </Grid.RowDefinitions>
    <Label Margin="5" Grid.Row="0" HorizontalAlignment="Left" Background="AliceBlue" BorderBrush="Black" BorderThickness="1" MouseUp="EventResponseProcess_MouseUp">
      <StackPanel MouseUp="EventResponseProcess_MouseUp">
        <TextBlock Margin="3" MouseUp="SomethingClicked">
         我是圖片標題
        </TextBlock>
        <Image Source="1.png" Stretch="None" MouseUp="EventResponseProcess_MouseUp"/>
        <TextBlock Margin="3">
          我是圖片正文
        </TextBlock>
      </StackPanel>
    </Label>
    <ListBox Grid.Row="1" Margin="5" Name="MessageListBox"></ListBox>
    <CheckBox Grid.Row="2" Margin="5" Name="HandlerCheckBox">
      Handle first event
    </CheckBox>
    <Button Grid.Row="3" Margin="5" Padding="3" HorizontalAlignment="Right" Name="ClearButton" Click="ClearButton_Click">Clear List</Button>
  </Grid>
</Window>

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace WPFEvent
{
  /// <summary>
  /// MainWindow.xaml 的交互邏輯
  /// </summary>
  public partial class MainWindow : Window
  {
    public MainWindow()
    {
      InitializeComponent();
    }

    protected int eventCounter = 0;
    private void EventResponseProcess_MouseUp(object sender, MouseButtonEventArgs e)
    {
      eventCounter++;
      string message = $"#{ eventCounter}:\r\n Sender: {sender} \r\n Source: {e.Source} \r\n Original Source: {e.OriginalSource}"; 
      MessageListBox.Items.Add(message);
      e.Handled = (bool)HandleCheckBox.IsChecked;
    }
 　　　　　　private void ClearButton_Click(object sender, RoutedEventArgs e)　　　　　　{ 
    　　　　　　}
  }
}

和上圖一樣，我們嘗試觀察執行過程。看下觸發過程,我們就能了解這個冒泡路由的工作過程了。上面寫的這個例子。主要是讓我們熟悉對于事件傳入參數OriginalSource的使用。勾選界面上的HandleCheckBox復選框可以終止冒泡事件，從而只觸發第一個Image的事件。可以自己寫代碼嘗試一下整個過程。

有個方法可以接收終止的事件消息，使用AddHandler()重載的方法。

這里還有一個常用的技巧，事件的附加。

如下面的代碼，在StackPanel中不存在Button的Click事件，但是可以通過ButtonBase.Click獲取按鈕的點擊事件，此事件將會在StackPanel容器里面的任意按鈕被點擊時觸發。

  <StackPanel ButtonBase.Click="StackPanel_Click" Margin="5">
      <Button Content="按鈕A" Click="Button_Click"/>
      <Button Content="按鈕B" Click="Button_Click"/>
      <Button Content="按鈕C" Click="Button_Click"/>
  </StackPanel>

隧道路由這里就不寫了，前面已經講過。隧道路由命名都是Preview開頭的。隧道路由全部結束了之后，同級的冒泡路由才開始。隧道路由主要是做預先處理，可以停止路由事件，也可以在事件處理程序中寫一些對應的處理代碼。

感謝你能夠認真閱讀完這篇文章，希望小編分享的“WPF中隧道路由和冒泡路由事件的示例分析”這篇文章對大家有幫助，同時也希望大家多多支持億速云，關注億速云行業資訊頻道，更多相關知識等著你來學習!