WPF中定义TabItem的可选区域(特别是当使用Label来呈现Header时)

1. 如上图，所示，此时当鼠标移入蓝色框内除文字部分，整个TabItem是没反应的

   经过查看代码可以看到：

    将图标中的VerticalAlignment="Center"和HorizontalAlignment="Center"删掉后，就能达到如下效果：

   TabItem的可选区域明显恢复到正常情况。

   完整的代码如下：

   1. MainWindow.xaml

<Window x:Class="TabItemDemo20160329.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <TabControl TabStripPlacement="Left">
            <TabItem Header="第一项"></TabItem>
            <TabItem Header="第二项"></TabItem>
            <TabItem Header="第三项"></TabItem>
            <TabItem Header="第四项"></TabItem>
            <TabItem Header="第五项"></TabItem>
            <TabItem Header="第六项"></TabItem>
        </TabControl>
    </Grid>
</Window>

   2. MainWindow.xaml.cs ,该文件其实就是默认系统生成的

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
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 TabItemDemo20160329
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }
    }
}

   3. TabItemStyle.xaml 样式文件：

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <Style TargetType="{x:Type TabItem}">
        <Setter Property="Width" Value="200"/>
        <Setter Property="Height" Value="50"/>
        <Setter Property="Cursor" Value="Hand"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type TabItem}">
                    <Grid SnapsToDevicePixels="true" Background="{x:Null}" x:Name="tabItemGrid" Cursor="Hand">
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="43*"/>
                                <ColumnDefinition Width="157*"/>
                            </Grid.ColumnDefinitions>
                            <Border x:Name="border" BorderBrush="{x:Null}"   Background="{TemplateBinding Background}">
                                <Border.RenderTransform>
                                    <TransformGroup>
                                        <ScaleTransform/>
                                        <SkewTransform/>
                                        <RotateTransform/>
                                        <TranslateTransform/>
                                    </TransformGroup>
                                </Border.RenderTransform>
                            </Border>

                            <Label x:Name="lbl" Foreground="White"  Grid.Column="1" FontSize="16" FontFamily="Tomaha" Padding="0">
                                <Label.Content>
                                    <TextBlock Margin="0,0,5,0" Text="{TemplateBinding Header}" TextWrapping="Wrap"/>
                                </Label.Content>
                            </Label>
                            <!--<Label x:Name="lbl" Grid.Column="1" Content="{TemplateBinding Header}"/>-->
                        </Grid>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsMouseOver" Value="true">
                            <Setter TargetName="lbl" Property="Background" Value="Red"/>
                        </Trigger>
                        <Trigger Property="IsSelected" Value="true">
                            <Setter TargetName="lbl" Property="Background" Value="Green"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</ResourceDictionary>

   4.App.xaml 配置文件，注意是将TabItem.xaml文件引入到App中：

<Application x:Class="TabItemDemo20160329.App"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             StartupUri="MainWindow.xaml">
    <Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="TabItemStyle.xaml"/>
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Application.Resources>
</Application>