2017-07-06 41 views
1

我正在尝试使用Xamarin.Forms MasterDetail页面来实现汉堡菜单导航。我遇到的问题是,根据我如何更改详细信息页面,汉堡包菜单消失,但后退功能正常,或汉堡包停留,但我们无法浏览详细信息页面(硬件/屏幕背面按钮将用户返回到设备的主屏幕)。掌握详细导航?

该问题很容易使用最新的XF(2.3.4.247)进行复制;在Visual Studio中创建一个新的Cross Platform App (Xamarin)。确保所有的Nu​​get包都是最新的。然后到共享项目,添加一个名为MyMasterPageMasterDetail页面。

默认情况下MyMasterDetailPage.xaml.csListView_ItemSelected有一行Detail = new NavigationPage(page)它保留汉堡菜单,但实际上不会在详细信息页面之间导航。在Android上按下关闭应用程序。

如果更改行Detail.Navigation.PushAsync(page, true)后退按钮的作品,你可以通过所有先前打开的子项目导航,但汉堡图标与另一个back按钮替换(除了一个设备正常显示)。

如何让汉堡包菜单保留,以便用户可以在所有页面上访问它,同时仍然允许用户返回到之前的详细信息页面?

回答

1

你需要按照这个例子。 https://developer.xamarin.com/samples/xamarin-forms/Navigation/MasterDetailPage

在我的App.xaml.cs中我将它重定向到Menu页面。

MainPage = new MainMenu(); 

接下来,我创建了MainMenu的观点这是一个MasterDetailPage

<MasterDetailPage.Master> 

    <ContentPage 
      Icon="hamburger_menu.png" 
      Title="MyTitle" 
      BackgroundColor="#29632A" 
      > 

     <!--Menu Title background color--> 

     <!--Slide out Menu--> 
     <StackLayout VerticalOptions="FillAndExpand" > 

      <!--Menu Header Layout--> 

      <Label 
       Text="MyTitle" 
       TextColor="White" 
       FontSize="22" 
       VerticalOptions="Center" 
       HorizontalOptions="Center" 
       Margin="0, -10, 0, 5" /> 

      <ListView 
        x:Name="MenuListView" 
        ItemsSource="{Binding MainMenuItems}" 
        ItemSelected="MainMenuItem_Selected" 
        VerticalOptions="FillAndExpand" 
        SeparatorVisibility="None" 
        BackgroundColor="#f5f5f5"> 
       <!--Menu background color--> 
       <ListView.ItemTemplate> 
        <DataTemplate> 
         <ViewCell> 
          <ViewCell.View> 
           <StackLayout Orientation="Horizontal" Padding="10,0,0,0"> 
            <!--Menu layout--> 

            <Label Text="{Binding Title}" FontSize="18" VerticalTextAlignment="Center"/> 

           </StackLayout> 
          </ViewCell.View> 
         </ViewCell> 
        </DataTemplate> 
       </ListView.ItemTemplate> 
      </ListView> 
     </StackLayout> 

    </ContentPage> 
</MasterDetailPage.Master> 

的MainMenu.xaml.cs

public partial class MainMenu : MasterDetailPage 
{ 
    public List<MainMenuItem> MainMenuItems { get; set; } 

    public MainMenu() 
    { 
     BindingContext = this; 

     // Build the Menu 
     MainMenuItems = new List<MainMenuItem>() 
     { 
      new MainMenuItem() { Title = "Menu1", Icon = "menu1.png", IconSize = 18, TargetType = typeof(Menu1) }, 
      new MainMenuItem() { Title = "Menu2", Icon = "menu2.png", IconSize = 18, TargetType = typeof(Menu2) } 
     }; 

     // Set the default page, this is the "home" page. 
     ChangeDetail(new Menu1()); 
     InitializeComponent(); 

    } 

    // When a MenuItem is selected. 
    public void MainMenuItem_Selected(object sender, SelectedItemChangedEventArgs e) 
    { 
     var item = e.SelectedItem as MainMenuItem; 
     if (item != null) 
     { 
      if (item.Title.Equals("Menu1")) 
      { 
       ChangeDetail(new Menu1()); 
      } 
      else if (item.Title.Equals("Menu2")) 
      { 
       ChangeDetail(new Menu2()); 
      } 

      MenuListView.SelectedItem = null; 
      IsPresented = false; 
     } 
    } 

    public void ChangeDetail(Page page) 
    { 
     var navigationPage = Detail as NavigationPage; 
     if (navigationPage != null) 
     { 
      navigationPage.PushAsync(page); 
      return; 
     } 
     Detail = new NavigationPage(page) { BarBackgroundColor = Color.FromHex("#FF0000"), BarTextColor = Color.White }; 
    } 
} 
+0

从我的问题:“在默认情况下在MyMasterDetailPage.xaml.cs在ListView_ItemSelected有一行Detail = new NavigationPage(页面),它保留了汉堡包菜单,但实际上并不在详细信息页面之间导航。**在Android上按下关闭应用程序**“ – Andy

+0

你能分享你的代码,以便我们看到发生了什么? – sonicbabbler