MasterDetailPage导航!我在“详细信息”页面底部添加一个按钮以导航到下一个详细信息页面时感到很遗憾 .
我使用.net标准共享项目创建了一个新的解决方案,并在共享项目中添加了一个开箱即用的MasterDetail页面 .
开箱即用,它创建了一组适合我正在做的事情的页面:
MasterDetailPageMaster包含一个ListView,它显示由MasterDetailPageMasterViewModel可观察集合“MasterDetailPageMenuItem”创建的项目的“菜单” .
然后,MasterDetailPage事件中的ListView_ItemSelected将MasterDetailPageDetail Headers 设置为ListView MasterDetailPageMenuItem“Title”属性,该属性用于填充ContentView,我从另一个专门为每个ListView菜单项创建的ContentView手动插入到此页面的布局中 .
这一切都很好,但我不希望用户必须返回主菜单转到下一个详细信息页面,我想在详细信息页面的底部插入一个按钮以导航到下一页 .
我无法弄清楚如何使用文件结构以及开箱即用的方式来实现这一点 .
这是一些代码片段 . 如果有人能帮我解决这个问题,我们将不胜感激!
MasterDetailPageMaster 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"
x:Class="bpntBook.MasterDetailPageMaster"
Title="Master">
<StackLayout>
<ListView x:Name="MenuItemsListView"
SeparatorVisibility="None"
HasUnevenRows="true"
ItemsSource="{Binding MenuItems}">
<ListView.Header>
<Grid BackgroundColor="#03A9F4">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="10"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="10"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="30"/>
<RowDefinition Height="80"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="10"/>
</Grid.RowDefinitions>
<Label
Grid.Column="1"
Grid.Row="2"
Text="AppName"
Style="{DynamicResource SubtitleStyle}"/>
</Grid>
</ListView.Header>
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<StackLayout Padding="15,10" HorizontalOptions="FillAndExpand">
<Label VerticalOptions="FillAndExpand"
VerticalTextAlignment="Center"
Text="{Binding Title}"
FontSize="24"/>
</StackLayout>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</StackLayout>
</ContentPage>
MasterDetailPageMaster代码背后:
public partial class MasterDetailPageMaster : ContentPage
{
public ListView ListView;
public MasterDetailPageMaster()
{
InitializeComponent();
BindingContext = new MasterDetailPageMasterViewModel();
ListView = MenuItemsListView;
}
class MasterDetailPageMasterViewModel : INotifyPropertyChanged
{
public ObservableCollection<MasterDetailPageMenuItem> MenuItems { get; set; }
public MasterDetailPageMasterViewModel()
{
MenuItems = new ObservableCollection<MasterDetailPageMenuItem>(new[]
{
new MasterDetailPageMenuItem { Id = 0, Title = "Chapter 1" },
new MasterDetailPageMenuItem { Id = 1, Title = "Chapter 2" },
new MasterDetailPageMenuItem { Id = 2, Title = "Chapter 3" },
new MasterDetailPageMenuItem { Id = 3, Title = "Chapter 4" },
new MasterDetailPageMenuItem { Id = 4, Title = "Chapter 5" },
});
}
#region INotifyPropertyChanged Implementation
public event PropertyChangedEventHandler PropertyChanged;
void OnPropertyChanged([CallerMemberName] string propertyName = "")
{
if (PropertyChanged == null)
return;
PropertyChanged.Invoke(this, new PropertyChangedEventArgs(propertyName));
}
#endregion
}
}
MasterDetailPage xaml:
<MasterDetailPage.Master>
<pages:MasterDetailPageMaster x:Name="MasterPage" />
</MasterDetailPage.Master>
<MasterDetailPage.Detail>
<NavigationPage>
<x:Arguments>
<pages:MasterDetailPageDetail x:Name="DetailPage" />
MasterDetailPage代码背后:
public partial class MasterDetailPage
{
public MasterDetailPage()
{
InitializeComponent();
MasterPage.ListView.ItemSelected += ListView_ItemSelected;
}
private void ListView_ItemSelected(object sender, SelectedItemChangedEventArgs e)
{
var item = e.SelectedItem as MasterDetailPageMenuItem;
if (item == null)
return;
var page = (Page)Activator.CreateInstance(item.TargetType);
page.Title = item.Title;
Detail = new NavigationPage(page);
IsPresented = false;
MasterPage.ListView.SelectedItem = null;
}
}
MasterDetailPageDetail 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"
x:Class="bpntBook.MasterDetailPageDetail"
Title="Detail">
<StackLayout x:Name="contentLayout" Padding="10">
MasterDetailPageDetail代码背后:
public partial class MasterDetailPageDetail : ContentPage
{
public ContentView sContent { get; set; }
public ContentView nextContent { get; set; }
public Button next { get; set; }
public MasterDetailPageDetail()
{
InitializeComponent();
}
protected override void OnAppearing()
{
base.OnAppearing();
if (Title.Contains("Chapter 1"))
{
sContent = new Chapters.Chapter1();
contentLayout.Children.Add(sContent);
nextContent = new Chapters.Chapter2();
}
else if (Title.Contains("Chapter 2"))
{
sContent = new Chapters.Chapter2();
contentLayout.Children.Add(sContent);
nextContent = new Chapters.Chapter3();
}
else if (Title.Contains("Chapter 3"))
{
sContent = new Chapters.Chapter3();
contentLayout.Children.Add(sContent);
//nextContent = new Chapters.Chapter3();
}
if (nextContent != null)
{
next = new Button();
next.Text = "Next Chapter";
next.Clicked += onButtonClick;
contentLayout.Children.Add(next);
}
}
void onButtonClick(object sender, EventArgs e)
{
contentLayout.Children.Remove(next);
contentLayout.Children.Remove(sContent);
contentLayout.Children.Add(nextContent);
上面的代码只有在单击菜单项后才能工作,它只适用于生成的第一个详细页面 .
这里的代码不起作用:
//App.Current.MainPage = new MasterDetailPage { Title = "Chapter 3" };
//Title = "Chapter 3";
next = new Button();
next.Text = "Next Chapter";
next.Clicked += onButtonClick;
contentLayout.Children.Add(next);
}
}
任何帮助将非常感激!