Question

我有自定义用户控件。部分是指示选择的矩形。我希望在用户绘制它之后为其设置动画。我有以下方法

private AnimationTimeline StartRectangleHeightAnimation(Rectangle rectangle)
{
    return new DoubleAnimation(
        SUB_SELECTION_HEIGHT_RATIO * selectionCanvas.RenderSize.Height, 
        TimeSpan.FromMilliseconds(500));
}

表示矩形高度和

private AnimationTimeline StartRectangleMarginAnimation(Rectangle rectangle)
{
    Thickness t = new Thickness(rectangle.Margin.Left,
        (selectionCanvas.RenderSize.Height - rectangle.Height) / 2,
        rectangle.Margin.Right, rectangle.Margin.Bottom);

    ThicknessAnimation animation = new ThicknessAnimation(t, TimeSpan.FromMilliseconds(500));
    animation.EasingFunction = new ExponentialEase()
    {
        EasingMode = EasingMode.EaseOut,
        Exponent = -5
    };
    animation.Completed += (s, e) =>
    {
        // DO STUFF.
    };
    return animation;
}

现在，这些动画中的每一个都可以独立工作，我可以做到

var animation = StartRectangleMarginAnimation(rectangle);
rectangle.BeginAnimation(Rectangle.MarginProperty, animation);

或

var animation = StartRectangleHeightAnimation(rectangle);
rectangle.BeginAnimation(Rectangle.HeightProperty, animation);

但不是两者兼而有之。据我所知，一个动画“覆盖”另一个动画。所以我们需要Storyboard，所以。我现在有

AnimationTimeline shrink = StartRectangleHeightAnimation(rectangle);
AnimationTimeline move = StartRectangleMarginAnimation(rectangle);

Storyboard.SetTarget(shrink, rectangle);
Storyboard.SetTargetProperty(shrink, new PropertyPath(Rectangle.HeightProperty));

Storyboard.SetTarget(move, rectangle);
Storyboard.SetTargetProperty(move, new PropertyPath(Rectangle.MarginProperty));

Storyboard storyboard = new Storyboard();
storyboard.Children.Add(shrink);
storyboard.Children.Add(move);
storyboard.Begin(this);

但是这会激活身高，但不是边际。我在这里做错了什么？

Answer 1

我在我的窗口中创建了一个矩形

<Rectangle x:Name="rectangle" Fill="#FF4A4AE8" HorizontalAlignment="Left" Height="100" Margin="44,69,100,50" Stroke="Black" VerticalAlignment="Top" Width="100"/>

并使用此代码：

  private AnimationTimeline StartRectangleMarginAnimation(Rectangle rectangle)
    {           
        Thickness t = new Thickness(rectangle.Margin.Left+20, rectangle.Margin.Top-50, rectangle.Margin.Right, rectangle.Margin.Bottom);

        ThicknessAnimation animation = new ThicknessAnimation(t, TimeSpan.FromMilliseconds(500));
        animation.EasingFunction = new ExponentialEase()
        {
            EasingMode = EasingMode.EaseOut,
            Exponent = -5
        };
        animation.Completed += (s, e) =>
        {
            // DO STUFF.
        };
        return animation;
    }
    private AnimationTimeline StartRectangleHeightAnimation(Rectangle rectangle)
    {
        return new DoubleAnimation(
            20,
            TimeSpan.FromMilliseconds(500));
    }

    private void Button_Click_1(object sender, RoutedEventArgs e)
    {
        AnimationTimeline shrink = StartRectangleHeightAnimation(rectangle);
        AnimationTimeline move = StartRectangleMarginAnimation(rectangle);

        Storyboard.SetTarget(shrink, rectangle);
        Storyboard.SetTargetProperty(shrink, new PropertyPath(Rectangle.HeightProperty));

        Storyboard.SetTarget(move, rectangle);
        Storyboard.SetTargetProperty(move, new PropertyPath(Rectangle.MarginProperty));

        Storyboard storyboard = new Storyboard();
        storyboard.Children.Add(shrink);
        storyboard.Children.Add(move);
        storyboard.Begin(this);
    }

所有动画都适当且同时动画。我稍后会删除这个答案。

WPF中同一对象上的两个动画

1 个答案: