xamarin弹框的实现 Rg.Plugins.Popup

引用包：

Rg.Plugins.Popup

初始化：

找到MainActivity文件，在OnCreate方法中，进行初始化

// 初始化
Rg.Plugins.Popup.Popup.Init(this);

完整OnCreate方法

protected override void OnCreate(Bundle savedInstanceState)
        {
            base.OnCreate(savedInstanceState);

            // 初始化
            Rg.Plugins.Popup.Popup.Init(this); // 只添加这个

            Xamarin.Essentials.Platform.Init(this, savedInstanceState);
            global::Xamarin.Forms.Forms.Init(this, savedInstanceState);
            LoadApplication(new App());
        }

定义弹框界面

之前：

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="App1.Alert1">
    <ContentPage.Content>
        <StackLayout>
            <Label Text="Welcome to Xamarin.Forms!"
                VerticalOptions="CenterAndExpand" 
                HorizontalOptions="CenterAndExpand" />
        </StackLayout>
    </ContentPage.Content>
</ContentPage>

namespace App1
{
    [XamlCompilation(XamlCompilationOptions.Compile)]
    public partial class Alert1 : ContentPage
    {
        public Alert1()
        {
            InitializeComponent();
        }
    }
}

之后：

<?xml version="1.0" encoding="utf-8" ?>
<!--使用pages:PopupPage -->
<pages:PopupPage    xmlns="http://xamarin.com/schemas/2014/forms"
                    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
                    引入包
                    xmlns:pages="clr-namespace:Rg.Plugins.Popup.Pages;assembly=Rg.Plugins.Popup"
                    xmlns:animations="clr-namespace:Rg.Plugins.Popup.Animations;assembly=Rg.Plugins.Popup"
                    
                    x:Class="App1.Alert1">
    
    <!--设置动画-->
    <pages:PopupPage.Animation>
        <animations:ScaleAnimation 
            PositionIn="Center"
            PositionOut="Center"
            ScaleIn="1.2"
            ScaleOut="0.8"
            DurationIn="400"
            DurationOut="300"
            EasingIn="SinOut"
            EasingOut="SinIn"
            HasBackgroundAnimation="True"/>
    </pages:PopupPage.Animation>
    
    
    <!--自定义的内容-->
    <StackLayout 
        VerticalOptions="Center" 
        HorizontalOptions="Center" 
        Padding="20, 20, 20, 20">
        <Label  Text="Test"/>
    </StackLayout>
</pages:PopupPage>

using Rg.Plugins.Popup.Pages;

namespace App1
{
    [XamlCompilation(XamlCompilationOptions.Compile)]
    public partial class Alert1 : PopupPage  // 继承PopupPage
    {
        public Alert1()
        {
            InitializeComponent();
        }
    }
}

弹框效果：

调整：增加背景和宽度、高度

<!--自定义的内容-->
    <StackLayout 
        VerticalOptions="Center" 
        HorizontalOptions="Center" 
        Padding="20, 20, 20, 20"
        WidthRequest="300"
        HeightRequest="200"
        BackgroundColor="White">
        <Label  Text="Test"/>
    </StackLayout>

设置按钮：

点击按钮出现弹框，在弹框中的输入框中输入内容后，再将输入内容返回给调用界面

效果图

代码：

MainPage

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="App1.MainPage">

    <StackLayout>

        <Button Text="弹框按钮" Clicked="Button_Clicked" />

        <StackLayout Orientation="Horizontal">
            <Label Text="内容：" />
            <Label x:Name="labContext" />
        </StackLayout>

    </StackLayout>

</ContentPage>

using Rg.Plugins.Popup.Extensions;
using System;
using Xamarin.Forms;

namespace App1
{
    public partial class MainPage : ContentPage
    {
        public MainPage()
        {
            InitializeComponent();
        }

        private async void Button_Clicked(object sender, EventArgs e)
        {
            var alert1 = new Alert1();
            // 定义回调方法
            alert1.Confirm = (context) =>
            {
                labContext.Text = context;
            };
            await Navigation.PushPopupAsync(alert1); // 跳转界面
        }
    }
}

Alert1：

<?xml version="1.0" encoding="utf-8" ?>
<pages:PopupPage    xmlns="http://xamarin.com/schemas/2014/forms"
                    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
                    xmlns:pages="clr-namespace:Rg.Plugins.Popup.Pages;assembly=Rg.Plugins.Popup" 
                    xmlns:animations="clr-namespace:Rg.Plugins.Popup.Animations;assembly=Rg.Plugins.Popup"
                    x:Class="App1.Alert1">
    
    <!--设置动画-->
    <pages:PopupPage.Animation>
        <animations:ScaleAnimation 
            PositionIn="Center"
            PositionOut="Center"
            ScaleIn="1.2"
            ScaleOut="0.8"
            DurationIn="400"
            DurationOut="300"
            EasingIn="SinOut"
            EasingOut="SinIn"
            HasBackgroundAnimation="True"/>
    </pages:PopupPage.Animation>
    
    
    <!--自定义的内容-->
    <StackLayout 
        VerticalOptions="Center" 
        HorizontalOptions="Center" 
        Padding="20, 20, 20, 20"
        WidthRequest="300"
        HeightRequest="200"
        BackgroundColor="White">

        <StackLayout>
            <Label Text="内容：" />
            <Entry x:Name="labContext" />
        </StackLayout>
        
        <StackLayout Orientation="Horizontal" >
            <Button Text="确定" x:Name="btnConfirm" Clicked="btnConfirm_Clicked" BackgroundColor="#00BFFF" TextColor="White"  />
            <Button Text="取消" x:Name="Cancel" Clicked="Cancel_Clicked" BackgroundColor="#EE3B3B" TextColor="White" />
        </StackLayout>
        
        
    </StackLayout>
</pages:PopupPage>

using System;
using Xamarin.Forms.Xaml;

using Rg.Plugins.Popup.Pages;
using Rg.Plugins.Popup.Extensions;

namespace App1
{
    [XamlCompilation(XamlCompilationOptions.Compile)]
    public partial class Alert1 : PopupPage
    {
        // 定义点击确定后执行的方法
        public Action<string> Confirm;

        public Alert1()
        {
            InitializeComponent();
        }

        private async void btnConfirm_Clicked(object sender, EventArgs e)
        {
            Confirm?.Invoke(labContext.Text); // 点击执行
            await Navigation.PopPopupAsync(); // 关闭弹框
        }

        private async void Cancel_Clicked(object sender, EventArgs e)
        {
            await Navigation.PopPopupAsync(); // 关闭弹框
        }
    }
}

==================
补充说明：
我们在使用弹框的时候，有时需要等弹框结束后，再进行下一步；但在实际操作中会发现，程序并不会等待，而是直接继续往下走，导致我们程序处理逻辑异常；故使用 TaskCompletionSource来进行等待操作

			if (signEv.Any(s => s.FixedSignList != null && s.FixedSignList.Count > 0))
            {
                
                var taskCompletionSource = new TaskCompletionSource<Tuple<List<MesInspectionSignExtendValue>, bool>>();
                EcItemSignPopupPage page = new EcItemSignPopupPage(signEv);

                page.CallbackAction = (SignEvResult, IsOkResult) =>
                {
                    taskCompletionSource.TrySetResult(Tuple.Create(SignEvResult, IsOkResult));
                };
                

                await PopupNavigation.Instance.PushAsync(page); // 跳转界面

                var tuple = await taskCompletionSource.Task; // 获取返回结果
                signEv = tuple.Item1;
                IsOk = tuple.Item2;

                if (!IsOk) return;
            }