首页 > 解决方案 > 在WPF中根据条件选择背景颜色而不会失去悬停效果

问题描述

我有这种风格:

<Style x:Key="MenuBtn" TargetType="Button">
    <Setter Property="Margin" Value="3"/>
    <Setter Property="Background" Value="{DynamicResource PN_ColorFondoAcentoClaro}"/>
    <Setter Property="Width" Value="240"/>
    <Setter Property="Height" Value="55"/>
    <Setter Property="FontFamily" Value="{DynamicResource PN_FontFamily}"/>
    <Setter Property="FontSize" Value="{DynamicResource PN_FontSizeMediana}"/>
    <Setter Property="Foreground" Value="{DynamicResource PN_ColorFuenteOscuro}"/>
    <Setter Property="FontWeight" Value="Normal"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <Border 
                        BorderBrush="{DynamicResource PN_ColorFondoAcentoClaro}"
                        BorderThickness="0.5"
                        Background="{TemplateBinding Background}"
                        CornerRadius="5">
                    <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter Property="BorderBrush" Value="{DynamicResource PN_ColorAlerta}"/>
                        <Setter Property="BorderThickness" Value="10"/>
                    </Trigger>
                    <EventTrigger RoutedEvent="Click">
                        <BeginStoryboard>
                            <Storyboard>
                                <DoubleAnimation To="220" Duration="0:0:0.7" 
                                        AccelerationRatio="0.10" DecelerationRatio="0.10" 
                                        Storyboard.TargetProperty="(Canvas.Width)" />
                                <DoubleAnimation Duration="0:0:0.7" 
                                        AccelerationRatio="0.10" DecelerationRatio="0.15" 
                                        Storyboard.TargetProperty="(Canvas.Width)" />
                            </Storyboard>
                        </BeginStoryboard>
                    </EventTrigger>
                    <EventTrigger RoutedEvent="MouseEnter">
                        <BeginStoryboard Storyboard="{StaticResource SetHoverBackgroundStoryboard}"/>
                    </EventTrigger>
                    <EventTrigger RoutedEvent="MouseLeave">
                        <BeginStoryboard Storyboard="{StaticResource RestoreBackgroundStoryboard}"/>
                    </EventTrigger>
                    <DataTrigger Binding="{Binding IsFavorite}" Value="True">
                        <Setter Property="Background" Value="{DynamicResource PN_ColorFondoAcentoClaro}"/>
                    </DataTrigger>
                    <DataTrigger Binding="{Binding IsFavorite}" Value="False">
                        <Setter Property="Background" Value="Transparent"/>
                    </DataTrigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

我需要显示一些选项,有些选项被标记为带有IsFavorite属性的收藏夹。当 IsFavorite 处于活动状态时,我想显示不同的颜色。我为此使用了两个数据触发器

<DataTrigger Binding="{Binding IsFavorite}" Value="True">
    <Setter Property="Background" Value="{DynamicResource PN_ColorFondoAcentoClaro}"/>
</DataTrigger>
<DataTrigger Binding="{Binding IsFavorite}" Value="False">
    <Setter Property="Background" Value="Transparent"/>
</DataTrigger>

它们工作得很好,但我的鼠标悬停现在什么也没显示。这就是我尝试的原因

<Storyboard x:Key="SetHoverBackgroundStoryboard">
    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background">
        <DiscreteObjectKeyFrame 
            KeyTime="0:0:0"
            Value="{StaticResource PN_ColorAlerta}" />
    </ObjectAnimationUsingKeyFrames>
</Storyboard>

<Storyboard x:Key="RestoreBackgroundStoryboard">
    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background">
        <DiscreteObjectKeyFrame 
            KeyTime="0:0:0"
            Value="{StaticResource PN_ColorFondoAcentoClaro}" />
    </ObjectAnimationUsingKeyFrames>
</Storyboard>    

SetHoverBackgroundStoryboard将我的背景设置为悬停,但是当我使用RestoreBackgroundStoryboard时,不知道如何使用IsFavorite再次显示我的原始颜色。

有没有办法结合DataTrigger和EventTrigger来解决呢?DataTrigger更改我的控件背景时如何避免松散的悬停背景效果?

或者

我做错了什么?

标签: wpfxaml

解决方案


您可以使用 aDataTrigger 来组合多个条件,例如 that IsFavoriteistrue IsMouseOveris also true

<MultiDataTrigger>
    <MultiDataTrigger.Conditions>
        <Condition Binding="{Binding IsFavorite}" Value="True" />
        <Condition Binding="{Binding IsMouseOver, RelativeSource={RelativeSource Self}}" Value="True" />
    </MultiDataTrigger.Conditions>
    <Setter Property="Background" Value="Red" />
</MultiDataTrigger>

推荐阅读