从屏幕底部滑动时,任务栏应该可见 - UWP

when swiping from bottom of screen, taskbar should be visible - UWP

我正在开发一个应用程序,它有一个类似 stackpanel 的任务栏,其中,当我从屏幕底部滑动时,任务栏 stackpanel 必须来自屏幕下方,就像在 apple ipad 中一样,请帮助我,提前非常感谢.

when swiping from bottom of screen, taskbar should be visible - UWP

根据您的要求,您需要检测任务栏ManipulationDelta事件,如果Cumulative.Translation.Y超过您的阈值则调用双重动画移动任务栏向下或向上。

例如

private bool _isSwiped;
private void StackPanel_ManipulationDelta(object sender, ManipulationDeltaRoutedEventArgs e)
{
    if (e.IsInertial && !_isSwiped)
    {
        var swipedDistance = e.Cumulative.Translation.Y;

        if (Math.Abs(swipedDistance) <= 2) return;

        if (swipedDistance > 0)
        {
            Debug.WriteLine("down Swiped");
            DownAnimiation.Begin();
        }
        else
        {
            UpAnimation.Begin();
            Debug.WriteLine("up Swiped");            
        }
        _isSwiped = true;
    }
}

private void StackPanel_ManipulationCompleted(object sender, ManipulationCompletedRoutedEventArgs e)
{
    _isSwiped = false;
}

Xaml代码

<Grid>
    <Grid.Resources>
        <Storyboard x:Name="DownAnimiation">
            <DoubleAnimation
                Storyboard.TargetName="BottomPanel"
                Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)"
                To="93"
                Duration="0:0:0.5">
                <DoubleAnimation.EasingFunction>
                    <BackEase />
                </DoubleAnimation.EasingFunction>
            </DoubleAnimation>
        </Storyboard>
        <Storyboard x:Name="UpAnimation">
            <DoubleAnimation
                Storyboard.TargetName="BottomPanel"
                Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)"
                To="0"
                Duration="0:0:0.5">
                <DoubleAnimation.EasingFunction>
                    <BackEase />
                </DoubleAnimation.EasingFunction>
            </DoubleAnimation>
        </Storyboard>
    </Grid.Resources>

    <StackPanel
        x:Name="BottomPanel"
        Height="95"
        Margin="5"
        VerticalAlignment="Bottom"
        Background="PaleGreen"
        CornerRadius="5"
        ManipulationCompleted="StackPanel_ManipulationCompleted"
        ManipulationDelta="StackPanel_ManipulationDelta"
        ManipulationMode="TranslateY,TranslateInertia,System">
        <StackPanel.RenderTransform>
            <CompositeTransform />
        </StackPanel.RenderTransform>
    </StackPanel>
</Grid>