如何为任何控件的可见性变化提供滑动动画

Question

我想为堆栈面板的可见性变化提供动画。 windows 10 的 Paint 3D 提供了单击菜单按钮时用于导航视图的动画幻灯片。我想对堆栈面板的可见性进行相同的滑动效果改变。我尝试使用 Microsoft.Toolkit.Uwp.UI.Animations 和以下代码

来制作动画

          <animations:Implicit.ShowAnimations>
            <animations:TranslationAnimation  Duration="0:0:1" From="0" To="1">
                <animations:ScalarKeyFrame Key="0.2" Value="0.6"/>
                <animations:ScalarKeyFrame Key="0.4" Value="0.3"/>
                <animations:ScalarKeyFrame Key="0.6" Value="0.8"/>
                <animations:ScalarKeyFrame Key="0.8" Value="0.5"/>
            </animations:TranslationAnimation>
        </animations:Implicit.ShowAnimations>

        <animations:Implicit.HideAnimations>
            <animations:OpacityAnimation Duration="0:0:1" From="1" To="0">
                <animations:ScalarKeyFrame Key="0.2" Value="0.5"/>
                <animations:ScalarKeyFrame Key="0.4" Value="0.8"/>
                <animations:ScalarKeyFrame Key="0.6" Value="0.3"/>
                <animations:ScalarKeyFrame Key="0.8" Value="0.6"/>
            </animations:OpacityAnimation>
        </animations:Implicit.HideAnimations>

但这只是让堆栈面板淡入淡出，我想从左向右滑动它。

Answer 1

您可以将多个项目放在一个 <animations:Implicit.ShowAnimations> 元素中，这样您就可以在其中添加 Translation 和 Opacity 动画。

另外，翻译使用绝对值，所以你所做的只是将面板当前向右移动一个像素，这是难以察觉的。例如，尝试设置 From="-200" 和 To="0"。

如何为任何控件的可见性变化提供滑动动画

How to provide sliding animation on visibility change for any control

c#

uwp

uwp-xaml