Question

您好我遇到了无法解决的性能问题。使用Blend，我创建了一个显示和隐藏网格的动画。选中切换开关按钮时会调用它，它会起作用。问题是，它工作真的很滞后，并在几秒钟的延迟后调用。我在诺基亚Lumia 920上测试应用程序。你能帮我找出问题所在吗？

以下是使用blend：

创建的动画代码

<VisualStateManager.VisualStateGroups>
            <VisualStateGroup x:Name="Collapsing">
                <VisualStateGroup.Transitions>
                    <VisualTransition GeneratedDuration="0:0:0.5" />
                </VisualStateGroup.Transitions>
                <VisualState x:Name="Hidden">
                    <Storyboard>
                        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Height)"
                                                       Storyboard.TargetName="CollapsingGrid">
                            <EasingDoubleKeyFrame KeyTime="0"
                                                  Value="95" />
                            <EasingDoubleKeyFrame KeyTime="0:0:0.5"
                                                  Value="0">
                                <EasingDoubleKeyFrame.EasingFunction>
                                    <CubicEase EasingMode="EaseOut" />
                                </EasingDoubleKeyFrame.EasingFunction>
                            </EasingDoubleKeyFrame>
                        </DoubleAnimationUsingKeyFrames>
                        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Height)"
                                                       Storyboard.TargetName="anonymousOnLabel">
                            <EasingDoubleKeyFrame KeyTime="0:0:0.5"
                                                  Value="0" />
                            <EasingDoubleKeyFrame KeyTime="0:0:1"
                                                  Value="91" />
                        </DoubleAnimationUsingKeyFrames>
                        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Height)"
                                                       Storyboard.TargetName="SettingsSharePicTglBtn">
                            <EasingDoubleKeyFrame KeyTime="0"
                                                  Value="95" />
                            <EasingDoubleKeyFrame KeyTime="0:0:0.5"
                                                  Value="0" />
                        </DoubleAnimationUsingKeyFrames>
                    </Storyboard>
                </VisualState>
                <VisualState x:Name="Unhidden">
                    <Storyboard>
                        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Height)"
                                                       Storyboard.TargetName="CollapsingGrid">
                            <EasingDoubleKeyFrame KeyTime="0:0:0.5"
                                                  Value="0" />
                            <EasingDoubleKeyFrame KeyTime="0:0:1"
                                                  Value="95">
                                <EasingDoubleKeyFrame.EasingFunction>
                                    <CubicEase EasingMode="EaseOut" />
                                </EasingDoubleKeyFrame.EasingFunction>
                            </EasingDoubleKeyFrame>
                        </DoubleAnimationUsingKeyFrames>
                        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Height)"
                                                       Storyboard.TargetName="anonymousOnLabel">
                            <EasingDoubleKeyFrame KeyTime="0"
                                                  Value="91" />
                            <EasingDoubleKeyFrame KeyTime="0:0:0.5"
                                                  Value="0" />
                        </DoubleAnimationUsingKeyFrames>
                        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Height)"
                                                       Storyboard.TargetName="SettingsSharePicTglBtn">
                            <EasingDoubleKeyFrame KeyTime="0"
                                                  Value="0" />
                            <EasingDoubleKeyFrame KeyTime="0:0:0.5"
                                                  Value="95" />
                        </DoubleAnimationUsingKeyFrames>
                    </Storyboard>
                </VisualState>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>

我通过以下方式调用它：

private void TglBtn_Tap(object sender, System.Windows.Input.GestureEventArgs e)
        {
            if ((bool)((ToggleSwitchButton)sender).IsChecked)
            {
                VisualStateManager.GoToState(this, "Unhidden", true);
            }
            else
            {
                VisualStateManager.GoToState(this, "Hidden", true);
            }
        }

Answer 1

我建议不动画宽度和高度属性。每次这些属性改变时，在可视树上执行完整的度量/排列传递，这是非常昂贵的。相反，您应该尝试在网格的RenderTransform上从 1.0到0.0 设置比例的动画。

现在，您可能需要设置高度的动画，因为您希望堆叠在网格下方的东西向上移动以填充网格占用的空间。在这种情况下，您可能需要执行一些视觉欺骗，例如在网格下面的内容上动画翻译以将其移动，然后在动画的最后，作为最后一个关键帧，可以重置RenderTransforms并折叠网格。然后，每个动画帧只会受到一次测量/排列过程而不是一次。

最后，我建议您阅读Windows Phone性能注意事项。这是一份很好的文件：http://bit.ly/15cExFz

这两个演讲很精彩。我不能推荐他们。 http://channel9.msdn.com/events/PDC/PDC10/CD03＆amp; http://channel9.msdn.com/Events/Build/2012/3-048

Answer 2

我遇到了类似的问题，但我使用DoubleAnimation为PlaneProjection的RotationX，RotationY属性设置了动画。已经从article找到了问题的解决方案。并且它添加了以“0.1”结尾的“魔术”数字 - 它告诉系统它是基于控件宽度的比率，它是属性的黑客超载，但它在某些情况下提供了真正的性能增长。

<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Height)" Storyboard.TargetName="anonymousOnLabel">
    <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="0.1" />
    <EasingDoubleKeyFrame KeyTime="0:0:1" Value="91.1" />
</DoubleAnimationUsingKeyFrames>

当然，直接设置Width和Height属性并不是一个好主意，因为它将是Dependent Animation并会对性能产生影响。

Windows Phone上的Laggy动画

2 个答案: