使用带有 Xamarin 表单的 Rg 插件弹出窗口

Posted 2023-03-12

【中文标题】使用带有 Xamarin 表单的 Rg 插件弹出窗口

【英文标题】：Using Rg Plugins Popup with Xamarin Forms

【发布时间】：2017-07-18 17:52:08

【问题描述】：

我是 Xamarin Forms 开发的新手，我需要一个弹出对话框。我在https://github.com/rotorgames/Rg.Plugins.Popup 中找到了我正在寻找的东西，但我终生无法弄清楚如何使用它。有人可以为我指出一个工作示例或提供一些使用方向吗？网站上的 README.md 对我帮助不大。

我希望在单击顶部导航栏中的信息按钮时出现弹出对话框。所有弹出窗口需要 1-2 个按钮（和标签）来设置用户设置。

这适用于 Xamarin.Forms：ios 和 android。

【问题讨论】：

你看过源代码中包含的Demo应用了吗？

演示就是我所需要的。不知怎的，我完全错过了它。感谢您指出。

【参考方案1】：

简单的步骤：

在所有项目中安装插件 在您的 xml 使用他们在文档中提供的方法来显示/隐藏弹出窗口： Task PushAsync(PopupPage page, bool animate = true) 任务 PopAllAsync(bool animate = true)

他们还提供了一个演示，检查一下： https://github.com/rotorgames/Rg.Plugins.Popup/tree/master/src/Demo

【讨论】：

演示就是我所需要的。不知怎的，我完全错过了它。感谢您指出。

感谢您的回答，但如何使用 IPopupNavigation？如果我使用它作为依赖服务，我应该用什么来初始化android和iOS中的函数？

@charlin 任何想法将 RG.plugins 弹出窗口与 FreshMVVM 一起使用？？

你的链接已经不存在了，但是目前的文档已经很清楚了。 github.com/rotorgames/Rg.Plugins.Popup/wiki/Getting-started

@Leandro De Mello Fagundes 在右侧导航中有一个“如何使用”部分。我刚刚添加了弹出窗口的简化用法作为下面的答案。如果有任何混淆/错误，请随时询问。顺便说一句，我使用了 Xamarin Forms 共享项目中的库

【参考方案2】：

添加对库的引用，即从 nuget 到所有项目。

在您的 Android 项目中，添加此 Rg.Plugins.Popup.Popup.Init(this, savedInstanceState); 在 MainActivity.cs OnCreate 方法中，在 Xamarin Forms Inits 之前。

iOS 项目也是如此，在 AppDelegate.cs FinishedLaunching method() 中

 //Android
 protected override void OnCreate(Bundle savedInstanceState)
 
    base.OnCreate(savedInstanceState);
    Rg.Plugins.Popup.Popup.Init(this, savedInstanceState);  /*Must add before the other Xamarin Inits*/
     Xamarin.Essentials.Platform.Init(this, savedInstanceState);
     Xamarin.Forms.Forms.Init(this, savedInstanceState);
 

  //iOS
  public override bool FinishedLaunching(UIApplication app, NSDictionary options)
  
      Rg.Plugins.Popup.Popup.Init();   /* place at the top*/
      ....
  

将新的 ContentPage (.xaml) 添加到您的 Views 目录。

<?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="MyProjectName.Views.MyContentPageName">
<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 HorizontalAlignment="FillAndExpand" VerticalAlignment="FillAndExpand"> 
    <!-- place your layout content here ....fx a close popup button -->
     <Button Clicked="CloseBtn_Clicked" Text="Close" />
  </StackLayout>

</pages:PopupPage>

在 ContentPage (PopupPage) 代码后面的文件中，添加using Rg.Plugins.Popup.Services; 并从以下继承

using Rg.Plugins.Popup.Services;
using System;
using System.Threading.Tasks;
using Xamarin.Forms;

[XamlCompilation(XamlCompilationOptions.Compile)]
public partial class MyContentPageName: Rg.Plugins.Popup.Pages.PopupPage

     public MyContentPageName()
    
        InitializeComponent();            
          

      public void OnAnimationStarted(bool isPopAnimation)
    
        // optional code here   
    


    public void OnAnimationFinished(bool isPopAnimation)
    
        // optional code here   
       

      protected override bool OnBackButtonPressed()
    
        // Return true if you don't want to close this popup page when a back button is pressed
        return true;
    


    // Invoked when background is clicked
    protected override bool OnBackgroundClicked()
    
        // Return false if you don't want to close this popup page when a background of the popup page is clicked
        return false;
    
    
    private async void CloseBtn_Clicked(object sender, EventArgs e)
    
        await PopupNavigation.Instance.PopAsync(true);   
    

在 .xaml.cs 页面中，您要在其中打开弹出窗口，添加以下内容：

using System;
using Xamarin.Forms;
using Xamarin.Forms.Xaml;
using Rg.Plugins.Popup.Contracts;
using Rg.Plugins.Popup.Services;

public partial class MyOtherPage : ContentPage

   private IPopupNavigation _popup  get; set; 
   private MyContentPageName _modalPage;

    public MyOtherPage()    
    
        _popup = PopupNavigation.Instance;
        _modalPage = new MyContentPageName();
       

   protected override void OnAppearing()
   
       base.OnAppearing();          
       _popup.Popped += Popup_Popped;
   

   protected override void OnDisappearing()
   
       base.OnDisappearing();           
       _popup.Popped -= Popup_Popped;
   

   private async void Tapped_OpenModal(object sender, EventArgs e)
   
       await _popup.PushAsync(_modalPage);
   
  
   /// <summary> Triggered when the MyContentPageName popup is closed "PopAsync()" </summary>
    private async void Popup_Popped(object sender, Rg.Plugins.Popup.Events.PopupNavigationEventArgs e)
    
        /* add your logic here, if necessary  */
    

*注意：如果您的模式只是显示静态内容，则不需要在 OnAppearing()/OnDisappearing() 中使用 _popped 事件委托。