0

我一直在尝试让 WPF 多数据触发器在基于此控件http://marcangers.com/animated-switch-togglebutton-style-in-wpf/的自定义 ToggleButton 上触发故事板动画。切换按钮是常规 WPF ToggleButton 的扩展，具有自定义属性 Status 将显示为已修改或未修改。我的 MultiDataTrigger 触发切换按钮 IsChecked 和状态是否已修改或未修改。问题是，故事板根本没有触发。当我在常规触发器中有故事板动画时，它工作得很好。这是自定义切换按钮。

CustomToggleButton.xaml

<ToggleButton x:Class="DPC9600CustomControlLibrary.CustomToggleButton"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         xmlns:local="clr-namespace:ControlLibrary"
         mc:Ignorable="d" 
         d:DesignHeight="300" d:DesignWidth="300">
    <ToggleButton.Resources>
        <ResourceDictionary Source="Themes/Styles_CustomToggleButton.xaml"/>
    </ToggleButton.Resources>
    <ToggleButton.Style>
        <Style TargetType="{x:Type ToggleButton}" BasedOn="{StaticResource CustomToggleButton}"/>
    </ToggleButton.Style>
</ToggleButton>

CustomToggleButton.xaml.cs

public partial class CustomToggleButton : ToggleButton
{
    public static readonly DependencyProperty StatusProperty =
        DependencyProperty.Register("Status", typeof(ConfigurationValueStatus), typeof(CustomToggleButton));



    public ConfigurationValueStatus Status
    {
        get { return (ConfigurationValueStatus) GetValue(StatusProperty); }
        set { SetValue(StatusProperty, value); }
    }

    public CustomToggleButton()
    {
        InitializeComponent();
    }
}

这是我在 Styles_CustomToggleButton.xaml 中的多数据触发器

<MultiDataTrigger>
    <MultiDataTrigger.Conditions>
        <Condition Binding="{Binding RelativeSource={RelativeSource Self}, Path=IsChecked}" Value="True"/>
        <Condition Binding="{Binding Status,ElementName=Myself}" Value="Unmodified"/>
    </MultiDataTrigger.Conditions>
    <MultiDataTrigger.EnterActions>
        <BeginStoryboard>
            <Storyboard>
                <ColorAnimation Storyboard.TargetProperty="Background.Color" To="#FF377EC1" Duration="0:0:0.2" />
                <ColorAnimation Storyboard.TargetProperty="BorderBrush.Color" To="#FF377EC1" Duration="0:0:0.2" />
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Ellipse.RenderTransform).(TranslateTransform.X)" Storyboard.TargetName="ellipse">
                    <SplineDoubleKeyFrame KeyTime="0" Value="0"/>
                    <SplineDoubleKeyFrame KeyTime="0:0:0.4" Value="15" KeySpline="0, 1, 0.6, 1"/>
                </DoubleAnimationUsingKeyFrames>
            </Storyboard>
        </BeginStoryboard>
    </MultiDataTrigger.EnterActions>
    <MultiDataTrigger.ExitActions>
        <BeginStoryboard>
            <Storyboard>
                <ColorAnimation Storyboard.TargetProperty="Background.Color" To="#FAFAFB" Duration="0:0:0.2" />
                <ColorAnimation Storyboard.TargetProperty="BorderBrush.Color" To="#EAEAEB" Duration="0:0:0.2" />
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Ellipse.RenderTransform).(TranslateTransform.X)" Storyboard.TargetName="ellipse">
                    <SplineDoubleKeyFrame KeyTime="0" Value="15"/>
                    <SplineDoubleKeyFrame KeyTime="0:0:0.3" Value="0" KeySpline="0, 0.5, 0.5, 1"/>
                </DoubleAnimationUsingKeyFrames>
            </Storyboard>
        </BeginStoryboard>
    </MultiDataTrigger.ExitActions>
