自学内容网 自学内容网
自学内容网 > 正文

WPF在MVVM模式下怎么实现导航功能

🕗 发布于 2024-11-11 06:29 wpf  c#  

在mvvm的模式下wpf通过frame实现页面跳转_哔哩哔哩_bilibili

视频讲解同步可观看

如下图，我们要实现点击左侧的菜单，在右侧展示不同的页面

实现代码如下：

一、如何从主窗体跳转到页面。

1、在mainwindow.xaml的菜单栏代码里加入如下代码

  1. ​
  2.  <Border BorderBrush="#3c5254" BorderThickness="3">
  3.      <Button
  4.          Margin="0,3"
  5.          HorizontalAlignment="Stretch"
  6.          Background="#2f3366"
  7.          Command="{Binding NavigateToPageCommand}"
  8.          CommandParameter="Pages/DragPage.xaml"
  9.          Content="控件拖拉拽"
  10.          Cursor="Hand"
  11.          Foreground="White" />
  12.  </Border>

2、在mainwindows.xaml里添加一段代码里加一个导航容器，用于加载、显示和缓存页面，一般是page对像。

  1.  <Frame
  2.      Name="MainFrame"
  3.      Grid.Row="1"
  4.      NavigationUIVisibility="Visible" />

3、在MainWindows.xaml.cs隐藏代码里做如下处理，把2中的frame通过构造函数的方式传到viewmodel中,这段代码放到默认构造函数中

  1.  DataContext = new MainWindowViewModel(this.MainFrame);
  2.  //注册页面加载完成事件
  3.  this.Loaded += MainWindow_Loaded;

4、实现主页面加载方法。

  1.  private void MainWindow_Loaded(object sender, RoutedEventArgs e)
  2.  {
  3.      //在页面加载完成之后跳转到Pages/MainPage.xaml
  4.      MainFrame.Navigate(new Uri("Pages/MainPage.xaml", UriKind.Relative));
  5.  }

6、在viewmodel中实现通过构造函数接收Frame

  1.    public MainWindowViewModel(Frame frame)
  2.    {
  3.        _frame = frame;
  4. ​
  5.    }

7、实现通用的页面跳转方法

  1.     private ICommand _navigateToPageCommand;
  2. ​
  3.     public ICommand NavigateToPageCommand
  4.     {
  5.         get
  6.         {
  7.             return _navigateToPageCommand ?? new RelayCommand(NavigateToPage,null);
  8.         }
  9.     }
  10.     private void NavigateToPage(object? page)
  11.     {
  12.         try
  13.         {
  14.             string pageUri = page as string;
  15.             if (pageUri != null)
  16.                 _frame.Navigate(new Uri(pageUri, UriKind.Relative));
  17.         }
  18.         catch (Exception ex)
  19.         {
  20.         }
  21.       
  22.     }


原文地址：https://blog.csdn.net/weixin_50541844/article/details/143668235

免责声明：本站文章内容转载自网络资源，如本站内容侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！

相关文章

自学内容网
Copyright © 2015-2024