TabItem BorderBrush가 IsMouseOver 트리거에서 업데이트되지 않습니다.

Question

내 뷰 모델의 속성이 true이고 TabItem의 IsMouseOver가 true이면 Border가 2.5 두께의 빨간색으로 표시되어야하는 MultiDataTrigger가 있습니다.

나는 속성과 IsMouseOver를 모두 사용할 수 없으므로 내 속성 만 시도했습니다. 그것은 올바르게 작동했지만 2.5 두께의 빨강이 될 때까지 탭 위에 마우스를 올려 놓을 때까지 여전히 예상되는 문제가있었습니다. 그래서 필자는 내 뷰 모델 속성을 꺼내려고했지만 IsMouseOver 검사를 조건으로 사용했습니다. 이것은 작동하지 않습니다. 아래 코드는 IsMouseOver 만 있습니다.

<TabItem x:Name="TabItemNotWorking" Header="NotWorking"> 
      <TabItem.Style> 
       <Style TargetType="TabItem"> 
        <Style.Triggers> 
         <MultiDataTrigger> 
          <MultiDataTrigger.Conditions> 
           <Condition Binding="{Binding IsMouseOver RelativeSource={RelativeSource Self}}" Value="true" /> 
           <!--<Condition Binding="{Binding Counter, Converter={StaticResource IntIsGreaterThanZeroToBool}}" Value="true" />--> 
          </MultiDataTrigger.Conditions> 
           <Setter Property="TabItem.BorderBrush" Value="Red"/> 
           <Setter Property="TabItem.BorderThickness" Value="2.5"/> 
         </MultiDataTrigger> 
        </Style.Triggers> 
       </Style> 
      </TabItem.Style>  
      <!--Content in here--> 
</TabItem> 

Mike Strobel이 TabItem 템플릿을 덮어 쓴 조언을 사용하여 수정했습니다. 이제 내 ViewModel 속성이 true 일 때마다 내 빨간 테두리가 표시됩니다.이 경우 마우스가 TabItem 위에 놓여 있더라도 상관 없습니다.

