如何修复主详细信息页面在选项卡式页面中不起作用？

Question

我正在尝试在选项卡式页面中显示主详细信息页面，但在我尝试执行此操作后，主详细信息页面似乎无法正常工作。

我已经对此进行了谷歌搜索，但似乎唯一出现的问题是关于人们试图在主详细信息页面中显示标签页，但我正试图做相反的事情。我从 xamarin 表单下载了主详细信息页面的示例代码，并尝试从那里进行修改，以查看此问题是否可以在默认示例代码上重现，并且看起来确实如此。

下载https://developer.xamarin.com/samples/xamarin-forms/Navigation/MasterDetailPage/

然后将主页面中的代码移植到另一个新创建的名为 submainpage.cs 的页面

 public partial class SubMainPage : MasterDetailPage
 {
public SubMainPage()
{
    InitializeComponent();

    masterPage.listView.ItemSelected += OnItemSelected;

    if (Device.RuntimePlatform == Device.UWP)
    {
        MasterBehavior = MasterBehavior.Popover;
    }
}

void OnItemSelected(object sender, SelectedItemChangedEventArgs e)
{
    var item = e.SelectedItem as MasterPageItem;
    if (item != null)
    {
        Detail = new 
      NavigationPage((Page)Activator.CreateInstance(item.TargetType));
        masterPage.listView.SelectedItem = null;
        IsPresented = false;
    }
}

}

然后将 mainpage.xaml 移植到 submainpage.xaml

<?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:local="clr-namespace:MasterDetailPageNavigation;assembly=MasterDetailPageNavigation"
x:Class="MasterDetailPageNavigation.SubMainPage">
<MasterDetailPage.Master>
    <local:MasterPage x:Name="masterPage" />
</MasterDetailPage.Master>
<MasterDetailPage.Detail>
    <NavigationPage>
        <x:Arguments>
            <local:ReminderPage />
        </x:Arguments>
    </NavigationPage>
</MasterDetailPage.Detail>
</MasterDetailPage>

然后在编辑mainpage.cs

public partial class MainPage : TabbedPage
    {
        public MainPage()
        {
            InitializeComponent();
        }        
    }

并编辑 mainpage.xaml

<TabbedPage 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"
            xmlns:masterDetailPageNavigation="clr-namespace:MasterDetailPageNavigation;assembly=MasterDetailPageNavigation"
            mc:Ignorable="d"
            x:Class="MasterDetailPageNavigation.MainPage">

    <ContentPage Title="FirstTab" >
        <StackLayout Orientation="Vertical">
            <Button Text="Sample Text" TextColor="White" BackgroundColor="Gray"   FontSize="40"/>
            <Label Text="Test" FontSize="40"/>
        </StackLayout>
    </ContentPage>
    <masterDetailPageNavigation:SubMainPage x:Name="Drawer" Title="Display"  >       
    </masterDetailPageNavigation:SubMainPage>

</TabbedPage>

运行代码。然后点击显示。您应该能够看到主显示页面。单击主显示页面并选择其中的一个项目。链接到该项目的页面被调用并显示在屏幕上，但主详细信息页面消失，我无法导航以查看主详细信息页面上的其他项目。我的预期结果是主详细信息页面的导航应该仍然存在，以便我导航到其中包含的其他项目。

Answer 1

来自docs

重要

MasterDetailPage 被设计为根页面，并将其用作 其他页面类型中的子页面可能会导致意外和 不一致的行为。

Answer 2

如何修复主详情页面在标签页中不起作用？

我尝试将MasterDetailPage 添加到TabbedPage 中，它可以工作，但是您需要修改MasterDetailPage 和TabbedPage 的零件代码。

标签页

<TabbedPage.Children>
    <NavigationPage Title="Browse">
        <NavigationPage.Icon>
            <OnPlatform x:TypeArguments="FileImageSource">
                <On Platform="iOS" Value="tab_feed.png" />
            </OnPlatform>
        </NavigationPage.Icon>
        <x:Arguments>
            <views:ItemsPage />
        </x:Arguments>
    </NavigationPage>

    <NavigationPage Title="About">
        <NavigationPage.Icon>
            <OnPlatform x:TypeArguments="FileImageSource">
                <On Platform="iOS" Value="tab_about.png" />
            </OnPlatform>
        </NavigationPage.Icon>
        <x:Arguments>
            <views:AboutPage />
        </x:Arguments>
    </NavigationPage>

  <!--MasterDetailPage-->

    <NavigationPage Title="Master">
        <NavigationPage.Icon>
            <OnPlatform x:TypeArguments="FileImageSource">
                <On Platform="iOS" Value="tab_about.png" />
            </OnPlatform>
        </NavigationPage.Icon>
        <x:Arguments>
            <local:RooterMasterDetailPage Title="Master" />
        </x:Arguments>
    </NavigationPage>
</TabbedPage.Children>

MasterDetailPage

private void ListView_ItemSelected(object sender, SelectedItemChangedEventArgs e)
{
    var item = e.SelectedItem as RooterMasterDetailPageMenuItem;
    if (item == null)
        return;

    var page = (Page)Activator.CreateInstance(item.TargetType);
    page.Title = item.Title;

    // remove navigationpage

    Detail = page;
    IsPresented = false;

    MasterPage.ListView.SelectedItem = null;
}

更多详情请参考完整版sample。