简体   繁体   中英

How do I navigate from MasterDetailPage to ContentPage in Xamarin forms using Prism saving the navigation stack?

I'm working on a Xamarin+Prism app and now facing an issue. The application uses MasterDetailPage as a layout. The details page contains a google map with few markers. When you tap the marker, a popup appears, if you tap this popup, a separate view should be opened (let's call it Page1).

I want this view NOT to be a part of MasterDetailsPage and at the same time to have a "Back" button on the top navigation panel. This "Back" button should lead back to MasterDetailsPage. And here comes the issue. I haven't found a way to do this. If you don't use Prism, it's done very simple by pushing directly to NavigationStack. But Prism doesn't allow you to do so, you only have NavigationService with NavigateAsync. Is there a way to implement this kind of behavior? Or maybe any hacks?

MasterDetailsPage code

<?xml version="1.0" encoding="utf-8" ?>
<MasterDetailPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:d="http://xamarin.com/schemas/2014/forms/design"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             mc:Ignorable="d"
             x:Class="Find.Views.MainPage"
             xmlns:pages="clr-namespace:Find.Views">
    <MasterDetailPage.Master>
        <pages:MenuPage />
    </MasterDetailPage.Master>
</MasterDetailPage>

I've tried few ways of navigation like:

await NavigationService.NavigateAsync($"Page1");
await NavigationService.NavigateAsync($"/Page1");
await NavigationService.NavigateAsync($"NavigationPage/Page1");

and others, but nothing worked.

I've found the similar question, but an answer there is not correct. https://ios.developreference.com/article/13334449/How+do+you+navigate+Xamarin+Forms+using+Prism+from+Master+Detail+to+Content+Page+without+Master+Detail

Thanks in advance.

Do you want to achieve the result like following GIF?(Note: I will navigate a page1 when click the Button)

在此处输入图像描述

First of all, I registered my pages in RegisterTypes method like following code.

 protected override void RegisterTypes(IContainerRegistry containerRegistry) {

            containerRegistry.RegisterForNavigation<MenuPage>();
            containerRegistry.RegisterForNavigation<NavigationPage>();

            containerRegistry.RegisterForNavigation<ViewA>();
            containerRegistry.RegisterForNavigation<Page1>();
            containerRegistry.RegisterForNavigation<ViewB>();
        }

If you want to have a back arrow, you need keep your navigted page not in root navigate stack.

For example. I display the ViewA by default, this navigate code like following

 await _navigationService.NavigateAsync(nameof(NavigationPage) + "/" + "ViewA");

Then, when we want to navigate to the Page1 from ViewA, we should use following code that will display the backarrow.

 await _navigationService.NavigateAsync(nameof(NavigationPage) + "/" + "ViewA" + "/" + "Page1");

I upload my demo, you can refer to it.

https://github.com/851265601/XFromsPrismNavi

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM