xaml - 如何为Settings设置动画

在Windows 8.1中，我使用的是新的SettingsFlyout控件。如果使用控件的内置后退按钮返回到“设置 super 按钮”弹出框，则弹出框会正确地进行动画设置，并进行动画处理。但是，如果您通过在弹出窗口外单击来消除亮度，则它会消失而不会显示过渡动画。

当您轻点关闭SettingsFlyout时，如何为过渡设置动画？ (我不想返回到“设置 super 按钮”弹出窗口，我只是希望它在轻微关闭时滑出。)

最佳答案

Matt，您想做的事应该很容易实现，但XAML SettingsFlyout API目前不支持。正如Jerry所指出的，有一些过渡允许动画输出效果(在XAML中，您需要EdgeUIThemeTransition)。不幸的是，在SettingsFlyout上没有API支持来添加此过渡，但是您可以使用自己的私有(private)弹出窗口来托管SettingsFlyout来使其正常工作(更多信息请参见下文):

public sealed partial class SettingsFlyout1 : SettingsFlyout
{
    Popup _p;
    Border _b;

    public SettingsFlyout1()
    {
        this.InitializeComponent();

        BackClick += SettingsFlyout1_BackClick;
        Unloaded += SettingsFlyout1_Unloaded;
        Tapped += SettingsFlyout1_Tapped;
    }

    void SettingsFlyout1_BackClick(object sender, BackClickEventArgs e)
    {
        _b.Child = null;
        SettingsPane.Show();
    }

    void SettingsFlyout1_Unloaded(object sender, RoutedEventArgs e)
    {
        if (_p != null)
        {
            _p.IsOpen = false;
        }
    }

    void SettingsFlyout1_Tapped(object sender, TappedRoutedEventArgs e)
    {
        e.Handled = true;
    }

    public void ShowCustom()
    {
        _p = new Popup();
        _b = new Border();

        _b.ChildTransitions = new TransitionCollection();

        // TODO: if you support right-to-left builds, make sure to test all combinations of RTL operating
        // system build (charms on left) and RTL flow direction for XAML app.  EdgeTransitionLocation.Left
        // may need to be used for RTL (and HorizontalAlignment.Left on the SettingsFlyout below).
        _b.ChildTransitions.Add(new EdgeUIThemeTransition() { Edge = EdgeTransitionLocation.Right });

        _b.Background = new SolidColorBrush(Colors.Transparent);
        _b.Width = Window.Current.Bounds.Width;
        _b.Height = Window.Current.Bounds.Height;
        _b.Tapped += b_Tapped;

        this.HorizontalAlignment = HorizontalAlignment.Right;
        _b.Child = this;

        _p.Child = _b;
        _p.IsOpen = true;
    }

    void b_Tapped(object sender, TappedRoutedEventArgs e)
    {
        Border b = (Border)sender;
        b.Child = null;
    }
}

此示例的完整解决方案:https://github.com/finnigantime/Samples/tree/master/examples/Win8Xaml/SettingsFlyout_AnimateOut

我认为SettingsFlyout应该为您的方案提供API支持，因此我在XAML团队中提交了一个工作项。将来，此类请求/问题也可以在MSDN论坛上提出(由MSFT人士主持)。这里的限制是，SettingsFlyout是通过IsLightDismissEnabled =“True”在Popup之上实现的，并且light-dismiss事件当前立即关闭Popup，而不允许运行卸载子过渡。我认为可以解决此问题，并且可以在SettingsFlyout API级别支持过渡以启用您的方案。

关于xaml - 如何为Settings设置动画，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/20907114/