Loading [MathJax]/jax/output/CommonHTML/config.js
前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >WPF自学入门(十)WPF MVVM简单介绍

WPF自学入门(十)WPF MVVM简单介绍

作者头像
黄昏前黎明后
发布于 2019-08-26 09:46:03
发布于 2019-08-26 09:46:03
2.7K0
举报

   前面文章中,我们已经知道,WPF技术的主要特点是数据驱动UI,所以在使用WPF技术开发的过程中是以数据为核心的,WPF提供了数据绑定机制,当数据发生变化时,WPF会自动发出通知去更新UI。

  我们不管是NET中还是WPF中使用模式目的就是想达到高内聚低耦合。在WPF开发中,经典的编程模式是MVVM,是为WPF量身定做的模式,该模式充分利用了WPF的数据绑定机制,最大限度地降低了Xmal文件和CS文件的耦合度,也就是UI显示和逻辑代码的耦合度,如需要更换界面时,逻辑代码修改很少,甚至不用修改。与WinForm开发相比,我们一般在后置代码中会使用控件的名字来操作控件的属性来更新UI,而在WPF中通常是通过数据绑定来更新UI;在响应用户操作上,WinForm是通过控件的事件来处理,而WPF可以使用命令绑定的方式来处理,耦合度将降低。

一、MVVM介绍

  MVVM是Model-View-ViewModel(模型-视图-视图模型)的缩写形式,它通常被用于WPF或Silverlight开发。我们可以通过下图来直观的理解MVVM模式:  

  1、View就是用xaml实现的界面,负责与用户交互,接收用户输入,把数据展现给用户。

  2、ViewModel是一个C#类,负责收集需要绑定的数据和命令,聚合Model对象,通过View类的DataContext属性绑定到View,同时也可以处理一些UI逻辑。

  3、Model,就是系统中的对象,可包含属性和行为。

  三者之间的关系:View对应一个ViewModel,ViewModel可以聚合N个Model,ViewModel可以对应多个View

二、MVVM的优势

MVVM的根本思想就是界面和业务功能进行分离,View的职责就是负责如何显示数据及发送命令,ViewModel的功能就是如何提供数据和执行命令。各司其职,互不影响。在实际的业务场景中我们经常会遇到客户对界面提出建议要求修改,使用MVVM模式开发,当设计的界面不满足客户时,我们仅仅只需要对View作修改,不会影响到ViewModel中的功能代码,减少了犯错的机会。随着功能地增加,系统越来越复杂,相应地程序中会增加View和ViewModel文件,将复杂的界面分离成局部的View,局部的View对应局部的ViewModel,功能点散落在各个ViewModel中,每个ViewModel只专注自己职能之内的事情。ViewModel包含了View要显示的数据,并且知道View的交互代码,所以ViewModel就像一个无形的View。使用MVVM架构具有以下优势

1、易维护

2、灵活扩展

3、易测试

4、用户界面设计师与程序开发者能更好的合作

三、MVVM简单示例

为了让大家直观地了解MVVM的编程模式,下面会用到前面讲到的数据绑定以及命令等知识。

新建WPF项目,名称WPFMVVMDemo。添加用户类,如下图

在WPF术语中,这个叫“模型”,GUI是“视图”。不可思议的是“视图模型”,通过数据绑定将它们绑在一起,它真的是一个很好的适配器能将模型变成某种WPF框架可以使用的东西。所以这个就是“模型”。

接下来我们会非常容易理解创建视图模型:

请注意这个视图模型不是十分正确的。因为我们在视图模型里暴露了属性,我们显然会想使在代码里改变的用户名和公司名自动的显示在视图上

后台代码:

运行结果:

这里我们点击更新按钮不会有任何反应,因为还没有实现数据绑定。此时视图不会收到任何的关于属性改变的通知。要解决这个问题我们必须实现名称为INotifyPropertyChanged的接口。任何实现了这个接口的类,当属性发生改变的时候会通知所有监听者,所以我们需要修改视图模型NameViewModel类:

这里会产生多个事件。首先,我们检查了我们是否真的改变了属性。第二,如果值已经改变,我们向所有监听者注册PropertyChanged事件。现在我们有了一个模型Name和一个视图模型NameViewModel。我们只需要在定义视图。只需要修改视图MainWindow:

运行结果:

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2018-04-03 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
WPF MVVM实例三
WPF技术的主要特点是数据驱动UI,所以在使用WPF技术开发的过程中是以数据为核心的,WPF提供了数据绑定机制,当数据发生变化时,WPF会自动发出通知去更新UI。
zls365
2021/02/26
8740
MVVM模式和在WPF中的实现(一)MVVM模式简介
之前一直用Winform。刚开始看了下感觉跟Winform区别不大,控件可以拖进去,选中了控件属性面板可以设置属性、事件面板可以监听事件,后台代码处理事件,一切都那么的熟悉。XAML布局也跟Android布局很像,所以没学习就直接开始了,觉得摸索摸索基本就差不多了吧。结果各种不适应,拖控件拖进去后总是调整不好显示方式,控件在后台代码中操作找不到方法,对于WPF介绍的各种特点也毫无体会,总想着换回去。后来看了刘铁猛的《深入浅出WPF》,里面说WPF就要用WPF的方式来开发。这才认真开始学WPF。现在控件面板和属性面板都已经用的很少了,界面布局基本全部用代码搞定,感觉任何一个细节都能控制到。再后来接触到了MVVM,更加体会到了以MVVM模式开发WPF带来的好处。现在除非要求已经不再用Winform了,小工具和测试程序直接在后台写代码,复杂一点的需要长期使用和维护的用MVVM模式。这个系列的文章主要写一下自己对MVVM的理解和核心部分的简易实现方式。
zls365
2021/01/28
1.6K0
WPF MVVM实例一
在Model文件夹下新建业务类StudentModel(类文件StudentModel.cs),类的详细代码如下所示。
zls365
2021/02/01
7620
WPF MVVM实例一
WPF面试题-来自ChatGPT的解答
问题来自【愚公系列】2023年07月 WPF控件专题 2023秋招WPF高频面试题[1],回答站长通过ChatGPT重新整理,可对比两者区别学习、整理。
沙漠尽头的狼
2023/08/31
8270
WPF面试题-来自ChatGPT的解答
【愚公系列】2023年11月 WPF控件专题 2023秋招WPF高频面试题
WPF 是微软推出的表现层UI开发框架,全称 Windows Presentation Foundation。 相对Winform来讲,它使用一种全新的桌面应用程序 UI 的开发方式。 除了像Winform那样在“Windows 窗体”上删除控件之外,WPF 还为应用程序开发提供了额外的功能改善,包括丰富的用户界面、动画等等。
愚公搬代码
2023/11/20
8510
MVC, MVP, MVVM比较以及区别
作者:JustRun 原文:cnblogs.com/JustRun1983/p/3679827.html MVC, MVP和MVVM都是用来解决界面呈现和逻辑代码分离而出现的模式。以前只是对它们有部分
顶级程序员
2018/05/03
2.7K0
MVC, MVP, MVVM比较以及区别
如何构建Android MVVM应用程序
Databinding 是一种框架,MVVM是一种模式,两者的概念是不一样的。我的理解DataBinding是一个实现数据和UI绑定的框架,只是一个实现MVVM模式的工具。ViewModel和View可以通过DataBinding来实现单向绑定和双向绑定,这套UI和数据之间的动态监听和动态更新的框架Google已经帮我们做好了。在MVVM模式中ViewModel和View是用绑定关系来实现的,所以有了DataBinding 使我们构建Android MVVM 应用程序成为可能。   之前看了很多关于DataBinding的博客和相关的一些Demo,大多数就是往xml布局文件传入一些数据,然后把这些数据绑定到控件上( 如TextView binding:text=“@{user.name} ),接着在这些控件上(如Button binding:setOnClickListener="@{user.listener}") 设置一些事件到控件上,基本讲述都是DataBinding的基本用法。但是并没有人告诉你把一个onClickListener 写到一个类并把这个listener绑定到xml里面上是不是不太好,也没有人告诉你这个和xml布局绑定的ViewModel类应该放哪些数据,应该做什么事?应该如何设计?更是很少有博文来告诉你在Android 中如何通过Data Binding 去构建MVVM 的应用框架。这也就是是本篇文章的重点。接下来,我们先来看看什么是MVVM,然后在一步一步来设计整个应用程序框架。
developerHaoz
2022/05/13
1.3K0
如何构建Android MVVM应用程序
MVC、MVP、MVVM三剑客
概述 说到Android MVVM,相信大家都会想到Google 2015年推出的DataBinding框架。然而两者的概念是不一样的,不能混为一谈。MVVM是一种架构模式,而DataBinding是一个实现数据和UI绑定的框架,是构建MVVM模式的一个工具。 之前看过很多的文章都有简单的介绍MVVM架构如何使用的,但是呢自己总是一知半解的状态,今天通过再次的学习,终于对MVVM有了一个更深刻的理解,现在就来分享下自己的心得。 MVC、MVP、MVVM 首先让我们来了解下Android中常见的开发模式。 M
用户1337002
2018/03/09
1.2K0
MVC、MVP、MVVM三剑客
MVVM 架构模式:解耦、可测试与高效
在现代的前端开发中,MVVM(Model-View-ViewModel)已成为非常流行的设计模式,尤其是在单页面应用(SPA)开发中。它通过解耦视图和业务逻辑,提升了代码的可维护性和扩展性。今天我们来深入探讨MVVM 的原理、优点,以及如何通过它来构建一个现代应用的架构。
井九
2024/10/12
8020
告别混乱代码!MVVM+数据绑定,让你的Android应用飞起来,MVVM+数据绑定技巧,打造Android应用的数据流水线!
随着移动应用的快速发展,Android操作系统已成为全球最受欢迎的智能手机平台之一。在Android应用开发中,选择合适的软件架构对于项目的可维护性、可扩展性和开发效率至关重要。近年来,MVVM(Model-View-ViewModel)模式因其清晰的职责划分和高度的解耦性而备受关注。本课题将深入探讨MVVM模式在Android开发中的实战应用与数据绑定技巧,旨在提高Android应用的质量和开发效率。
小白的大数据之旅
2024/11/20
1980
告别混乱代码!MVVM+数据绑定,让你的Android应用飞起来,MVVM+数据绑定技巧,打造Android应用的数据流水线!
如何构建Android MVVM 应用框架
概述 说到Android MVVM,相信大家都会想到Google 2015年推出的DataBinding框架。然而两者的概念是不一样的,不能混为一谈。MVVM是一种架构模式,而DataBinding是一个实现数据和UI绑定的框架,是构建MVVM模式的一个工具。 之前看过很多关于Android MVVM的博客,但大多数提到的都是DataBinding的基本用法,很少有文章仔细讲解在Android中是如何通过DataBinding去构建MVVM的应用框架的。View、ViewModel、Model每一层的职责如
美团技术团队
2018/03/12
4.6K1
如何构建Android MVVM 应用框架
“老坛泡新菜”:SOD MVVM框架,让WinForms焕发新春
火热的MVVM框架 最近几年最热门的技术之一就是前端技术了,各种前端框架,前端标准和前端设计风格层出不穷,而在众多前端框架中具有MVC,MVVM功能的框架成为耀眼新星,比如GitHub关注度很高的Vue.js ,由于是国人作品,其设计风格和文档友好度对国人而言更胜一筹,因此我也将它推荐到公司采用,其中我推荐都理由就是它非常优秀的MVVM功能,面向数据而不是面向DOM细节相比jQuery等更加节省代码,更符合后端程序员的胃口,也更有利于UI设计人员跟程序员都分工配合。 下面是Vue.js实现MVVM功能的原理
用户1177503
2018/02/27
3.9K0
“老坛泡新菜”:SOD MVVM框架,让WinForms焕发新春
mvc 和 mvvm 的区别和应用场景?
MVC的思想:Controller负责将Model的数据用View显示出来,换句话说就是在Controller里面把Model的数据赋值给View。
青梅煮码
2023/01/16
6540
mvc 和 mvvm 的区别和应用场景?
C# WPF MVVM开发框架Caliburn.Micro入门介绍①
Caliburn.Micro是一套基于XAML的MVVM模式的开发框架,它小巧而强大。在CaliburnMicro中只需要按照约定把View的名字加上后缀ViewModel,就是它的View Model 的名字,如:MainPage和 MainPageViewModel。Caliburn.Micro自动把ViewModel绑定到View的DataContext。如果ViewModel 的属性名和控件的名称相同,那么就会自动绑定上。
用户9127601
2022/01/13
1.9K0
MVC、MVP、MVVM 架构的特点与区别
   前人种树,后人乘凉。关于MVC、MVP、MVVM这几种架构方式的理解,前辈们写了很多的解答,我结合几篇好文,总结了以下一点点内容。
老猫-Leo
2023/12/11
1K0
MVC、MVP、MVVM 架构的特点与区别
MVVM、RxJava、Retrofit三剑合璧,事半功倍
MVVM和MVP是当前比较流行的两种应用开发架构,两者各有优缺点。目前公司所有Android项目用的都是MVP架构,所以这篇文章我们可以一起来深入了解一下。当然光讲MVVM显得有些空洞,因此本文还会附带上了解经常和它搭配使用的RxJava和Retrofit。
曲水流觞
2019/10/28
2.7K0
Knockout.Js官网学习(简介)
最近一段时间在网上经常看到关于Knockout.js文章,于是自己就到官网看了下,不过是英文的,自己果断搞不来,借用google翻译了一下。然后刚刚发现在建立asp.net mvc4.0的应用程序的时候,建完之后我直接在项目的Scripts中看到了
aehyok
2018/09/11
2.4K0
Knockout.Js官网学习(简介)
MVP/MVC/MVVM
View:它是提供给用户的操作界面,是程序的外壳; Model:是程序需要操作的数据和信息; Controller:接收View层传递过来的指令,选取Model层对应的数据,进行相应操作。
刘亦枫
2020/03/19
5090
MVP/MVC/MVVM
【设计模式】MVC与MVVM详尽解读与实战指南
面对面试官关于MVC与MVVM区别的提问,你可以按照以下逻辑展开论述,囊括它们的核心概念、运行机制以及优劣分析:
空白诗
2024/06/14
5790
关于 MVVM和MVC的一些总结
晚上练完车之后,之前参考我毕设的一个小伙伴要答辩,问了我一个问题,结果问的一下不知道怎么回答…以下是我回答他问题的答案:所以在回答完他之后,赶快整理一波…
IT大咖说
2021/07/19
2.7K0
相关推荐
WPF MVVM实例三
更多 >
领券
💥开发者 MCP广场重磅上线!
精选全网热门MCP server,让你的AI更好用 🚀
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档