我正在尝试使用Xamarin.Forms MasterDetail页面来实现汉堡菜单导航。我遇到的问题是,根据我更改细节页面的方式,汉堡包菜单会消失,但返回功能会起作用,或者汉堡包会停留但我们却无法浏览详细信息页面(硬件/屏幕返回)按钮将用户返回到设备的主屏幕)。
使用最新的XF(2.3.4.247)可以很容易地复制这个问题。在Visual Studio中创建一个新的Cross Platform App (Xamarin)
。确保所有Nuget包都是最新的。然后到共享项目,添加一个名为MasterDetail
的MyMasterPage
页面。
默认情况下,在MyMasterDetailPage.xaml.cs
的ListView_ItemSelected
中有一条线Detail = new NavigationPage(page)
,它保留了汉堡菜单,但实际上并没有在细节页面之间导航。在Android上按下关闭应用程序。
如果您将行更改为Detail.Navigation.PushAsync(page, true)
,则后退按钮可以工作,您可以浏览所有先前打开的子项,但汉堡包图标将替换为另一个back
按钮(除了设备通常显示的按钮)。
如何让汉堡包菜单保留,以便用户可以在所有页面上访问它,同时仍然允许用户返回之前的详细信息页面?
你需要遵循这个例子。 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 };
}
}