Grid.Row上的动画(全局偏移)

本文关键字:全局 动画 Row Grid | 更新日期: 2023-09-27 17:58:48

我得到了这个UserControl,它是一个大约有10行10列的网格。每个单元格包含1个文本块或1-6个图像。我想做的是为每一行上的所有元素设置动画,以便在其中滑动。然而,我找不到一种方法来设置整个网格的动画。row可以做到这一点。

我也不能将所有元素包装在stackpanel/canvas中,因为这会将它们放在同一列中。。。

有人能解决这个问题吗?

感谢

Grid.Row上的动画(全局偏移)

所以我提出了一个有效的解决方案,它正在发挥作用。也许没有那么优雅,但它做了它应该做的事情,在Lumia 920设备上运行得很好。

void CreateLoadAnimationForRow(int row, int startTime)
    {
        foreach (var child in LayoutRoot.Children.Cast<FrameworkElement>().Where(x => Grid.GetRow(x) == row))
        {
            AddToStoryboard(child, startTime);
        }
    }
    void AddToStoryboard(FrameworkElement element, int startTime)
    {
        element.RenderTransform = new CompositeTransform();
        var doubleAnimation = new DoubleAnimation
        {
            From = -200,
            To = 0,
            Duration = new Duration(TimeSpan.FromSeconds(1)),
            BeginTime = TimeSpan.FromMilliseconds(startTime)
        };
        var objectAnimationUsingKeyFrames = new ObjectAnimationUsingKeyFrames()
        {
            BeginTime = TimeSpan.FromMilliseconds(startTime + 10)
        };
        var discreteObjectKeyFrame = new DiscreteObjectKeyFrame()
        {
            KeyTime = KeyTime.FromTimeSpan(TimeSpan.FromSeconds(0)),
            Value = Visibility.Visible
        };
        objectAnimationUsingKeyFrames.KeyFrames.Add(discreteObjectKeyFrame);
        IEasingFunction easingFunction = new SineEase();
        easingFunction.Ease(2);
        doubleAnimation.EasingFunction = easingFunction;
        Storyboard.SetTarget(objectAnimationUsingKeyFrames, element);
        Storyboard.SetTargetProperty(objectAnimationUsingKeyFrames, new PropertyPath("Visibility"));
        Storyboard.SetTarget(doubleAnimation, element);
        Storyboard.SetTargetProperty(doubleAnimation, new PropertyPath("(FrameworkElement.RenderTransform).(CompositeTransform.TranslateX)"));
        storyboardSlideIn.Children.Add(doubleAnimation);
        storyboardSlideIn.Children.Add(objectAnimationUsingKeyFrames);
    }