开发手册 欢迎您!
软件开发者资料库

MVVM - 第一个应用程序

MVVM第一个应用程序 - 从简单和简单的步骤开始学习MVVM,从基本到高级概念,包括简介,优点,责任,第一个应用程序,连接视图,连接ViewModel,WPF数据绑定,WPF数据模板,View和ViewModel通信,层次结构和导航,验证,依赖注入,事件,单元测试,框架,面试问题。

在本章中,我们将学习如何将MVVM模式用于简单的输入屏幕以及您可能已经习惯的WPF应用程序.

让我们看一个简单的例子我们将使用MVVM方法.

第1步 : 创建一个新的WPF应用程序项目MVVMDemo.

First Application Step 1

第2步 : 将三个文件夹(Model,ViewModel和Views)添加到项目中.

First Application Step 2

第3步 : 在Model文件夹中添加一个StudentModel类,并使用System.ComponentModel将以下代码粘贴到该类

using System.ComponentModel;namespace MVVMDemo.Model {    public class StudentModel {}   public class Student : INotifyPropertyChanged {      private string firstName;       private string lastName;      public string FirstName {          get {             return firstName;          }         set {             if (firstName != value) {                firstName = value;                RaisePropertyChanged("FirstName");                RaisePropertyChanged("FullName");             }          }       }      public string LastName {          get {return lastName; }          set {            if (lastName != value) {                lastName = value;               RaisePropertyChanged("LastName");               RaisePropertyChanged("FullName");             }          }       }      public string FullName {          get {             return firstName + " " + lastName;          }       }      public event PropertyChangedEventHandler PropertyChanged;      private void RaisePropertyChanged(string property) {         if (PropertyChanged != null) {            PropertyChanged(this, new PropertyChangedEventArgs(property));         }       }    } }

第4步 : 将另一个StudentViewModel类添加到ViewModel文件夹中并粘贴以下代码.

using MVVMDemo.Model; using System.Collections.ObjectModel;namespace MVVMDemo.ViewModel {    public class StudentViewModel {       public ObservableCollection Students {          get;          set;       }      public void LoadStudents() {          ObservableCollection students = new ObservableCollection();         students.Add(new Student { FirstName = "Mark", LastName = "Allain" });          students.Add(new Student { FirstName = "Allen", LastName = "Brown" });          students.Add(new Student { FirstName = "Linda", LastName = "Hamerski" });          Students = students;       }    } }

第5步 : 通过右键单击Views文件夹并选择Add>添加新的用户控件(WPF).新项目......

第一次申请第5步

第6步 : 单击添加按钮.现在您将看到XAML文件.将以下代码添加到包含不同UI元素的StudentView.xaml文件中.

                                                                                                                                                                                                      

第7步 : 现在使用以下代码将StudentView添加到MainPage.xaml文件中.

             

第8步 : 以下是MainPage.xaml.cs文件中Loaded事件的实现,它将使用System.Windows从ViewModel更新View.

using System.Windows;namespace MVVMDemo {   ///       /// Interaction logic for MainWindow.xaml   ///    public partial class MainWindow : Window {      public MainWindow() {         InitializeComponent();      }      private void StudentViewControl_Loaded(object sender, RoutedEventArgs e) {         MVVMDemo.ViewModel.StudentViewModel studentViewModelObject =             new MVVMDemo.ViewModel.StudentViewModel();         studentViewModelObject.LoadStudents();         StudentViewControl.DataContext = studentViewModelObject;      }   } }

第9步 : 编译并执行上述代码后,您将在主窗口中收到以下输出.

First Application第9步

我们建议您逐步执行上述示例,以便更好地理解.