WPF绑定与通知属性到界面

死灵

绑定与通知属性到界面

本文同时为b站的笔记，相关示例代码
前言

在上一篇文章C#代码事件里面，我们介绍了利用给控件命名的方式，在后端代码中访问并修改属性。这样子直截了当，但是这样后端代码依赖于前端。如果前端的代码变动较大，后端代码可能要大面积重构。
于是利用绑定的这种方法，将前后端分离，前端只需把需要修改的属性设置好绑定变量名，后端只需盯着这些变量名进行操作。
这样还可以实现前后端双人开发，后端开发者只需把那些操作的接口名称告诉前端，让对方去绑定相应的空间属性即可。
绑定

控件属性设置为"{Binding xxxx}"
例如绑定文本框的文字内容到UserName：

1. [/code]在后端中写入：
2. [code]public string UserName { get; set; }

复制代码

接下来就可以在后端的代码中直接使用变量UserName。
其中get; 与set;是自动生成了属性的访问器，分别用于获取属性的值与修改属性的值。这是自动实现的属性，不需要手写。

可以输入prop然后按 Tab 键两次，一键生成

1. public int MyProperty { get; set; }

复制代码

属性的代码模板，加快了编写常见代码结构的速度。

属性的初值

假如想要程序刚运行的时候，文本框里就已经有文字，可以给绑定的变量赋值：

1. public string UserName { get; set; } = "333"

复制代码

但是运行会发现，并没有预期的效果。
可以在窗口的构造函数public MainWindow()中，初始化窗口InitializeComponent();之后，将窗口的 DataContext 设置为窗口本身的实例：

1. public MainWindow()
2. {
3.     InitializeComponent();
4.     this.DataContext = this;
5. }

复制代码

在上面的例子中，UserName 是 MainWindow 的一个属性。通过将 DataContext 设置为 this（即 MainWindow 的当前实例），告诉了数据绑定引擎应该在当前的 MainWindow 实例中查找 UserName 属性。
这样，在 XAML 中使用 {Binding UserName} 的时候，它能正确地找到 MainWindow 的 UserName 属性，并将其与 UI 元素关联起来。
自动更新界面

接下来的后端代码中，即使对于变量UserName做出了修改，前台的界面也不会实时的发生变化。

为了使 WPF 的数据绑定能够响应属性值的变化，并自动更新界面，需要实现 INotifyPropertyChanged 接口。这个接口用于通知数据绑定引擎某个属性的值已经改变，从而引擎可以更新绑定到该属性的 UI 元素。

以下详细说明：
实现INotifyPropertyChanged接口

在这个类（上面的例子中是``MainWindow）中实现 INotifyPropertyChanged接口，需要声明一个PropertyChanged` 事件：

1. public partial class MainWindow : Window, INotifyPropertyChanged
2. {
3.     public event PropertyChangedEventHandler PropertyChanged;
4. }

复制代码

定义 RaisePropertyChanged 函数：

1. private void RaisePropertyChanged(string propertyChanged)
2. {
3.     PropertyChangedEventHandler handler = this.PropertyChanged;
4.     if (handler != null)
5.         handler(this, new PropertyChangedEventArgs(propertyChanged));
6. }

复制代码

• 这个函数用于触发 PropertyChanged 事件。
  
• 当某个属性的值被改变时，我们只需要调用这个方法，传递属性的名字作为参数，这样界面就会发生更新。
  

修改属性以触发 PropertyChanged 事件

1. private string _UserName = "333";
2. public string UserName
3. {
4.     get { return _UserName; }
5.     set
6.     {
7.         if (_UserName != value)
8.         {
9.             _UserName = value;
10.             RaisePropertyChanged(nameof(UserName));
11.         }
12.     }
13. }

复制代码

• 对于需要绑定的每个属性，我们就不再使用原本自动实现的属性（原本的是自动生成的，只需要写{ get; set; }就行。
  
• 而是，首先需要给每个属性创建一个私有字段（在这个案例中就叫 _UserName）。
  
• 在属性的 set 访问器中，我们设置字段的值，并且调用 RaisePropertyChanged 方法，可以达到一旦变量改变，就更新界面的效果。
  

可以输入propfull然后按 Tab 键两次，一键生成以下代码模板：

1. private int myVar;
3. public int MyProperty
4. {
5.     get { return myVar; }
6.     set { myVar = value; }
7. }

复制代码

然后可以根据需要修改类型（int）、字段名（myVar）和属性名（MyProperty）。对于上面的 INotifyPropertyChanged 的情况，还需要在 set 访问器中添加属性值变化通知的代码。

总结

绑定

例如绑定文本框的文字内容到UserName：

1. [/code]在后端中写入：
2. [code]public string UserName { get; set; }

复制代码

可以输入prop使用代码模板。
初值

直接赋值

1. public string UserName { get; set; }

复制代码

但是注意将窗口的 DataContext 设置为窗口本身的实例

1. public MainWindow()
2. {
3.     InitializeComponent();
4.     this.DataContext = this;
5. }

复制代码

实时更新

声明 PropertyChanged 事件：

1. public partial class MainWindow : Window, INotifyPropertyChanged
2. {
3.     public event PropertyChangedEventHandler PropertyChanged;
4. }

复制代码

定义 RaisePropertyChanged 函数：

1. private void RaisePropertyChanged(string propertyChanged)
2. {
3.     PropertyChangedEventHandler handler = this.PropertyChanged;
4.     if (handler != null)
5.         handler(this, new PropertyChangedEventArgs(propertyChanged));
6. }

复制代码

修改属性触发更新事件

1. private string _UserName = "333";
2. public string UserName
3. {
4.     get { return _UserName; }
5.     set
6.     {
7.         if (_UserName != value)
8.         {
9.             _UserName = value;
10.             RaisePropertyChanged(nameof(UserName));
11.         }
12.     }
13. }

复制代码

可以输入propfull使用代码模板。

来源:https://www.cnblogs.com/Vanilla-chan/p/17986203/Binding-and-Live-Update
免责声明：由于采集信息均来自互联网，如果侵犯了您的权益，请联系我们【E-Mail:cb@itdo.tech】 我们会及时删除侵权内容，谢谢合作！