Trigger for IsMouseOver на TabItem ContenTemplate

Question

У меня проблема с TabItem Style, и, возможно, кто-то из вас может мне помочь.

После стиля на вопрос:

<Style x:Key="ChildrenTabItemStyle" TargetType="TabItem"> 
       <Style.Resources> 
        <SolidColorBrush x:Key="ButtonNormalBackground" Color="#FFEAE8E8"/> 
        <LinearGradientBrush x:Key="ButtonOverBackground" EndPoint="0,1" StartPoint="0,0"> 
         <GradientStop Color="#FFFAFAFA" Offset="0"/> 
         <GradientStop Color="#FFE0E0E3" Offset="1"/> 
        </LinearGradientBrush> 
        <LinearGradientBrush x:Key="ButtonPressedBackground" EndPoint="0,1" StartPoint="0,0"> 
         <GradientStop Color="#FFE0E0E2" Offset="0"/> 
         <GradientStop Color="#FFF8F8F8" Offset="1"/> 
        </LinearGradientBrush> 
        <SolidColorBrush x:Key="ButtonNormalBorder" Color="#FF969696"/> 
        <Style x:Key="CloseableTabItemButtonStyle" TargetType="{x:Type Button}"> 
         <Setter Property="FocusVisualStyle" Value="{x:Null}"/> 
         <Setter Property="Background" Value="{DynamicResource ButtonNormalBackground}"/> 
         <Setter Property="BorderBrush" Value="Transparent"/> 
         <Setter Property="BorderThickness" Value="2,2,2,0"/> 
         <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/> 
         <Setter Property="HorizontalContentAlignment" Value="Center"/> 
         <Setter Property="VerticalContentAlignment" Value="Center"/> 
         <Setter Property="Padding" Value="4"/> 
         <Setter Property="Template"> 
          <Setter.Value> 
           <ControlTemplate TargetType="{x:Type Button}"> 
            <Grid> 
             <Border SnapsToDevicePixels="true" x:Name="Chrome" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="2" Opacity="0" /> 
             <ContentPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" RecognizesAccessKey="True"/> 
            </Grid> 
            <ControlTemplate.Triggers> 
             <Trigger Property="IsMouseOver" Value="True"> 
              <Setter Property="Opacity" TargetName="Chrome" Value="1"/> 
              <Setter Property="Background" TargetName="Chrome" Value="{DynamicResource ButtonOverBackground}" /> 
             </Trigger> 
             <Trigger Property="IsPressed" Value="True"> 
              <Setter Property="Opacity" TargetName="Chrome" Value="1"/> 
              <Setter Property="Background" TargetName="Chrome" Value="{DynamicResource ButtonPressedBackground}" /> 
             </Trigger> 
             <Trigger Property="IsEnabled" Value="false"> 
              <Setter Property="Foreground" Value="#ADADAD"/> 
             </Trigger> 
            </ControlTemplate.Triggers> 
           </ControlTemplate> 
          </Setter.Value> 
         </Setter> 
        </Style> 
       </Style.Resources> 
       <Setter Property="Height" Value="40"/> 
       <Setter Property="MinWidth" Value="90"/> 
       <Setter Property="FontWeight" Value="Bold"/> 
       <Setter Property="Template"> 
        <Setter.Value> 
         <ControlTemplate TargetType="{x:Type TabItem}"> 
          <Border Name="Border" Margin="1,-1,-1,-1"> 
           <Grid> 
            <Grid.ColumnDefinitions> 
             <ColumnDefinition Width="*"/> 
             <ColumnDefinition Width="Auto"/> 
            </Grid.ColumnDefinitions> 

            <ContentPresenter Name="BorderContent" 
                 Content="{Binding Path=Header}" 
                 VerticalAlignment="Center" 
                 HorizontalAlignment="Center"/> 

            <Button x:Name="PART_Close" 
              HorizontalAlignment="Right" 
              Margin="3,0,3,0" 
              VerticalAlignment="Top" 
              Width="16" 
              Height="16" 
              DockPanel.Dock="Right" 
              Style="{DynamicResource CloseableTabItemButtonStyle}" 
              ToolTip="Close Tab" 
              Cursor="Hand" 
              Command="{Binding Path=CloseCommand}" 
              Visibility="Hidden"> 
             <Path x:Name="Path" 
               Stretch="Fill" 
               StrokeThickness="0.5" 
               Stroke="#FF333333" 
               Fill="#FF969696" 
               Data="F1 M 2.28484e-007,1.33331L 1.33333,0L 4.00001,2.66669L 6.66667,6.10352e-005L 8,1.33331L 5.33334,4L 8,6.66669L 6.66667,8L 4,5.33331L 1.33333,8L 1.086e-007,6.66669L 2.66667,4L 2.28484e-007,1.33331 Z " 
               HorizontalAlignment="Stretch" 
               VerticalAlignment="Stretch"/> 
            </Button> 
           </Grid> 
          </Border> 
          <ControlTemplate.Triggers> 
           <Trigger Property="IsMouseOver" Value="True"> 
            <Setter TargetName="Border" Property="BorderBrush" Value="{StaticResource ButtonBorderBrush}"/> 
            <Setter TargetName="Border" Property="BorderThickness" Value="2,2,2,0"/> 
            <Setter TargetName="PART_Close" Property="Visibility" Value="Visible"/> 
           </Trigger> 
           <Trigger Property="IsSelected" Value="True"> 
            <Setter TargetName="Border" Property="Background" Value="{StaticResource EnvLayout}"/> 
            <Setter Property="Foreground" Value="#FFFFFF"/> 
            <Setter TargetName="PART_Close" Property="Visibility" Value="Visible"/> 
           </Trigger> 
          </ControlTemplate.Triggers> 
         </ControlTemplate> 
        </Setter.Value> 
       </Setter> 
      </Style> 

Моя проблема сфокусирована на спусковой крючок IsMouseOver; когда табуляция не выбрана, на самом деле это событие запускается только тогда, когда курсор находится над заголовком TabItem (определенный в ContentTemplate), а не в какой-либо точке границы.

Для того, чтобы лучше объяснить мою проблему, после некоторых скриншотов:

Когда IsMouseOver = истина моей TabItem должна иметь серую рамку и кнопка закрытия должна появиться; как вы можете видеть в следующих образах, такое поведение appens только тогда, когда мой курсор находится точно над заголовком:

Очевидно, когда курсор находится не над заголовком, вы не можете даже выберите вкладку.

Как я могу решить эту проблему ??

Заранее спасибо за вашу помощь,

Deborah

Answer 1

У меня были аналогичные проблемы в последнее время,

Попробуйте изменить ваш

<ControlTemplate TargetType="{x:Type TabItem}"> 
    <Border Name="Border" Margin="1,-1,-1,-1"> 

в

<ControlTemplate TargetType="{x:Type TabItem}"> 
    <Border Name="Border" Margin="1,-1,-1,-1" Background="Transparent"> 

Кажется, что если значение по умолчанию для фона не установлено, только отображаемая область реагирует на триггеры состояния.