MVVM模式学习(一)

MVVM是Model-View-ViewModel(模型-视图-视图模型)的简写,本质上是MVC的改进版。MVVM 就是将其中的View 的状态和行为抽象化,让我们将视图 UI 和业务逻辑分开。当然这些事 ViewModel 已经帮我们做了,它可以取出 Model 的数据同时帮忙处理 View 中由于需要展示内容而涉及的业务逻辑。MVVM(Model-View-ViewModel)框架的由来便是MVP(Model-View-Presenter)模式与WPF结合的应用方式时发展演变过来的一种新型架构框架。

MVVM模式和MVC模式一样,主要目的是分离视图(View)和模型(Model),有几大优点

  1. 低耦合。视图(View)可以独立于Model变化和修改,一个ViewModel可以绑定到不同的"View"上,当View变化的时候Model可以不变,当Model变化的时候View也可以不变。
  2. 可重用性。你可以把一些视图逻辑放在一个ViewModel里面,让很多view重用这段视图逻辑。
  3. 独立开发。开发人员可以专注于业务逻辑和数据的开发(ViewModel),设计人员可以专注于页面设计,使用Expression Blend可以很容易设计界面并生成xaml代码。
  4. 可测试。界面素来是比较难于测试的,而现在测试可以针对ViewModel来写。

下面是一个简单在WPF项目中应用MVVM框架的示例:
1、首先根据Model-View-ViewModel框架名称在项目中分别建立Models、Views、ViewModels三个文件夹,代表Model、View、ViewModel三层架构,三层架构概念与功能:
Model层:核心数据层,存放各种核心数据类,该层不涉及逻辑,只是单纯定义各类数据及相应数据属性
ViewModel层:用我自己的理解来说,这一层是对Model层中的各类核心数据根据实际需求再次进行建模的过程,并且包含对数据进行操作的控制逻辑,建立好的模型同时拥有与界面层交互的能力
View层:顾名思义就是数据展示层,将数据以各种各样的表现形式在界面上显示出来
2、然后以建立多人信息表格为例,核心数据模型即是个人信息,在Model中建立Person类,包含姓名、年龄两个属性

    public class Person
    {
        private string name;
        public string Name
        {
            get { return name; }
            set { name = value; }
        }
        private int age;
        public int Age
        {
            get { return age; }
            set { age = value; }
        }
    }

3、再在ViewModel中创建MainViewModel类(主视图模型),前文提到过ViewModel层具有与界面层交互的能力,反映在代码中即是该视图模型中用来展示的数据在发生改变的时候具有能够通知界面层改变的能力,这需要MainViewModel类实现InotifyPropertyChanged接口,由于ViewModel层可能不止有一个ViewModel,所以我们可以先建立一个已经实现了InotifyPropertyChanged接口的ViewModel的基类,然后让各ViewModel均继承这个基类即可,我这里将该基类定义为NoificationObject

    public class NotificationObject : INotifyPropertyChanged
    {
        public event PropertyChangedEventHandler PropertyChanged;
        public void RaisePropertyChanged(string propertyname)
        {
            if (PropertyChanged != null)
            {
                PropertyChanged(this, new PropertyChangedEventArgs(propertyname));
            }
        }

    }

其中RaisePropertyChanged()方法便能够根据参数属性名通知界面哪个参数发生了改变
下面建立MainViewModel类(继承上面的基类)
展示层所关心的数据是多人的信息,那么ViewModel层中便需要有一个存储多个Person实例信息的集合成员Human,同时该成员改变时需通知界面层,MainViewModel类如下(可在Constructor中预先向Human中先填充一些数据):

    public class MainViewModel:NotificationObject
    {
        private ObservableCollection<Person> human = null;
        public ObservableCollection<Person> Human
        {
            get
            {
                return human;
            }
            set
            {
                human = value;
                if (human != value)
                {
                    human = value;
                    RaisePropertyChanged("Human");
                }
            }
        }
        public MainViewModel()
        {
            human = new ObservableCollection<Person>();
            Human.Add(new Person { Name = "Tom", Age = 21 });
            Human.Add(new Person { Name = "Jack", Age = 22 });
            Human.Add(new Person { Name = "Rose", Age = 23 });
        }
    }

4、MainViewModel建立后,开始View展示层编写,由于这里只有一个界面,所以就在主界面中展示,Xaml代码如下

<Window.DataContext>
        <ViewModel:MainViewModel></ViewModel:MainViewModel>
    </Window.DataContext>
    <StackPanel>
        <DataGrid AutoGenerateColumns="False" Height="200" ItemsSource="{Binding Human}" HorizontalAlignment="Left" Margin="34,20,0,0" Name="dataGrid1" VerticalAlignment="Top" Width="516">
            <DataGrid.Columns>
                <DataGridTextColumn Header="姓名" Binding="{Binding Name}"></DataGridTextColumn>
                <DataGridTextColumn Header="年龄" Binding="{Binding Age}"></DataGridTextColumn>
            </DataGrid.Columns>
        </DataGrid>
    </StackPanel>

可以看出xaml代码中是通过wpf独有的DataContext和Binding等方法将ViewModel中的数据与界面关联起来
最后效果如下:
在这里插入图片描述
可以看出在主界面没有添加任何后台代码情况下便将数据显示出来,这是MVVM的优势,大大降低前端界面与后台代码的耦合性

还可以通过在MainViewModel中定义用于数据操作(逻辑控制)的Command,同样通过Binding的方式给添加按钮绑定Comand,从而实现界面对数据的操作

另外还有一个对MVVM框架进行进一步模块化和封装的框架——Prism框架,其中有类似定义好的模型视图基类或DelegateCommand等可让我们直接调用,大大方便了基于MVVM框架的开发

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
MVVM(Model-View-ViewModel)是一种软件设计模式,常用于开发用户界面。它的优点和缺点如下: 优点: 1. 分离关注点:MVVM将应用程序的逻辑、数据和视图分离开来,使得代码更加清晰和可维护。模型(Model)负责处理数据和业务逻辑,视图(View)负责展示数据和用户交互,而视图模型(ViewModel)则充当模型和视图之间的桥梁。 2. 可测试性:MVVM通过将视图逻辑从视图中抽离出来,使得视图可以更容易地进行单元测试。视图模型可以通过数据绑定来模拟和验证视图的行为,从而提高代码的可测试性。 3. 可复用性:MVVM鼓励重用已有的视图和视图模型,通过数据绑定和命令绑定实现视图和视图模型之间的解耦。这样一来,我们可以在不修改已有代码的情况下,将不同的视图与不同的视图模型进行组合,从而实现高度可复用的界面组件。 4. 前后端分离:MVVM支持前后端分离开发模式,使前端开发人员专注于界面逻辑的实现,后端开发人员专注于数据处理和业务逻辑的实现,从而提高开发效率。 缺点: 1. 学习曲线:相较于传统的MVC模式MVVM模式需要开发人员掌握更多的概念和技术,如数据绑定、命令绑定等。因此,对于初学者来说,学习和理解MVVM可能需要一定的时间和精力。 2. 过度设计:在某些场景下,MVVM模式可能会导致过度设计。因为视图模型和视图之间的解耦有时候会引入额外的复杂性,特别是对于简单的界面来说,采用MVVM模式可能显得过于繁琐。 3. 数据绑定性能:MVVM依赖于数据绑定机制来实现视图与视图模型之间的数据同步。在一些性能要求较高的场景下,由于数据绑定机制的实现机制,可能会对应用程序的性能产生一定的影响。 需要注意的是,MVVM并不适用于所有的开发场景,开发人员需要根据具体情况选择合适的设计模式

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值