DisplayAlert Displaying Beneath PopupPage on iOS

[TylooJ]

On iOS, using DisplayAlert from a PopupPage causes the alert to be displayed under the PopupPage. My app is running on an iPhone 14 with iOS 16.4. The alert displays as expected on the Android version.

MyPopup.xaml.cs

public partial class MyPopup : Mopups.Pages.PopupPage
{
    public MyPopup()
    {
        InitializeComponent();
    }

    private async void Close_Popup(object sender, EventArgs e)
    {
        if (!await DisplayAlert("Confirm", "Are you sure you want to cancel?", "Yes", "No"))
            return;

        await Mopups.Services.MopupService.Instance.PopAsync();
    }
}

[MalmoIt]

Any progress on this issue?

[LuckyDucko]

@MalmoIt @TylooJ Apologies, i dont actually work on Mobile app dev mainly, so i am very much behind on my fixes with this project.

Can you do a visual test, and make a popup in the bottom 30% of the screen with background transparent on.

Then make a display alert show, and see if you can see it and or interact with it?

[TheCaveOfWonders]

I'm experiencing the exact same issue.

[PureWeen]

I think the issue here is that with .NET MAUI we changed the alerts implementation to not use UIWindow.

In Forms we used UIWindow https://github.com/xamarin/Xamarin.Forms/blob/4f3acdfb0bc98e3ba8e2f3eae86e88602350ee84/Xamarin.Forms.Platform.iOS/Platform.cs#L416

In Maui we changed that to not use a UIWindow https://github.com/dotnet/maui/blob/cda3eb3381cfb686567ed05e3eb8e8f26c02d785/src/Controls/src/Core/Platform/AlertManager/AlertManager.iOS.cs#L177

Because Mopups is using a UIWindow, I'm assuming that's going to display on top of whatever we present from the UIWindow below the Mopup.

I'm not 100 percent sure the best fix here. If the Alert is called against the Popup Page, .NET MAUI should probably do a better job using that VC to display the alert, opposed to just going directly to our own pages.

[Stedy59]

I have my own Maui implementation of the old RGPopup. There I no longer use the "Page" object, as I have created an automated "DialogView" that I pass my content to and it creates the page for me. So, on top of that, I created a "Messagebox" class that I can call similar to "DisplayAlert."

Here is a large, but short animated gif I created to show the Android Dropdown control. At the end I ask to exit the app using my "MauiDialogView", MessageBox...

My Maui Dropdown/Sliding Panel/TabView/DialogView

Longer video on Youtube Maui Framework

[PureWeen]

FYI

https://github.com/dotnet/maui/pull/16983

[Hackmodford]

I worked around the issue by adding a static method that returns the top page. Where the top page is either the app's current page or the mopup services last page in the stack.

Then you can use that page to display an alert that will appear above the mopup page.

[justintemplar]

Running .NET MAUI 8.0.3 and still having the issue.

[irshadka]

Any fixes for this?

[sowacx]

I just tested scenario described by @TylooJ and it looks good (I am running .NET 8.0.302 + MAUI 8.0.61.

I found this topic because my issue got same effect, but scenario is a bit different: I'm not calling DisplayAlert from popup page. I'm calling it from some service that uses 'Application.Current?.MainPage.DisplayAlert()' to trigger alert. It was working fine with Xamarin app. After migration it's still working with Android, but at iOS version alert is placed beneath popup and overlay.

I found easy workaround for it -> Use Mopups.Services.MopupService.Instance.PopupStack[^1] to get popup page and call alert using it.

 // Call from some service that cannot reach page
var mainPage = Application.Current?.MainPage;
if (mainPage != null)
{
    //it works for Android, but at iOS alert displays beneath popup and overlay 
    await mainPage.DisplayAlert("Confirm", "xxxxAre you sure you want to cancel?", "Yes", "No");
    
    //WorkAround - get popup page from MopupService.Instance.PopupStack -> It's working for both platforms
    if (Mopups.Services.MopupService.Instance.PopupStack.Count > 0)
    {
        var topPage = Mopups.Services.MopupService.Instance.PopupStack[^1];
        await topPage.DisplayAlert("Confirm", "Are you sure you want to cancel?", "Yes", "No");
    }
}

[Ducvu1996]

Any fixes for this?