How to display a popup on Shell page?

Brenda 60 Reputation points
2023-10-24T12:47:58.81+00:00

I am unable to show a popup on the shell page (Homepage), it works on Android but not on iOS. For the last, it is displayed on a blank page at the top of the screen. When debugging I could not find the error for it.

So, I have a Homepage with a popup button, that have different navigation pages, when clicked it navigates to this page, where you same some data and the goes back to Homepage. Also, one of those buttons goes to another popup list and after clicking on one those item, it shows the DetailPage. That is how it works on Android. On iOS, it does the same. Navigates from one popup to the other and after click, it shows you the DetailPage, save the data and go back to a empty HomePage.

Should I register the route in AppShell?

How can I display the popup on top of the HomePage and not in a new blank page?

Android Screenshot_1698151134

iOS

2023-10-24_02-33-45-PM

<toolkit:Popup xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="Example.Views.Popups.PopupControl"
             xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit" 
             VerticalOptions="Center">
        <VerticalStackLayout BackgroundColor="White" 
                             HeightRequest="160">
            <Button Clicked="FirstBtn_OnClicked" />
            <BoxView HeightRequest="1" />

            <Button Clicked="SecondBtn_OnClicked" />
            <BoxView HeightRequest="1"/>
        </VerticalStackLayout>
</toolkit:Popup>


 private async void FirstBtn_OnClicked(object sender, EventArgs e)
 {
     this.Close();
     await this.ParentPage.Navigation.PushAsync(new TesControl());
 }
 private async void SecondtBtn_OnClicked(object sender, EventArgs e)
 {
     this.Close();
     await this.ParentPage.Navigation.PushAsync(new TesControl());
 }

´´´


Developer technologies | .NET | .NET MAUI
Developer technologies | .NET | Other
{count} votes

Your answer

Answers can be marked as Accepted Answers by the question author, which helps users to know the answer solved the author's problem.