一文帶你瞭解WPF中的附加事件

2022-12-05 14:00:45

什麼是附加事件

Microsoft 官方概述：

附加事件可用於在非元素類中定義新的路由事件，並在樹中的任何元素上引發該事件。為此，必須將附加事件註冊為路由事件，並提供支援附加事件功能的特定支援程式碼。由於附加事件註冊為路由事件，因此在元素樹中引發時，它們會傳播到元素樹中。

簡單來說就是，可以進行附加操作的事件，必須為路由事件（RoutedEvent）。

附加事件用法

在 XAML 語法中，附加事件由其事件名稱和所有者型別指定，格式為 <owner type>.<event name>。由於事件名稱使用其所有者型別的名稱進行限定，因此語法允許事件附加到任何可以範例化的元素。此語法也適用於附加到事件路由中任意元素的常規路由事件的處理程式。

Microsoft 官方檔案

這裡簡略的借用檔案中的說明，詳細學習請以檔案為準：附加事件概述 (WPF .NET)

附加事件案例

定義自定義控制元件

using System.Windows;
using System.Windows.Controls;

namespace assembly
{
    /// <summary>
    /// 按照步驟 1a 或 1b 操作，然後執行步驟 2 以在 XAML 檔案中使用此自定義控制元件。
    ///
    /// 步驟 1a) 在當前專案中存在的 XAML 檔案中使用該自定義控制元件。
    /// 將此 XmlNamespace 特性新增到要使用該特性的標記檔案的根
    /// 元素中:
    ///
    ///     xmlns:MyNamespace="clr-namespace:assembly"
    ///
    ///
    /// 步驟 1b) 在其他專案中存在的 XAML 檔案中使用該自定義控制元件。
    /// 將此 XmlNamespace 特性新增到要使用該特性的標記檔案的根
    /// 元素中:
    ///
    ///     xmlns:MyNamespace="clr-namespace:assembly;assembly=assembly"
    ///
    /// 您還需要新增一個從 XAML 檔案所在的專案到此專案的專案參照，
    /// 並重新生成以避免編譯錯誤:
    ///
    ///     在解決方案資源管理器中右擊目標專案，然後依次單擊
    ///     「新增參照」->「專案」->[瀏覽查詢並選擇此專案]
    ///
    ///
    /// 步驟 2)
    /// 繼續操作並在 XAML 檔案中使用控制元件。
    ///
    ///     <MyNamespace:MessagePopup/>
    ///
    /// </summary>
    public class MessagePopup : UserControl
    {
        public static readonly DependencyProperty BusinessTypeProperty =
         DependencyProperty.Register(nameof(BusinessType), typeof(string), typeof(MessagePopup), new PropertyMetadata(string.Empty));
        /// <summary>
        /// 業務型別
        /// </summary>
        public string BusinessType
        {
            get { return (string)GetValue(BusinessTypeProperty); }
            set { SetValue(BusinessTypeProperty, value); }
        }

        public static readonly DependencyProperty SecondsProperty =
            DependencyProperty.Register(nameof(Seconds), typeof(string), typeof(MessagePopup), new PropertyMetadata(string.Empty));
        /// <summary>
        /// 秒數
        /// </summary>
        public string Seconds
        {
            get { return (string)GetValue(SecondsProperty); }
            set { SetValue(SecondsProperty, value); }
        }

        static MessagePopup()
        {
            DefaultStyleKeyProperty.OverrideMetadata(typeof(MessagePopup), new FrameworkPropertyMetadata(typeof(MessagePopup)));
        }
    }
}

自定義控制元件樣式

下面的樣式使用 ControlTemplate 自定義的控制元件樣式，其中的 Button 按鈕是不能進行事件繫結的，當然命令繫結也是不行的。