<LinearGradientBrush x:Key="TabItemHotBackground" 
        StartPoint="0,0" 
        EndPoint="0,1"> 
     <LinearGradientBrush.GradientStops> 
      <GradientStop Color="#EAF6FD" 
         Offset="0.15"/> 
      <GradientStop Color="#D9F0FC" 
         Offset=".5"/> 
      <GradientStop Color="#BEE6FD" 
         Offset=".5"/> 
      <GradientStop Color="#A7D9F5" 
         Offset="1"/> 
     </LinearGradientBrush.GradientStops> 
    </LinearGradientBrush> 
    <SolidColorBrush x:Key="TabItemSelectedBackground" 
       Color="#F9F9F9"/> 
    <SolidColorBrush x:Key="TabItemDisabledBackground" 
       Color="#F4F4F4"/> 
    <SolidColorBrush x:Key="TabItemHotBorderBrush" 
       Color="#3C7FB1"/> 
    <SolidColorBrush x:Key="TabItemDisabledBorderBrush" 
       Color="#FFC9C7BA"/> 
    <Style TargetType="{x:Type TabItem}"> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="{x:Type TabItem}"> 
        <Grid SnapsToDevicePixels="true"> 
         <Border Name="Bd" 
          Padding="{TemplateBinding Padding}" 
          BorderBrush="{TemplateBinding BorderBrush}" 
          Background="{TemplateBinding Background}" 
          BorderThickness="1,1,1,0"> 
          <ContentPresenter Name="Content" 
              ContentSource="Header" 
              SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" 
              HorizontalAlignment="{Binding Path=HorizontalContentAlignment,RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}" 
              VerticalAlignment="{Binding Path=VerticalContentAlignment,RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}" 
              RecognizesAccessKey="True"/> 
         </Border> 
        </Grid> 
        <ControlTemplate.Triggers> 
         <Trigger Property="IsMouseOver" Value="true"> 
          <Setter TargetName="Bd" Property="Background" Value="{StaticResource TabItemHotBackground}"/> 
         </Trigger> 
         <Trigger Property="IsSelected" Value="true"> 
          <Setter Property="Panel.ZIndex" Value="1"/> 
          <Setter TargetName="Bd" Property="Background" Value="{StaticResource TabItemSelectedBackground}"/> 
         </Trigger> 
         <MultiTrigger> 
          <MultiTrigger.Conditions> 
           <Condition Property="IsSelected" Value="false"/> 
           <Condition Property="IsMouseOver" Value="true"/> 
          </MultiTrigger.Conditions> 
          <Setter TargetName="Bd" Property="BorderBrush" Value="{StaticResource TabItemHotBorderBrush}"/> 
         </MultiTrigger> 

         <!--HERE ARE THE START OF MY CHANGES--> 
         <DataTrigger Binding="{Binding Counter, Converter={StaticResource IntIsGreaterThanZeroToBool}}" Value="true"> 
          <Setter TargetName="Bd" Property="BorderBrush" Value="Red"/> 
          <Setter TargetName="Bd" Property="BorderThickness" Value="2.5"/> 
         </DataTrigger> 
         <MultiDataTrigger> 
          <MultiDataTrigger.Conditions> 
           <Condition Binding="{Binding IsMouseOver, RelativeSource={RelativeSource AncestorType={x:Type TabItem}}}" Value="true" /> 
           <Condition Binding="{Binding Counter, Converter={StaticResource IntIsGreaterThanZeroToBool}}" Value="true" /> 
          </MultiDataTrigger.Conditions> 
          <Setter TargetName="Bd" Property="BorderBrush" Value="Red"/> 
          <Setter TargetName="Bd" Property="BorderThickness" Value="2.5"/> 
         </MultiDataTrigger> 
         <!--HERE ARE THE END OF MY CHANGES--> 

         <Trigger Property="TabStripPlacement" Value="Bottom"> 
          <Setter TargetName="Bd" Property="BorderThickness" Value="1,0,1,1"/> 
         </Trigger> 
         <Trigger Property="TabStripPlacement" Value="Left"> 
          <Setter TargetName="Bd" Property="BorderThickness" Value="1,1,0,1"/> 
         </Trigger> 
         <Trigger Property="TabStripPlacement" Value="Right"> 
          <Setter TargetName="Bd" Property="BorderThickness" Value="0,1,1,1"/> 
         </Trigger> 
         <MultiTrigger> 
          <MultiTrigger.Conditions> 
           <Condition Property="IsSelected" Value="true"/> 
           <Condition Property="TabStripPlacement" Value="Top"/> 
          </MultiTrigger.Conditions> 
          <Setter Property="Margin" Value="-2,-2,-2,-1"/> 
          <Setter TargetName="Content" Property="Margin" Value="0,0,0,1"/> 
         </MultiTrigger> 
         <MultiTrigger> 
          <MultiTrigger.Conditions> 
           <Condition Property="IsSelected" Value="true"/> 
           <Condition Property="TabStripPlacement" Value="Bottom"/> 
          </MultiTrigger.Conditions> 
          <Setter Property="Margin" Value="-2,-1,-2,-2"/> 
          <Setter TargetName="Content" Property="Margin" Value="0,1,0,0"/> 
         </MultiTrigger> 
         <MultiTrigger> 
          <MultiTrigger.Conditions> 
           <Condition Property="IsSelected" Value="true"/> 
           <Condition Property="TabStripPlacement" Value="Left"/> 
          </MultiTrigger.Conditions> 
          <Setter Property="Margin" Value="-2,-2,-1,-2"/> 
          <Setter TargetName="Content" Property="Margin" Value="0,0,1,0"/> 
         </MultiTrigger> 
         <MultiTrigger> 
          <MultiTrigger.Conditions> 
           <Condition Property="IsSelected" Value="true"/> 
           <Condition Property="TabStripPlacement" Value="Right"/> 
          </MultiTrigger.Conditions> 
          <Setter Property="Margin" Value="-1,-2,-2,-2"/> 
          <Setter TargetName="Content" Property="Margin" Value="1,0,0,0"/> 
         </MultiTrigger> 
         <Trigger Property="IsEnabled" Value="false"> 
          <Setter TargetName="Bd" Property="Background" Value="{StaticResource TabItemDisabledBackground}"/> 
          <Setter TargetName="Bd" Property="BorderBrush" Value="{StaticResource TabItemDisabledBorderBrush}"/> 
          <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/> 
         </Trigger> 
        </ControlTemplate.Triggers> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 

Answer 1

다음과 같은 조건 작품,하지만 탭을 선택한 경우에만 것을 알 수 : 여기 내 솔루션 (내가 수정 된 코드의 영역 주변의 의견을 넣어)입니다

<Condition Binding="{Binding IsMouseOver RelativeSource={RelativeSource Self}}" 
      Value="true" /> 

그 이유는 다음과 같습니다. Aero 테마의 기본 TabItem 템플릿에서 발췌 한 내용을 확인하십시오. 당신의 국경 브러시가 그 경우에 적용되지 않도록 탭 이을 선택하지 않은 경우

<MultiTrigger> 
    <MultiTrigger.Conditions> 
    <Condition Property="IsSelected" 
       Value="false"/> 
    <Condition Property="IsMouseOver" 
       Value="true"/> 
    </MultiTrigger.Conditions> 
    <Setter TargetName="Bd" 
      Property="BorderBrush" 
      Value="{StaticResource TabItemHotBorderBrush}"/> 
</MultiTrigger> 

스타일은 마우스 오버에 BorderBrush을 재정의합니다.

세터는 TabItemHotBorderBrush을 참조하기 위해 StaticResource을 사용하기 때문에이 리소스를 자신의 브러시로 간단히 재정의 할 수 없습니다. 기본 템플리트를 대체해야 할 것입니다.