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>

然后在主页上进行编辑。

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

<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。

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

2 个答案: