WPF MVVM示例讲解
更新时间：2015年08月04日 15:52:11 投稿：mrr
WPF技术的主要特点是数据驱动UI,所以在使用WPF技术开发的过程中是以数据为核心的，WPF提供了数据绑定机制，当数据发生变化时，WPF会自动发出通知去更新UI，这篇文章通过示例让大家体验下WPF MVM，有需要的朋友可以参考下
在没给大家讲解wpf mwm示例之前先给大家简单说下MVVM理论知识：
WPF技术的主要特点是数据驱动UI,所以在使用WPF技术开发的过程中是以数据为核心的，WPF提供了数据绑定机制，当数据发生变化时，WPF会自动发出通知去更新UI。
我们使用模式，一般是想达到高内聚低耦合。在WPF开发中，经典的编程模式是MVVM，是为WPF量身定做的模式，该模式充分利用了WPF的数据绑定机制，最大限度地降低了Xmal文件和CS文件的耦合度，也就是UI显示和逻辑代码的耦合度，如需要更换界面时，逻辑代码修改很少，甚至不用修改。与WinForm开发相比，我们一般在后置代码中会使用控件的名字来操作控件的属性来更新UI，而在WPF中通常是通过数据绑定来更新UI；在响应用户操作上，WinForm是通过控件的事件来处理，而WPF可以使用命令绑定的方式来处理，耦合度将降低。
首先MVVM设计模式的结构
Views: 由Window/Page/UserControl等构成，通过DataBinding与ViewModels建立关联；
ViewModels：由一组命令，可以绑定的属性，操作逻辑构成；因为View与ViewModel进行了解耦，我们可以对ViewModel进行Unit Test；
Models：可以是实体对象或者Web服务；
下面通过一个简单的例子，来介绍一些WPF MVVM模式。示例将展示一个图片浏览器，打开图片，放大/缩小图片大小。首先项目结构：
UI:
<Grid>
<DockPanel>
<Menu DockPanel.Dock="Top">
<Menu>
<MenuItem Header="_Open" Command="{Binding OpenFileCommand}"/>
</Menu>
<Menu>
<MenuItem Header="_ZoomIn" Command="{Binding ZoomCommand}" CommandParameter="ZoomIn"/>
</Menu>
<Menu>
<MenuItem Header="_ZoomOut" Command="{Binding ZoomCommand}" CommandParameter="ZoomOut"/>
</Menu>
<Menu>
<MenuItem Header="_Normal" Command="{Binding ZoomCommand}" CommandParameter="Normal"/>
</Menu>
</Menu>
<ScrollViewer>
<Image Source="{Binding ImagePath}" Stretch="None">
<Image.LayoutTransform>
<ScaleTransform ScaleX="{Binding Zoom}" ScaleY="{Binding Zoom}"/>
</Image.LayoutTransform>
</Image>
</ScrollViewer>
</DockPanel>
</Grid>
ViewModelBase(用来实现修改通知):
public class ViewModelBase : INotifyPropertyChanged
{
public event PropertyChangedEventHandler PropertyChanged;
protected virtual void OnPropertyChanged(string propName)
{
if(PropertyChanged!=null)
{
PropertyChanged(this, new PropertyChangedEventArgs(propName));
}
}
}
OpenFileCommand:
public class OpenFileCommand : ICommand
{
private MainViewModel _data;
public OpenFileCommand(MainViewModel data)
{
_data = data;
}
public event EventHandler CanExecuteChanged;
public bool CanExecute(object parameter)
{
return true;
}
public void Execute(object parameter)
{
OpenFileDialog dialog = new OpenFileDialog() { Filter = "Image Files|*.jpg;*.png;*.bmp;*.gif" };
if(dialog.ShowDialog().GetValueOrDefault())
{
_data.ImagePath = dialog.FileName;
}
}
ZoomCommand:
public enum ZoomType
{
ZoomIn = 0,
ZoomOut = 1,
Normal = 2
}
public class ZoomCommand : ICommand
{
private MainViewModel _data;
public ZoomCommand(MainViewModel data)
{
_data = data;
}
public event EventHandler CanExecuteChanged
{
add { CommandManager.RequerySuggested += value; }
remove { CommandManager.RequerySuggested -= value; }
}
public bool CanExecute(object parameter)
{
return _data.ImagePath != null;
}
public void Execute(object parameter)
{
ZoomType type = (ZoomType)Enum.Parse(typeof(ZoomType), (string)parameter, true);
switch(type)
{
case ZoomType.Normal:
_data.Zoom = 1;
break;
case ZoomType.ZoomIn:
_data.Zoom *= 1.2;
break;
case ZoomType.ZoomOut:
_data.Zoom /= 1.2;
break;
}
}
}
MainViewModel:
public class MainViewModel : ViewModelBase
{
private string _imagePath;
public string ImagePath
{
get
{
return _imagePath;
}
set
{
if (_imagePath != value)
{
_imagePath = value;
OnPropertyChanged("ImagePath");
}
}
}
private double _zoom = 1.0;
public double Zoom
{
get
{
return _zoom;
}
set
{
if(_zoom != value)
{
_zoom = value;
OnPropertyChanged("Zoom");
}
}
}
private ICommand _openFileCommand;
public ICommand OpenFileCommand
{
get { return _openFileCommand; }
}
private ZoomCommand _zoomCommand;
public ZoomCommand ZoomCommand
{
get { return _zoomCommand; }
}
public MainViewModel()
{
_openFileCommand = new OpenFileCommand(this);
_zoomCommand = new ZoomCommand(this);
}
}
下一步我们要做的是将MainViewModel绑定到MainWindow上，我们可以通过下面两种方式绑定：
1. 直接在MainWindow的Code Behind中进行绑定：
public MainWindow()
{
InitializeComponent();
DataContext = new MainViewModel();
}
2. 在App.xaml后台代码中绑定(将App.xaml中StartupUri="MainWindow.xaml"删除掉)：
public App()
{
MainWindow window = new MainWindow();
window.DataContext = new MainViewModel();
window.Show();
}
运行效果图如下：
以上就是针对WPF MVVM示例讲解的全部内容，并附有效果图，看着还不错吧，希望大家能够喜欢，欢迎提出宝贵意见。
相关文章
在本篇文章中给大家详细讲述了c#源码的执行过程，对此有需要的朋友们可以学习下。2018-07-07
这篇文章介绍了C#使用XSLT实现xsl、xml与html相互转换的方法，文中通过示例代码介绍的非常详细。对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2022-06-06
用C#读取xml有很多方式，这里我就先使用XmlDocument读取Xml，用一段代码遍历所有元素，并打印student的所有属性和子节点的值2013-04-04
本篇文章是对使用C# Winform应用程序获取网页源文件的方法进行了详细的分析介绍，需要的朋友参考下2013-05-05
这篇文章主要介绍了Linq利用Distinct去除重复项问题(可自己指定)，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2023-01-01
这篇文章介绍了C#使用NPOI对Excel数据进行导入导出的方法，文中通过示例代码介绍的非常详细。对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2022-06-06
这篇文章主要介绍了C# Winform程序实现防止多开的方法,结合实例形式总结分析了C# Winform防止多开相关操作技巧与使用注意事项,需要的朋友可以参考下2020-03-03
在日常工作中，我们可能常常需要打印各种文件资料，比如word文档。对于编程员，应用程序中文档的打印是一项非常重要的功能，也一直是一个非常复杂的工。这篇文章主要介绍了C#完成word文档打印的方法,需要的朋友可以参考下2016-10-10
这篇文章主要介绍了.net实现序列化与反序列化实例解析,需要的朋友可以参考下2014-08-08
C# winform程序实现开机自启动并且识别是开机启动还是双击启动
这篇文章主要介绍了C# winform程序实现开机自启动并且识别是开机启动还是双击启动的实现代码，代码简单易懂，非常不错，具有一定的参考借鉴价值,需要的朋友可以参考下2018-10-10
最新评论