<Application
    x:Class="assembly.App"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:assembly"
    StartupUri="MainWindow.xaml">
    <Application.Resources>
        <ResourceDictionary>
            <!--#region-->
            <Style x:Key="popup" TargetType="{x:Type local:MessagePopup}">
                <Setter Property="Height" Value="436" />
                <Setter Property="Width" Value="840" />
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type local:MessagePopup}">
                            <Grid>
                                <Grid.Background>
                                    <ImageBrush ImageSource="pack://application:,,,/images/bg-Tips.png" />
                                </Grid.Background>
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="0.7*" />
                                    <RowDefinition Height="Auto" />
                                    <RowDefinition />
                                </Grid.RowDefinitions>
                                <Grid Grid.Row="0" Margin="55,0">
                                    <Grid.RowDefinitions>
                                        <RowDefinition Height="0.5*" />
                                        <RowDefinition />
                                    </Grid.RowDefinitions>
                                    <Button
                                        Width="100"
                                        Height="40"
                                        Margin="0,20,0,0"
                                        HorizontalAlignment="Right"
                                        Tag="0">
                                        <Button.Template>
                                            <ControlTemplate>
                                                <StackPanel VerticalAlignment="Center" Orientation="Horizontal">
                                                    <Image Source="pack://application:,,,/images/ico-close.png" />
                                                    <TextBlock
                                                        Margin="5,0,0,0"
                                                        VerticalAlignment="Center"
                                                        FontSize="28"
                                                        FontWeight="Black"
                                                        Foreground="#7582CC"
                                                        Text="關閉" />
                                                </StackPanel>
                                            </ControlTemplate>
                                        </Button.Template>
                                    </Button>
                                    <StackPanel
                                        Grid.Row="1"
                                        HorizontalAlignment="Center"
                                        VerticalAlignment="Center"
                                        Orientation="Horizontal">
                                        <TextBlock
                                            FontSize="42"
                                            FontWeight="Black"
                                            Text="" />
                                        <TextBlock
                                            FontSize="42"
                                            FontWeight="Black"
                                            Foreground="#F95A00"
                                            Text="{TemplateBinding BusinessType}" />
                                        <TextBlock
                                            FontSize="42"
                                            FontWeight="Black"
                                            Text="" />
                                    </StackPanel>
                                </Grid>
                                <Line
                                    Grid.Row="1"
                                    Margin="80,0"
                                    Stroke="#8DB2BD"
                                    StrokeDashArray="2,2"
                                    StrokeThickness="4"
                                    X1="0"
                                    X2="650" />
                                <Grid Grid.Row="2" Margin="55,0">
                                    <Grid.RowDefinitions>
                                        <RowDefinition />
                                        <RowDefinition />
                                    </Grid.RowDefinitions>
                                    <Grid Grid.Row="0" Margin="75,0">
                                        <StackPanel
                                            Margin="0,30,0,0"
                                            VerticalAlignment="Center"
                                            Orientation="Horizontal">
                                            <TextBlock
                                                VerticalAlignment="Center"
                                                FontSize="32"
                                                Foreground="#002C86"
                                                Text="" />
                                            <Image
                                                Height="40"
                                                Margin="20,0"
                                                Source="pack://application:,,,/images/ico-arrow.png" />
                                            <Button
                                                Width="180"
                                                Height="50"
                                                Tag="1">
                                                <Button.Template>
                                                    <ControlTemplate>
                                                        <Border Background="#DDE2FF" CornerRadius="5">
                                                            <StackPanel
                                                                Height="40"
                                                                HorizontalAlignment="Center"
                                                                VerticalAlignment="Center"
                                                                Orientation="Horizontal">
                                                                <Image Source="pack://application:,,,/images/ico-filer.png" />
                                                                <TextBlock
                                                                    Margin="5,0,0,0"
                                                                    VerticalAlignment="Center"
                                                                    FontSize="28"
                                                                    FontWeight="Black"
                                                                    Foreground="#7582CC"
                                                                    Text="跳轉頁面" />
                                                            </StackPanel>
                                                        </Border>
                                                    </ControlTemplate>
                                                </Button.Template>
                                            </Button>
                                        </StackPanel>
                                    </Grid>
                                    <Grid Grid.Row="1">
                                        <StackPanel
                                            Margin="0,20,0,0"
                                            HorizontalAlignment="Center"
                                            VerticalAlignment="Center"
                                            Orientation="Horizontal">
                                            <TextBlock
                                                FontSize="38"
                                                Foreground="#FFD873"
                                                Text="{TemplateBinding Seconds}" />
                                            <TextBlock
                                                FontSize="38"
                                                Foreground="#FFD873"
                                                Text="" />
                                            <TextBlock
                                                Margin="10,0,0,0"
                                                VerticalAlignment="Bottom"
                                                FontSize="32"
                                                Foreground="#FFFFFF"
                                                Text="" />
                                        </StackPanel>
                                    </Grid>
                                </Grid>
                            </Grid>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
            <!--#endregion-->
        </ResourceDictionary>
    </Application.Resources>
</Application>

效果

註冊使用附加事件

使用該自定義控制元件時，為其註冊 Button.Click 事件，屬於原生路由事件。對應其用方法可以得出，該事件觸發的是 Button 元素的 Click 事件。

簡單來說就是，只有自定義控制元件中的 Button 元素才能觸發當前的 Click 事件。（附加事件用法）

<Window
    x:Class="assembly.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:comm="clr-namespace:assembly"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    Title="MainWindow"
    Width="900"
    Height="550"
    WindowStartupLocation="CenterScreen"
    mc:Ignorable="d">
    <Grid>
        <comm:MessagePopup
            x:Name="popup"
            Width="840"
            Height="436"
            Button.Click="popup_Click"
            Style="{StaticResource popup}"
            Visibility="Visible" />
    </Grid>
</Window>

元素樹中宣告了兩個 Buuton 這裡暫且通過 Button 的 Tag 值來區分，不僅限於 Tag。

private void popup_Click(object sender, RoutedEventArgs e)
{
    string tag = (string)((FrameworkElement)e.OriginalSource).Tag;
    if (tag == "0")
    {
        MessageBox.Show("是關閉按鈕");
        //CloseTimer();
    }
    else if (tag == "1")
    {
        MessageBox.Show("是跳轉按鈕");
    }
}

效果

到此這篇關於一文帶你瞭解WPF中的附加事件的文章就介紹到這了,更多相關WPF附加事件內容請搜尋it145.com以前的文章或繼續瀏覽下面的相關文章希望大家以後多多支援it145.com！