带有枚举的WPF属性触发器

时间:2013-05-02 19:12:46

标签: c# wpf

我有一个带有用户控件的WPF C#应用程序我希望在3个状态之间设置动画。

用户控件:

    public partial class Cart : UserControl
{
    /// <summary>
    /// The <see cref="Layout" /> dependency property's name.
    /// </summary>
    public const string LayoutPropertyName = "Layout";

    /// <summary>
    /// Gets or sets the value of the <see cref="Layout" />
    /// property. This is a dependency property.
    /// </summary>
    public Visibility Layout
    {
        get
        {
            return (Visibility)GetValue(LayoutProperty);
        }
        set
        {
            SetValue(LayoutProperty, value);
        }
    }

    public static readonly DependencyProperty LayoutProperty = DependencyProperty.Register(
        LayoutPropertyName,
        typeof(Visibility),
        typeof(Carrito),
        new PropertyMetadata(Visibility.Hidden));
}

另外,我有一个Styles.xaml,我在其中定义3个故事板,我打算重复使用属性触发器将控件放在不同的位置。

    <Storyboard x:Key="CartVisible">
    <ThicknessAnimation Storyboard.TargetProperty="Margin" Duration="0:0:0.5" To="0,648,0,0" />
</Storyboard>
<Storyboard x:Key="CartCollapsed">
    <ThicknessAnimation Storyboard.TargetProperty="Margin" Duration="0:0:0.5" To="0,736,0,0" />
</Storyboard>
<Storyboard x:Key="CartHidden">
    <ThicknessAnimation Storyboard.TargetProperty="Margin" Duration="0:0:0.5" To="0,768,0,0" />
</Storyboard>
<Style TargetType="c:Cart" TargetType="FrameworkElement">
    <Setter Property="Margin" Value="0,768,0,0" />
    <Style.Triggers>
        <Trigger Property="Layout" Value="Visible">
            <Trigger.EnterActions>
                <BeginStoryboard Storyboard="{StaticResource CartVisible}" />
            </Trigger.EnterActions>
            <Trigger.ExitActions>
                <BeginStoryboard Storyboard="{StaticResource CartHidden}" />
            </Trigger.ExitActions>
        </Trigger>
        <Trigger Property="Layout" Value="Collapsed">
            <Trigger.EnterActions>
                <BeginStoryboard Storyboard="{StaticResource CartCollapsed}" />
            </Trigger.EnterActions>
            <Trigger.ExitActions>
                <BeginStoryboard Storyboard="{StaticResource CartVisible}" />
            </Trigger.ExitActions>
        </Trigger>
        <Trigger Property="Layout" Value="Hidden">
            <Trigger.EnterActions>
                <BeginStoryboard Storyboard="{StaticResource CartHidden}" />
            </Trigger.EnterActions>
            <Trigger.ExitActions>
                <BeginStoryboard Storyboard="{StaticResource CartVisible}" />
            </Trigger.ExitActions>
        </Trigger>
    </Style.Triggers>
</Style>

然后,我有一个xaml绑定到属性Layout,它触发属性值更改。

问题在于动画并不总是适用于每个状态更改。我见过的所有例子都是使用Enter和ExitActions的bool属性,但是这里我有3个可能会有所不同。

是否有一种很好的方法可以使这项工作?

由于

1 个答案:

答案 0 :(得分:0)

我已经能够使用Animation not working correctly with data triggers

的解决方案来修复它

我们的想法是在EnterActions中定义Storyboard,在 BeginStoryboard之前定义,确保删除所有其他Storyboard。

固定代码是这样的:(请注意s:S.Cart ......这是另一个类中的常量)。

<Style TargetType="c:Cart">
    <Setter Property="Margin" Value="{x:Static s:S+Cart.Hidden}" />
    <Style.Triggers>
        <Trigger Property="Layout" Value="Visible">
            <Trigger.EnterActions>
                <RemoveStoryboard BeginStoryboardName="CartCollapsed" />
                <RemoveStoryboard BeginStoryboardName="CartHidden" />
                <BeginStoryboard Name="CartVisible">
                    <Storyboard>
                        <ThicknessAnimation Storyboard.TargetProperty="Margin"
                                    Duration="0:0:0.5"
                                    To="{x:Static s:S+Cart.Visible}" />
                    </Storyboard>
                </BeginStoryboard>
            </Trigger.EnterActions>
        </Trigger>
        <Trigger Property="Layout" Value="Collapsed">
            <Trigger.EnterActions>
                <RemoveStoryboard BeginStoryboardName="CartVisible" />
                <RemoveStoryboard BeginStoryboardName="CartHidden" />
                <BeginStoryboard Name="CartCollapsed">
                    <Storyboard>
                        <ThicknessAnimation Storyboard.TargetProperty="Margin"
                                    Duration="0:0:0.5"
                                    To="{x:Static s:S+Cart.Collapsed}" />
                    </Storyboard>
                </BeginStoryboard>
            </Trigger.EnterActions>
        </Trigger>
        <Trigger Property="Layout" Value="Hidden">
            <Trigger.EnterActions>
                <RemoveStoryboard BeginStoryboardName="CartVisible" />
                <RemoveStoryboard BeginStoryboardName="CartCollapsed" />
                <BeginStoryboard Name="CartHidden">
                    <Storyboard>
                        <ThicknessAnimation Storyboard.TargetProperty="Margin"
                                    Duration="0:0:0.5"
                                    To="{x:Static s:S+Cart.Hidden}" />
                    </Storyboard>
                </BeginStoryboard>
            </Trigger.EnterActions>
        </Trigger>
    </Style.Triggers>