菜单导航
添加文件与文件夹
- 添加文件夹
./Extensions
-
添加文件［类型：用户控件］
./Views/IndexView.xaml
./Views/MemoView.xaml
./Views/TodoView.xaml
./Views/SettingsView.xaml
./ViewModels/IndexViewModel.cs
./ViewModels/IndexViewModel.cs
./ViewModels/IndexViewModel.cs
./ViewModels/IndexViewModel.cs
./Extensions/PrismManager.cs
建立View与ViewModel关联
-
App.xaml.cs
protected override void RegisterTypes(IContainerRegistry containerRegistry) {containerRegistry.RegisterForNavigation<IndexView, IndexViewModel>();containerRegistry.RegisterForNavigation<TodoView, TodoViewModel>();containerRegistry.RegisterForNavigation<MemoView, MemoViewModel>();containerRegistry.RegisterForNavigation<SettingsView, SettingsViewModel>(); }
添加区域
定义区域名字
-
PrismManager.cs
namespace Mytodo.Extensions {public static class PrismManager{public static readonly string MainViewRegionName = "MainViewRegion"; //定义Nanme变量 } }
注册区域，绑定名字
-
MainView.xaml
-
定义命名空间
xmlns:ext="clr-namespace:Mytodo.Extensions" -
注册控件区域
<materialDesign:DrawerHost.LeftDrawerContent> <DockPanel><materialDesign:ColorZone...><ContentControl prism:RegionManager.RegionName="{x:Static ext:PrismManager.MainViewRegionName}" /> </DockPanel>
-
添加导航
添加导航命令与变量
- MainView.xaml.cs
private readonly IRegionManager regionManager; //导航变量
public DelegateCommand<MenuBar> NavigateCmd { get; private set; } //导航命令
初始化导航命令
-
MainView.xaml.cs
public MainViewModel(IRegionManager regm) {MenuBars=new ObservableCollection<MenuBar>();CreatMenuBar();//this.regionManager = regm;NavigateCmd = new DelegateCommand<MenuBar>(Navigate); }注意：初始化应在构造函数中
绑定导航命令
添加行为命名空间
- main.xaml
xmlns:i="http://schemas.microsoft.com/xaml/behaviors"
添加行为，绑定导航命令
- MainView.xmal
<i:Interaction.Triggers><i:EventTrigger EventName="SelectionChanged"><i:InvokeCommandAction Command="{Binding NavigateCmd}" CommandParameter="{Binding ElementName=menuBar, Path=SelectedItem}" /></i:EventTrigger>
</i:Interaction.Triggers>
完整代码为：
<ListBoxx:Name="menuBar"HorizontalContentAlignment="Stretch"ItemContainerStyle="{StaticResource MyListboxItemStyle}"ItemsSource="{Binding MenuBars}"><i:Interaction.Triggers><i:EventTrigger EventName="SelectionChanged"><i:InvokeCommandAction Command="{Binding NavigateCmd}" CommandParameter="{Binding ElementName=menuBar, Path=SelectedItem}" /></i:EventTrigger></i:Interaction.Triggers><ListBox.ItemTemplate><DataTemplate><StackPanel Orientation="Horizontal"><materialDesign:PackIcon Kind="{Binding Icon}" /><TextBlock Margin="10,0" Text="{Binding Title}" /></StackPanel></DataTemplate></ListBox.ItemTemplate>
</ListBox>
添加导航历史功能
添加命令定义
- MainviewModel.cs
public DelegateCommand GoBackCmd { get; private set; }
public DelegateCommand GoFwrdCmd { get; private set; }
添加导航历史变量
- MainviewModel.cs
private IRegionNavigationJournal journal; //导航历史
初始化命令
- MainviewModel.cs的构造函数中添加
//实例化命令GoBackCmd = new DelegateCommand(() =>{if (journal != null && journal.CanGoBack)journal.GoBack();});GoFwrdCmd = new DelegateCommand(() =>{if (journal != null && journal.CanGoForward)journal.GoForward();});
绑定命令
-
MainView.xaml
<ButtonMargin="24,0,0,0"materialDesign:RippleAssist.Feedback="{Binding RelativeSource={RelativeSource Self}, Path=Foreground, Converter={StaticResource BrushRoundConverter}}"Command="{Binding GoFwrdCmd}"Content="{materialDesign:PackIcon Kind=ArrowLeft,Size=24}"Foreground="{Binding RelativeSource={RelativeSource AncestorType={x:Type FrameworkElement}}, Path=(TextElement.Foreground)}"Style="{StaticResource MaterialDesignToolButton}"ToolTip="Previous Item" /><ButtonMargin="16,0,0,0"materialDesign:RippleAssist.Feedback="{Binding RelativeSource={RelativeSource Self}, Path=Foreground, Converter={StaticResource BrushRoundConverter}}"Command="{Binding GoBackCmd}"Content="{materialDesign:PackIcon Kind=ArrowRight,Size=24}"Foreground="{Binding RelativeSource={RelativeSource AncestorType={x:Type FrameworkElement}}, Path=(TextElement.Foreground)}"Style="{StaticResource MaterialDesignToolButton}"ToolTip="Next Item" />
添加自动关掉侧栏代码
-
MainView.xaml.cs
menuBar.SelectionChanged += (s, e) => {drawerHost.IsLeftDrawerOpen = false; };
