WPF新手快速入门系列 3.MVVM

【概要】

这一章主要讲述，讲述MVVM模式和用法。

如有学习过程中想交流学习、疑惑解答可以来此QQ群交流：580749909。（所有涉及到的源码都上传到了群文件里）

希望加群的人提问时尽量想清楚自己的问题，愿意钻研而不是等现成的答案而不去思考。祝各位同仁早日学会WPF这项技术。

 

【MVVM】

前言：MVVM的核心思想就是界面与代码分离，实现“解耦”。是一种开发模式，并不是一种开发框架。主要是以数据驱动的开发模式。

先从项目应用的角度来介绍一下MVVM是什么、怎么用、项目中该怎么建项目结构。

话不多说直接上图：

图中的结构一眼就能看明白如何建项了，但是实际开发中它们之间的关系又是如何呢，如何使用起来呢。

 

【关系】

View：

拿到需求的第一件事就是会知道界面要做成什么样子，那么第一个创建的就是View。

ViewModel：

主要用来实现业务逻辑的地方，比如需要计算 1 + 1的结果显示到View上。

Model：

这一层主要是用来存放，ViewModel种需要用到的实体类。比如ViewModel业务处理逻辑需要用到的自定义类都可以放到这一层。

 

【调用】

View：

<Window
    x:Class="TestX.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:local="clr-namespace:TestX"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    Title="MainWindow"
    Width="800"
    Height="800"
    Opacity="1"
    mc:Ignorable="d">
    <Grid>
        <ListBox ItemsSource="{Binding NameCollection}"></ListBox>
    </Grid>
</Window>

View-Code:

DataContext 一般是用来放view model的，因为你要绑定或操作的对象都在view model里。当然也能存放其它类型的对象。

namespace TestX
{
    /// <summary>
    /// MainWindow.xaml 的交互逻辑
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            this.DataContext = new MainViewModel();
        }
    }
}

ViewModel:

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

namespace TestX.ViewModels
{
    public class MainViewModel : ViewModelBase
    {
        private ObservableCollection<MainModel> _nameCollection;

        public ObservableCollection<MainModel> NameCollection
        {
            get
            {
                return _nameCollection;
            }

            set
            {
                _nameCollection = value;
            }
        }

        /// <summary>
        /// Initializes a new instance of the MainViewModel class.
        /// </summary>
        public MainViewModel()
        {
            Do();
        }
         
        private void Do() {
            NameCollection = new ObservableCollection<MainModel>();
            NameCollection.Add(new MainModel() { Name = "张三" });
            NameCollection.Add(new MainModel() { Name = "李四" });
            NameCollection.Add(new MainModel() { Name = "王五" });
        }
    }
}

 

Model：

 public class MainModel
    {
        public string Name { get; set; }

        public override string ToString()
        {
            return Name;
        }
    }

 

最终效果：