WPF MVVM从入门到精通3:数据绑定
WPF MVVM从入门到精通5:PasswordBox的绑定
WPF MVVM从入门到精通6:RadioButton等一对多控件的绑定
我们前面已经说过,现在后端和前端可以分头行事了。我们先来看看后端要做的事情。
对应于用户名输入框,ViewModel里面应该有一个相应的对象。当这个对象状态发生改变时,需要向View发出一个通知。因为所有的属性都要做这么一个事情,我们把通知这件事放到一个基类里面。
using System.ComponentModel;
namespace LoginDemo.ViewModel.Common
{
public abstract class NotificationObject : INotifyPropertyChanged
{
public event PropertyChangedEventHandler PropertyChanged;
/// <summary>
/// 发起通知
/// </summary>
/// <param name="propertyName">属性名</param>
public void RaisePropertyChanged(string propertyName)
{
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}
}
}
这个基类所做的事情,就是当我们调用RaisePropertyChanged的时候,就会通知View,propertyName这个属性改变了,你要做出相应的处理了。
那我们现在的ViewModel,应该是怎样的呢,代码如下:
using LoginDemo.ViewModel.Common;
namespace LoginDemo.ViewModel.Login
{
public class LoginViewModel : NotificationObject
{
public LoginViewModel()
{
obj.UserName = "test";
}
/// <summary>
/// Model对象
/// </summary>
private LoginModel obj = new LoginModel();
/// <summary>
/// 用户名
/// </summary>
public string UserName
{
get
{
return obj.UserName;
}
set
{
obj.UserName = value;
this.RaisePropertyChanged("UserName");
}
}
}
}
我们声明了一个LoginModel的私有对象,用于存储真正的数据内容。而属性UserName,当设置它的值时,它就会发出名为"UserName"这个属性改变的通知。
可能有的人会觉得,Model和ViewModel有太多重复的内容。或许有人会删掉Model类,然后把ViewModel改成这样:
using LoginDemo.ViewModel.Common;
namespace LoginDemo.ViewModel.Login
{
public class LoginViewModel : NotificationObject
{
private string userName;
/// <summary>
/// 用户名
/// </summary>
public string UserName
{
get
{
return userName;
}
set
{
userName = value;
this.RaisePropertyChanged("UserName");
}
}
}
}
这样的设计在最终效果上是一样的,但我并不建议。我们可能会遇到这样的场合:把所有数据保存到一个文件,然后在下次打开软件的时候还原。如果有Model类,我们使用序列化就可以很方便地实现这一功能。当然,Model类存在的理由并不止这一个。所以虽然麻烦一点,我还是建议做一个Model类。
那么后端还要做些什么呢?其实对于UserName的处理,已经完成了。我们现在来看看前端要做的事情。
我们说过,前端存在着大量的绑定。我们使用绑定的方法,把用户名输入框绑定到名为UserName的属性上。
<TextBox Grid.Row="0" Grid.Column="1" Margin="5" Text="{Binding UserName}"/>
代码是相当简单的。我们现在就可以运行软件,然后看到用户名输入框里显示test。当我们修改其内容,在输入框失去焦点时,ViewModel里面的UserName也会变成输入框输入的内容。
至此,前后端的工作都完成了。
WPF MVVM从入门到精通3:数据绑定的更多相关文章
- WPF MVVM从入门到精通8:数据验证
原文:WPF MVVM从入门到精通8:数据验证 WPF MVVM从入门到精通1:MVVM模式简介 WPF MVVM从入门到精通2:实现一个登录窗口 WPF MVVM从入门到精通3:数据绑定 WPF M ...
- WPF MVVM从入门到精通6:RadioButton等一对多控件的绑定
原文:WPF MVVM从入门到精通6:RadioButton等一对多控件的绑定 WPF MVVM从入门到精通1:MVVM模式简介 WPF MVVM从入门到精通2:实现一个登录窗口 WPF MVVM ...
- WPF MVVM从入门到精通7:关闭窗口和打开新窗口
原文:WPF MVVM从入门到精通7:关闭窗口和打开新窗口 WPF MVVM从入门到精通1:MVVM模式简介 WPF MVVM从入门到精通2:实现一个登录窗口 WPF MVVM从入门到精通3:数据绑定 ...
- WPF MVVM从入门到精通5:PasswordBox的绑定
原文:WPF MVVM从入门到精通5:PasswordBox的绑定 WPF MVVM从入门到精通1:MVVM模式简介 WPF MVVM从入门到精通2:实现一个登录窗口 WPF MVVM从入门到精通 ...
- WPF MVVM从入门到精通4:命令和事件
原文:WPF MVVM从入门到精通4:命令和事件 WPF MVVM从入门到精通1:MVVM模式简介 WPF MVVM从入门到精通2:实现一个登录窗口 WPF MVVM从入门到精通3:数据绑定 WP ...
- WPF MVVM从入门到精通2:实现一个登录窗口
原文:WPF MVVM从入门到精通2:实现一个登录窗口 WPF MVVM从入门到精通1:MVVM模式简介 WPF MVVM从入门到精通2:实现一个登录窗口 WPF MVVM从入门到精通3:数据绑定 ...
- WPF MVVM从入门到精通1:MVVM模式简介
原文:WPF MVVM从入门到精通1:MVVM模式简介 WPF MVVM从入门到精通1:MVVM模式简介 WPF MVVM从入门到精通2:实现一个登录窗口 WPF MVVM从入门到精通3:数据绑定 W ...
- WPF/MVVM Quick Start Tutorial - WPF/MVVM 快速入门教程 -原文,翻译及一点自己的补充
转载自 https://www.codeproject.com/articles/165368/wpf-mvvm-quick-start-tutorial WPF/MVVM Quick Start T ...
- WPF自学入门(十一)WPF MVVM模式Command命令 WPF自学入门(十)WPF MVVM简单介绍
WPF自学入门(十一)WPF MVVM模式Command命令 在WPF自学入门(十)WPF MVVM简单介绍中的示例似乎运行起来没有什么问题,也可以进行更新.但是这并不是我们使用MVVM的正确方式 ...
随机推荐
- BZOJ1079:[SCOI2008]着色方案(DP)
Description 有n个木块排成一行,从左到右依次编号为1~n.你有k种颜色的油漆,其中第i种颜色的油漆足够涂ci个木块. 所有油漆刚好足够涂满所有木块,即c1+c2+...+ck=n.相邻两个 ...
- 【[SDOI2014]数数】
被慎老师教育数位\(dp\)怎么写了 看来我数位\(dp\)的写法太落后了 这道题很显然就是一个\(AC\)自动机上的数位\(dp\),按照套路 我们可以设计\(dp[i][j][0/1]\)表示匹配 ...
- 随手练——HDU 1237 表达式求值(输入格式典型)
坑了老子半天,结果是 float 范围不够!!! 基本思想: 开一个符号栈,一个数字栈: 碰到数字就入栈,碰到符号就与栈顶符号进行对比,如果当前符号优先级小于栈顶符号,数字栈弹出两个数进行栈顶符号运算 ...
- 剑指offer 最小的k个数 、 leetcode 215. Kth Largest Element in an Array 、295. Find Median from Data Stream(剑指 数据流中位数)
注意multiset的一个bug: multiset带一个参数的erase函数原型有两种.一是传递一个元素值,如上面例子代码中,这时候删除的是集合中所有值等于输入值的元素,并且返回删除的元素个数:另外 ...
- Java50道经典习题-程序33 杨辉三角
题目:打印出杨辉三角形(要求打印出10行如下图)分析: 1 1 1 1 2 1 1 3 3 1 1 4 6 4 11 5 10 10 5 ...
- ROS C++ 规范概要
一.动机 代码一致才能可读.联调.高效率.高复用.可移植性. 二.命名方式 CamelCased camelCased under_scored ALL_CAPITALS 2.1 Package命名方 ...
- jFinal 2.2入门学习之一:搭建框架输出helloword
官方推荐用Eclipse IDE for Java EE Developers 做为开发环境 1.创建 Dynamic Web Project 2.修改 Default Output Folder,推 ...
- Vue学习—组件的学习
1.什么是组件? 组件(Component)是 Vue.js 最强大的功能之一.组件可以扩展 HTML 元素,封装可重用的代码.在较高层面上,组件是自定义元素, Vue.js 的编译器为它添加特殊功能 ...
- 精准测试白皮书v3.0-2019最新版
现代社会是建立在各种以计算机为基石的软件技术基础之上的.随着日新月异的需求变化,软件系统越来越复杂.很多人觉得软件开发才是重要环节,但实际上,无法对大型软件进行有效的质量把控,就无法真正构建与维护大型 ...
- MySQL的笔记
一. SELECT tmp2.name,tmp2.browseNum FROM (SELECT tmp.`name`, COUNT(tmp.id) AS browseNum FROM(SELECT ...