Question

我有一个MultiDataTrigger，如果我的视图模型中的属性为true且TabItem上的IsMouseOver为true，则Border应显示为红色，厚度为2.5。

我无法同时使用属性和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，我的红色边框就会显示，无论mouser是否悬停在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，因此在这种情况下不会应用边框画笔。

由于setter使用StaticResource来引用TabItemHotBorderBrush，因此您无法使用自己的画笔覆盖此资源。您可能必须覆盖默认模板。

TabItem BorderBrush不在IsMouseOver触发器上更新

1 个答案: