WPF 5 绑定 (Binding)

本文介绍了WindowsPresentationFoundation(WPF)中的绑定机制,包括元素绑定的原理、不同绑定模式(单向、双向、单次等)以及如何将绑定应用到非元素对象。同时提到了MVVM架构中的角色,展示了如何通过绑定分离事件和UI。
摘要由CSDN通过智能技术生成

什么是绑定(Binding)?

在winform中, 我们常常会用到各种类型的赋值, 例如:

  • button1.Text=“Hello”;
  • label.Text=“Hello”;


类似这种赋值操作, 我们之所以不称之为绑定, 主要原因是因为他们大多数操作都是一次性的, 无论是数据还是按钮本身发生变化,对两者而言都是不可见的。

而绑定的概念则侧重于: 两者的关联,协议与两者之间的影响。
首先, 从一个简单的例子来理解什么是绑定。

创建一个滑块控件, 并且希望在滑动的过程中, 把值更新到另外一个静态文本上。代码如下:
在这里插入图片描述

在winform中, 我们常规的做法会给滑块创建一个值改变事件,同时将滑块的值赋值给文本。wpf中也可以,添加一个ValueChange事件
在这里插入图片描述
在这里插入图片描述
运行效果
在这里插入图片描述
要实现双向绑定,即给textbox也添加数据绑定事件
在这里插入图片描述
后端代码
在这里插入图片描述
完成了双向绑定。

绑定到元素控件

接下来, 只需要在静态文本中添加一小段绑定的声明,即可完整原本很复杂的操作:

-Text=

  • {Binding }: Binding的声明语法, 一对尖括号,开头声明以Binding 开始。
  • ElementName: 该声明意为, 设置元素的名称
  • Path: 设置关联元素的位置,上例中设置为元素的value属性。

那么该如何理解整句话的意义, 翻译: 静态文本TextBlock的Text属性将通过绑定的方式关联到元素名 ‘slider’ 的value属性上。
在这里插入图片描述
效果图所示:
在这里插入图片描述
在这里插入图片描述
滑块改动textblock的值

可以看到,在滑块不断的滑动过程中, TextBlock也在不断的发生变化, 说明TextBlock已经得到了滑动滑动过程中的值变化, 这种关联, 我们称之为绑定,
在WPF当中, 绑定又分很多种, 而上面这种则是通过元素绑定的方式。
理解了基础的绑定之后,然后就是理解绑定的模式。

绑定的模式就类似我们商业中的合作, 是一次性回报还是持续获益, 是否可以单方面终止, 是否具有投票权等, 在WPF中绑定的模式又分为五种:

OneWay(单向绑定) :

当源属性发生变化更新目标属性, 类似上面的例子中, 滑动变化更新文本的数据。示例:

在这里插入图片描述
效果:
在这里插入图片描述
滑块改动textblock的值,下方文本框输入值,不会改变华东框上面的值

TwoWay(双向绑定) :

当源属性发生变化更新目标属性, 目标属性发生变化也更新源属性。

与单向绑定的区别可以理解为, 前者只能打你,被打者不能还手, 双向绑定的意思则是: 你敢打我一巴掌,我也能回你一巴掌。示例:

效果:
在这里插入图片描述
直接修改文本框内容也能 改变滑动框值

OneTime(单次模式) :

根据第一次源属性设置目标属性, 在此之后所有改变都无效。

如第一次绑定了数据源为0, 那么无论后面如何改变 2、3、4… 都无法更新到目标属性上。示例:
在这里插入图片描述
只是绑定最初的第一个初始值,以后无论怎么改变都不会在变化

OneWayToSource :

和OneWay类型, 只不过整个过程倒置。示例:
在这里插入图片描述
只能以text 改变 滑动框的值, 不能以滑动框 改变文本框的值

Default :

既可以是双向,也可以是单项, 除非明确表明某种模式, 否则采用该默认绑定(默认是双向绑定

绑定到非元素上

上面的代码中,使用的绑定方式是根据元素的方式: ElementName=xxx, 如需绑定到一个非元素的对象, 则有一下几属性:

Source :

指向一个数据源, 示例, TextBox使用绑定的方式用Source指向一个静态资源ABC:
在这里插入图片描述

RelativeSource :

使用一个名为RelativeSource的对象来根据不同的模式查找源对象,

示例, 使用RelativeSource的FindAncestor模式, 查找父元素为StackPanel的Width值
在这里插入图片描述

DataContext:

从当前的元素树向上查找到第一个非空的DataContext属性为源对象。

示例, 该示例用后台代码创建一个只包含Name的类, Test, 通过绑定窗口的DataContext上下文:

在这里插入图片描述

后台代码绑定简单文本与列表

创建一个PageModel类, 定一个ClassName为班级名称, 和一个Students学生列表, 后台代码:
在这里插入图片描述

窗口代码
在这里插入图片描述
效果预览
在这里插入图片描述
关于以上, 基本介绍了WPF元素绑定的方式与几种模式, 接下讲的是, WPF中的事件如果通过绑定的方式和UI分离。尽管WPF中仍然可以兼容winform中的事件模型, 而binding也是MVVM架构中的重要组成部分(下节会介绍)

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值