当前位置：首页 > news >正文

WPF Binding 的 Mode 属性

news 2025/6/27 13:12:27

前言

在 WPF 中，Binding 的 Mode 属性决定了数据绑定的方向和行为。Mode 是 Binding 类的一个重要属性，它指定了数据如何在源（Source）和目标（Target）之间流动。可用的 BindingMode 枚举值有以下几种：
1）OneWay (单向绑定)
2）TwoWay (双向绑定)
3）OneTime (一次性绑定)
4）OneWayToSource (反向单向绑定)
5）Default (默认绑定)
下面分别介绍：

1、OneWay (单向绑定)

源属性的更改会自动更新目标属性，目标属性的更改不会影响源属性，适用于显示数据但不允许用户修改的场景
下面的xaml代码中，slider_test是滑动控件对象，同时也是Binding的源，TextBox作为Binding的目标，由于是单向绑定，所以源属性的更改会自动更新目标属性，所以当我们滑动控件slider_test时，TextBox控件Text属性得到更新。

<Window x:Class="控件作为Binding的源.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:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"xmlns:local="clr-namespace:控件作为Binding的源"mc:Ignorable="d"Title="MainWindow" Height="450" Width="800"><StackPanel><Slider x:Name="slider_test" Minimum="0" Maximum="100" Height="100" Background="Red"  /><TextBox Height="100" Background="Green"  Text="{Binding Path= Value, ElementName=slider_test,Mode=OneWay}" /><Button Height="100" Background="Red" /></StackPanel>
</Window>

在这里插入图片描述

2、TwoWay (双向绑定)

源属性和目标属性之间的更改会相互影响，目标属性的更改会更新源属性，反之亦然，常用于可编辑表单或用户交互控件
下面的代码中Mode设置为TwoWay，然后

<Window x:Class="控件作为Binding的源.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:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"xmlns:local="clr-namespace:控件作为Binding的源"mc:Ignorable="d"Title="MainWindow" Height="450" Width="800"><StackPanel><Slider x:Name="slider_test" Minimum="0" Maximum="100" Height="100" Background="Red"  /><TextBox Height="100" Background="Green"  Text="{Binding Path= Value, ElementName=slider_test,Mode=TwoWay }" /><Button Height="100" Background="Red" /></StackPanel>
</Window>

更改滑动控件时，TextBox的Text属性更新。
在这里插入图片描述
将TextBox的值更改为50，滑动控件的Value属性也更新，由于滑动控件的范围是0到100，所以滑动处于中间位置。下面我贴了两张图，第一张图滑动控件没有处于中间位置，你会发现此时鼠标光标位于“50”后面，这是因为默认情况下焦点离开TextBox才会触发TextBox的Text属性值改变，也就是属性UpdateSourceTrigger的值默认值是LostFocus，如果你想要TextBox的值更改后立即触发，直接将UpdateSourceTrigger的值更改为PropertyChanged即可。
在这里插入图片描述

在这里插入图片描述
下面的这张图中滑动控件处于中间位置，因为我点击了最下方的Button控件，让鼠标焦点离开了TextBox，所以触发了TextBox的Text属性更改。

3、OneTime (一次性绑定)

只在绑定初始化时把源属性的值更新给目标属性一次，之后源属性的更改不会影响目标属性，适用于不需要更新的静态数据
下面的xaml代码中，滑动控件slider_test的Value属性值为40，Binding的Mode属性为OneTime，所以运行程序以后，TextBox的Text属性变为40，但是之后改变滑动控件的值TextBox的值不会发生改变，这就是一次性绑定。

<Window x:Class="控件作为Binding的源.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:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"xmlns:local="clr-namespace:控件作为Binding的源"mc:Ignorable="d"Title="MainWindow" Height="450" Width="800"><StackPanel><Slider x:Name="slider_test" Minimum="0" Maximum="100" Height="100" Background="Red"   Value="40"/><TextBox Height="100" Background="Green"  Text="{Binding Path= Value, ElementName=slider_test,Mode=OneTime }" /><Button Height="100" Background="Red" /></StackPanel>
</Window>

在这里插入图片描述

4、OneWayToSource (反向单向绑定)

与 OneWay 模式相反，目标属性的更改会更新源属性，源属性的更改不会影响目标属性，适用于特殊情况，如从 UI 元素收集数据
比如下面的xaml代码中Mode设置为OneWayToSource，只有更改目标TextBox的Text属性值时，源滑动控件slider_test的Value属性才会发生变化，反之你改变slider_test的值，TextBox的Text属性不会改变。

<Window x:Class="控件作为Binding的源.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:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"xmlns:local="clr-namespace:控件作为Binding的源"mc:Ignorable="d"Title="MainWindow" Height="450" Width="800"><StackPanel><Slider x:Name="slider_test" Minimum="0" Maximum="100" Height="100" Background="Red"   /><TextBox Height="100" Background="Green"  Text="{Binding Path= Value, ElementName=slider_test,Mode=OneWayToSource, UpdateSourceTrigger=PropertyChanged}" /><Button Height="100" Background="Red" /></StackPanel>
</Window>