</MultiDataTrigger>
<MultiDataTrigger>
    <MultiDataTrigger.Conditions>
        <Condition Binding="{Binding RelativeSource={RelativeSource Self}, Path=IsChecked}" Value="True"/>
        <Condition Binding="{Binding Status,ElementName=Myself}" Value="Modified"/>
    </MultiDataTrigger.Conditions>
    <MultiDataTrigger.EnterActions>
        <BeginStoryboard>
            <Storyboard>
                <ColorAnimation Storyboard.TargetProperty="Background.Color" To="Goldenrod" Duration="0:0:0.2" />
                <ColorAnimation Storyboard.TargetProperty="BorderBrush.Color" To="Goldenrod" Duration="0:0:0.2" />
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Ellipse.RenderTransform).(TranslateTransform.X)" Storyboard.TargetName="ellipse">
                    <SplineDoubleKeyFrame KeyTime="0" Value="0"/>
                    <SplineDoubleKeyFrame KeyTime="0:0:0.4" Value="15" KeySpline="0, 1, 0.6, 1"/>
                </DoubleAnimationUsingKeyFrames>
            </Storyboard>
        </BeginStoryboard>
    </MultiDataTrigger.EnterActions>
    <MultiDataTrigger.ExitActions>
        <BeginStoryboard>
            <Storyboard>
                <ColorAnimation Storyboard.TargetProperty="Background.Color" To="#FAFAFB" Duration="0:0:0.2" />
                <ColorAnimation Storyboard.TargetProperty="BorderBrush.Color" To="#EAEAEB" Duration="0:0:0.2" />
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Ellipse.RenderTransform).(TranslateTransform.X)" Storyboard.TargetName="ellipse">
                    <SplineDoubleKeyFrame KeyTime="0" Value="15"/>
                    <SplineDoubleKeyFrame KeyTime="0:0:0.3" Value="0" KeySpline="0, 0.5, 0.5, 1"/>
                </DoubleAnimationUsingKeyFrames>
            </Storyboard>
        </BeginStoryboard>
    </MultiDataTrigger.ExitActions>
</MultiDataTrigger>

我不确定我做错了什么，使用常规触发器可以使动画正常工作。下面来看看触发器。

<Trigger Property="IsChecked" Value="true" >
    <Trigger.EnterActions>
        <BeginStoryboard>
            <Storyboard>
                <ColorAnimation Storyboard.TargetProperty="Background.Color" To="#FF377EC1" Duration="0:0:0.2" />
                <ColorAnimation Storyboard.TargetProperty="BorderBrush.Color" To="#FF377EC1" Duration="0:0:0.2" />
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Ellipse.RenderTransform).(TranslateTransform.X)" Storyboard.TargetName="ellipse">
                    <SplineDoubleKeyFrame KeyTime="0" Value="0"/>
                    <SplineDoubleKeyFrame KeyTime="0:0:0.4" Value="15" KeySpline="0, 1, 0.6, 1"/>
                </DoubleAnimationUsingKeyFrames>
            </Storyboard>
        </BeginStoryboard>
    </Trigger.EnterActions>
    <Trigger.ExitActions>
        <BeginStoryboard>
            <Storyboard>
                <ColorAnimation Storyboard.TargetProperty="Background.Color" To="#FAFAFB" Duration="0:0:0.2" />
                <ColorAnimation Storyboard.TargetProperty="BorderBrush.Color" To="#EAEAEB" Duration="0:0:0.2" />
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Ellipse.RenderTransform).(TranslateTransform.X)" Storyboard.TargetName="ellipse">
                    <SplineDoubleKeyFrame KeyTime="0" Value="15"/>
                    <SplineDoubleKeyFrame KeyTime="0:0:0.3" Value="0" KeySpline="0, 0.5, 0.5, 1"/>
                </DoubleAnimationUsingKeyFrames>
            </Storyboard>
        </BeginStoryboard>
    </Trigger.ExitActions>
</Trigger>
4

2 回答 2

1

Myself我在您的 XAML 中找不到 的定义。

如果这是在Style.Triggers（我很确定是），我认为绑定Status应该是{Binding Status, RelativeSource={RelativeSource Self}，就像你的IsChecked绑定一样。

如果我错了并且ControlTemplate.Triggers它{Binding Status, RelativeSource={RelativeSource TemplatedParent}在IsChecked.

于 2016-10-10T15:10:19.717 回答
0

问题在于<Condition Binding="{Binding Status,ElementName=Myself}" Value="Modified"/>我所要做的就是将其切换到<Condition Binding="{Binding Status, RelativeSource={RelativeSource=Self}}" Value="Modified"/>

此更改修复了样式触发器。

于 2016-10-10T15:00:02.927 回答