WPF依赖项属性可以实现属性的绑定,成功绑定之后只要修改后台绑定的属性,即可UI同步自动更新绑定的值,无需手动刷新界面;同样,前台的值变化后,通过获取绑定的属性值也可获取UI变化后的值,实现双向变化的效果。属性绑定使得UI更新非常的方便,下面分享一个小栗子说明使用的方式。
1、先做了一个有一个TextBlock和一个Button的UI,想要实现点击后TextBlock发生变化。
"WPFDemo.Window1"
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:WPFDemo"
mc:Ignorable="d"
Title="Window1" Height="300" Width="300">
<Grid>
<Button Name="Button_OK" MaxWidth="50" MaxHeight="20" Click="Button_OK_Click">OK</Button>
<TextBlock MaxWidth="50" MaxHeight="20" VerticalAlignment="Top" HorizontalAlignment="Left" Text="{Binding Text}"></TextBlock>
</Grid>
</Window>
知识兔2、创建UI更新类(现在是测试,所以属性比较少,正常开发建议一个UI创建一个UI更新类专门用于UI更新),如下为完整代码
public class PropertyToUI : INotifyPropertyChanged
{
#region 私有变量
/// <summary>
/// 状态栏显示文本
/// </summary>
private string text = "";
#endregion
#region 属性
/// <summary>
/// 属性-显示文本
/// </summary>
public string Text
{
get { return text; }
set
{
text = value;
OnPropertyChanged("Text");
}
}
#endregion
#region 属性变化通知事件
/// <summary>
/// 属性变化通知事件
/// </summary>
public event PropertyChangedEventHandler PropertyChanged;
/// <summary>
/// 属性变化通知
/// </summary>
/// <param name="e"></param>
public void OnPropertyChanged(PropertyChangedEventArgs e)
{
if (PropertyChanged != null)
{
PropertyChanged(this, e);
}
}
/// <summary>
/// 属性变化通知事件
/// </summary>
/// <param name="PropertyName"></param>
public void OnPropertyChanged(string PropertyName)
{
PropertyChangedEventArgs e = new PropertyChangedEventArgs(PropertyName);
if (PropertyChanged != null)
{
PropertyChanged(this, e);
}
}
#endregion
}
知识兔这个部分有如下几个关键点:
(1)、需要实现INotifyPropertyChanged接口,这是一个属性更新接口,可以看一下它的实现,有一个属性更新事件,所以要说声明该事件。
namespace System.ComponentModel
{
//
// 摘要:
// Notifies clients that a property value has changed.
public interface INotifyPropertyChanged
{
//
// 摘要:
// Occurs when a property value changes.
event PropertyChangedEventHandler PropertyChanged;
}
}
知识兔(2)、创建属性更新函数
/// <summary>
/// 属性变化通知
/// </summary>
/// <param name="e"></param>
public void OnPropertyChanged(PropertyChangedEventArgs e)
{
if (PropertyChanged != null)
{
PropertyChanged(this, e);
}
}
知识兔参数为某个属性的更新事件,而后触发PropertyChanged(this, e)通知UI更新指定属性
(3)、包装属性
public string Text
{
get { return text; }
set
{
text = value;
OnPropertyChanged("Text");
}
}
知识兔在设置器中调用属性更新事件,即当后台设置值时(想要更新UI值),就会触发属性更新事件,通知前台绑定的依赖项属性进行更新(事件中带有属性的身份标识和值进行传递)。
3、前台依赖项属性对属性更新类中的属性进行绑定(Binding语法)
"50" MaxHeight="20" VerticalAlignment="Top" HorizontalAlignment="Left" Text="{Binding Text}"></TextBlock>
知识兔属性名绑定即可
4、绑定数据源的说明(这是比较容易忘记的地方)
new PropertyToUI();
this.DataContext = UI; //事件绑定数据源
知识兔以上就是属性绑定的必要步骤了,如果没什么问题基本就成功了,没成功的再好好检查一下。
如下为完整的后台代码:
/// <summary>
/// Window1.xaml 的交互逻辑
/// </summary>
public partial class Window1 : Window
{
/// <summary>
/// UI更新类对象
/// </summary>
PropertyToUI UI = new PropertyToUI();
/// <summary>
/// 构造函数
/// </summary>
public Window1()
{
InitializeComponent();
this.DataContext = UI; //事件绑定数据源
UI.Text = "程序开启";
}
/// <summary>
/// OK按键点击事件
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
private void Button_OK_Click(object sender, RoutedEventArgs e)
{
UI.Text = "我更新了";
MessageBox.Show(UI.Text);
}
}
知识兔运行效果如下:
点击OK按键后: