通过代码在 Xamarin 中切换/加载新的详细信息页面

debugcn 发表于 Dev

吉普·哈索恩

我如何通过代码加载/切换页面，就像使用 Masterdetailpage 的侧边菜单一样？

如果您单击侧边菜单上的页面名称，您将转到该页面，同时在新页面上保留菜单按钮。你如何通过代码做到这一点？

MainPage.xaml（这是主页）

<MasterDetailPage xmlns="http://xamarin.com/schemas/2014/forms" 
              xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
              xmlns:local="clr-namespace:TimeToSport;assembly=TimeToSport"
              xmlns:local1="clr-namespace:TimeToSport.Views.Main"
              xmlns:local2="clr-namespace:TimeToSport.Views"
              x:Class="TimeToSport.Views.Main.MainPage">
<MasterDetailPage.Master>
    <local1:MasterPage x:Name="masterPage" />
</MasterDetailPage.Master>
<MasterDetailPage.Detail>
    <NavigationPage>
        <x:Arguments>
            <local2:ItemsPage />
        </x:Arguments>
    </NavigationPage>
</MasterDetailPage.Detail>

母版页.xaml

<?xml version="1.0" encoding="UTF-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" 
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:TimeToSport.Views"
             xmlns:local1="clr-namespace:TimeToSport.Views"
             x:Class="TimeToSport.Views.Main.MasterPage"
             Padding="0,40,0,0"
             Icon="hamburger.png"
             Title="Personal Organiser">
    <StackLayout>
        <ListView x:Name="listView" x:FieldModifier="public">
            <ListView.ItemsSource>
                <x:Array Type="{x:Type local:MasterPageItem}">
                    <local1:MasterPageItem Title="Home" IconSource="contacts.png" TargetType="{x:Type local:ItemsPage}" />
                    <local1:MasterPageItem Title="Slaap" IconSource="todo.png" TargetType="{x:Type local:SlaapPage}" />
                    <local1:MasterPageItem Title="Voeding" IconSource="reminders.png" TargetType="{x:Type local:VoedingPage}" />
                </x:Array>
            </ListView.ItemsSource>
            <ListView.ItemTemplate>
                <DataTemplate>
                    <ViewCell>
                        <Grid Padding="5,10">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="30"/>
                                <ColumnDefinition Width="*" />
                            </Grid.ColumnDefinitions>
                            <Image Source="{Binding IconSource}" />
                            <Label Grid.Column="1" Text="{Binding Title}" />
                        </Grid>
                    </ViewCell>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    </StackLayout>
</ContentPage>

我对 masterdetailpage、detailpage 等知之甚少...

如果您通过以下代码进入“Slaap”页面：

Navigation.PushModalAsync(new SlaapPage());

你不会在左上角有菜单按钮，但我希望它在那里。

R15

您需要使用Detailpage 来执行此操作，并且您当前的页面应该继承自MasterDetailPage

public partial class MainPage : MasterDetailPage
{
    public MainPage()
    {
        InitializeComponent();
        Detail = new NavigationPage(new HomePage());
        IsPresented = false; //This is to hide side page after pushing new page 

    }
}

如果您喜欢上面的内容Detail = new..，它不会在左上角显示后退按钮箭头。如果你想要后退箭头Actionbar这样做

Detail.Navigation.PushAsync(new HomePage());

如果您想从其他页面执行此操作，请执行以下操作

public void SlaapClicked()
{ 
 Navigation.PushAsync(new SlaapPage());
}

在 SlaapPage 上隐藏 Navigationbar

public SlaapPage()
{
    InitializeComponent();
    NavigationPage.SetHasNavigationBar(this, false);
}

如果你从其他地方搬来，TabbedPage请这样做

private void SlaapPage(object sender, EventArgs e)
{
    //this.Navigation.PushAsync(new SlaapPage());// not showing back button
    //(App.Current.MainPage as MasterDetailPage).Detail=new NavigationPage(new SlaapPage()); //showing full screen page
    (App.Current.MainPage as MasterDetailPage).Detail.Navigation.PushAsync(new SlaapPage()); //working like google play store app, In SlaapPage page SetHasNavigationBar should be false
}

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。