WPF - 继承选项卡控件并自定义样式



我想继承默认的 TabControl 并处理事件,双击 TabItem Header。

这是 XAML 文件:

<local:MyTabControl x:Class="MyTabControl"
    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:CustomizedTabControl"
    mc:Ignorable="d">
<local:MyTabControl.Style>
    <Style TargetType="{x:Type local:MyTabControl}" BasedOn="{StaticResource {x:Type TabControl}}">
        <Setter Property="ItemContainerStyle">
            <Setter.Value>
                <Style  TargetType="{x:Type TabItem}">
                    <Setter Property="HeaderTemplate">
                        <Setter.Value>
                            <DataTemplate>
                                <Label Content="{Binding}">
                                    <Label.Style>
                                        <Style TargetType="Label">
                                            <EventSetter Event="MouseDoubleClick" Handler="OnTabHeaderDoubleClick"/>
                                        </Style>
                                    </Label.Style>
                                </Label>
                            </DataTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
            </Setter.Value>
        </Setter>
    </Style>
</local:MyTabControl.Style>

这是代码隐藏:

using System.Windows.Controls;
using System.Windows.Input;
namespace CustomizedTabControl
{
    public partial class MyTabControl : TabControl
    {
        public MyTabControl() : base()
        {
        }
        public void OnTabHeaderDoubleClick(object sender, MouseButtonEventArgs e)
        {
            // Never call
        }
    }
}

但从不调用事件处理程序。你有什么想法吗?

P/S:这是我使用自定义TabControl的代码:

<Window x:Class="CustomizedTabControl.MainWindow"
 ...
    Title="MainWindow" Height="350" Width="525">
    <Grid>
        <local:MyTabControl x:Name="tabControl">
            <TabItem Header="TabItem">
                <Grid Background="#FFE5E5E5"/>
            </TabItem>
            <TabItem Header="TabItem">
                <Grid Background="#FFE5E5E5"/>
            </TabItem>
        </local:MyTabControl>
    </Grid>
</Window>

我无法弄清楚为什么我在 MyTabControl 的 XAML 文件中定义的样式不起作用。但是,这是我使用的解决方法。我必须使用字典资源来捕获事件。

xaml 文件:

<ResourceDictionary x:Class="CustomizedTabControl.MyTabControlResourceDictionary"
        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:CustomizedTabControl"
        mc:Ignorable="d">
    <Style BasedOn="{StaticResource {x:Type TabControl}}" TargetType="{x:Type local:MyTabControl}" x:Key="MyTabControlStyle">
        <Setter Property="ItemContainerStyle">
            <Setter.Value>
                <Style  TargetType="{x:Type TabItem}">
                    <Setter Property="HeaderTemplate">
                        <Setter.Value>
                            <DataTemplate>
                                <Grid>
                                    <Label Content="{Binding}" Background="Blue" Tag="{Binding RelativeSource={RelativeSource AncestorType={x:Type local:MyTabControl}}}">
                                        <Label.Style>
                                            <Style TargetType="Label">
                                                <EventSetter Event="MouseDoubleClick" Handler="OnTabHeaderDoubleClick"/>
                                            </Style>
                                        </Label.Style>
                                    </Label>
                                </Grid>
                            </DataTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
            </Setter.Value>
        </Setter>
    </Style>
</ResourceDictionary>

相应的代码隐藏:

namespace CustomizedTabControl
{
    public partial class MyTabControlResourceDictionary : ResourceDictionary
    {
        public void OnTabHeaderDoubleClick(object sender, MouseButtonEventArgs e)
        {
            var tabControl = (sender as FrameworkElement)?.Tag as MyTabControl;
            if(tabControl != null)
            {
                tabControl.OnTabHeaderDoubleClick();
            }
        }
    }
    public partial class MyTabControl : TabControl
    {
        public MyTabControl() : base()
        {
        }
        public void OnTabHeaderDoubleClick()
        {
             // Now I can handle the event here
        }
    }
}

添加这是我使用它的方式:

<Grid>
    <local:MyTabControl x:Name="tabControl" Style="{StaticResource MyTabControlStyle}">
        <TabItem Header="TabItem">
            <Grid Background="#FFE5E5E5"/>
        </TabItem>
        <TabItem Header="TabItem">
            <Grid Background="#FFE5E5E5"/>
        </TabItem>
    </local:MyTabControl>
</Grid>

最新更新