如何在 Xamarin Forms 中创建带有上下移动动画的弹出视图

如何解决如何在 Xamarin Forms 中创建带有上下移动动画的弹出视图

我需要一个向下滑动的弹出视图来关闭弹出窗口

弹出窗口应根据手指的移动进行动画

解决方法

您可以通过在布局（框架、网格、堆栈布局等）中添加 PanGestureRecognizer 来实现此动画

我在这里提供了此类动画的示例

用于弹出窗口的 Xaml：

<pages:PopupPage
        x:Class="Examaple.Views.Controls.Popups.DemoPopup"
        xmlns="http://xamarin.com/schemas/2014/forms"
        xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
        BackgroundClicked="Cancel_Tapped"
        CloseWhenBackgroundIsClicked="False">
    <Frame
            x:Name="RecordPlayFrame"       
            BackgroundColor="White"
            HorizontalOptions="FillAndExpand"
            VerticalOptions="EndAndExpand">
            <Frame.GestureRecognizers>
                <PanGestureRecognizer  PanUpdated="PanGestureRecognizer_PanUpdated" />
            </Frame.GestureRecognizers>
    
    </Frame>
</pages:PopupPage>

PanGestureRecognizer_PanUpdated 弹出动画的 C# 代码：

private async void PanGestureRecognizer_PanUpdated(object sender,PanUpdatedEventArgs e)
{           
    switch (e.StatusType)
    {
        case GestureStatus.Running:
            if (e.TotalY > 0)
            {
               await RecordPlayFrame.TranslateTo(0,e.TotalY);
               Verticaltransition = e.TotalY;                     
            }
            break;
        case GestureStatus.Completed:
            if (Verticaltransition > 75)
            {
                await RecordPlayFrame.TranslateTo(0,200,100);
                if (PopupNavigation.Instance.PopupStack.Any())
                {
                    await PopupNavigation.Instance.PopAsync();
                }
            }
            else
            {
               await RecordPlayFrame.TranslateTo(0,e.TotalY);
            }
            break;
    }            
}

我希望这个答案能解决你的问题

,

也遇到了这个。 https://github.com/rotorgames/Rg.Plugins.Popup。可能需要更改一些实现以使其具有动画效果。这将允许您拥有所需的任何自定义弹出窗口。