MVVMLight绑定数据

  我们先新建一个WPF项目MVVMLightDemo,添加GalaSoft.MvvmLight.dll(没有可以自己下载)

  

  然后在项目中添加三个文件夹,如图:

    

  先添加我们的Model,在Model下新建一个类Student

  

using GalaSoft.MvvmLight;
using System.Collections.ObjectModel;

namespace MVVMLightDemo.Model
{
    public class Student : ObservableObject
    {
        private int stuNo;

        public int StuNo
        {
            get { return stuNo; }
            set { stuNo = value; RaisePropertyChanged(() => StuNo); }
        }
        private string name;

        public string Name
        {
            get { return name; }
            set { name = value; RaisePropertyChanged(() => Name); }
        }



        public static ObservableCollection<Student> GetStudentList()
        {
            ObservableCollection<Student> list = new ObservableCollection<Student>();
            list.Add(new Student() { StuNo = 1, Name = "张三" });
            list.Add(new Student() { StuNo = 2, Name = "李四" });
            return list;
        }
    }
}

  注意:1.该类继承了ObservableObject,该类主要实现了属性变更通知接口,如我们用到的:RaisePropertyChanged 方法

     2.该类中的GetStudentList()方法只是为了得到数据,我们项目里一般都是从数据库查数据。

 

接着,我们在ViewModel下添加StudentViewModel文件,代码如下:

using GalaSoft.MvvmLight;
using MVVMLightDemo.Model;
using System.Collections.ObjectModel;

namespace MVVMLightDemo.ViewModel
{
    public class StudentViewModel : ViewModelBase
    {
        private ObservableCollection<Student> studentData;
        public ObservableCollection<Student> StudentData
        {
            get
            {
                return studentData;
            }
            set
            {
                studentData = value;
                RaisePropertyChanged(() => StudentData);
            }
        }


        public StudentViewModel()
        {
            studentData = Student.GetStudentList();
        }
    }
}

  注意:该类继承了ViewModelBase(ViewModelBase 也继承了ObservableObject),不要忘记using System.Collections.ObjectModel;

  我在该类的构造函数中,对 StudentData 进行了初始化,把数据给赋值上去了,那么在接下来的View中绑定 StudentData 才会出现数据。

 

最后,在View文件夹下添加StudentView.xaml文件。代码如下:

1 <Window x:Class="MVVMLightDemo.View.StudentView"
2         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
3         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
4         Title="StudentView" Height="300" Width="300">
5     <Grid>
6         <DataGrid Name="studentDataGrid" ItemsSource="{Binding Path=StudentData}"/>
7     </Grid>
8 </Window>

仅这样还不行,我们还需要让View与ViewModel关联起来,那么需要设置这个View的数据上下文。 在后台编写如下代码(也可在前台编写绑定DataContext)

 1 using System.Windows;
 2 using MVVMLightDemo.ViewModel;
 3 
 4 namespace MVVMLightDemo.View
 5 {
 6     public partial class StudentView : Window
 7     {
 8         public StudentView()
 9         {
10             InitializeComponent();
11             this.DataContext = new StudentViewModel();
12         }
13     }
14 }

好了,到这里我们实现了MVVMLight的数据绑定,后面将在这个代码的基础上,介绍命令绑定。

 装模作样的声明一下:本博文章若非特殊注明皆为原创,若需转载请保留原文链接(http://www.cnblogs.com/kest/p/4691423.html)及作者信息k_est

 

posted @ 2015-07-31 10:23  k_est  阅读(2508)  评论(4编辑  收藏  举报