从屏幕底部滑动时，任务栏应该可见 - UWP [关闭]

Posted 2023-04-12

【中文标题】从屏幕底部滑动时，任务栏应该可见 - UWP [关闭]

【英文标题】：when swiping from bottom of screen, taskbar should be visible - UWP [closed]

【发布时间】：2021-12-18 00:43:12

【问题描述】：

我正在开发一个应用程序，它有一个类似 stackpanel 的任务栏，其中，当我从屏幕底部滑动时，任务栏 stackpanel 必须来自屏幕下方，就像在苹果 ipad 中一样，请帮助我，在此先感谢。

【参考方案1】：

当从屏幕底部滑动时，任务栏应该是可见的 - UWP

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

例如

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>

【讨论】：

看来你的问题描述的不是很清楚，你可以尝试添加一些图片或截图。