深入理解 WPF 数据绑定机制

拉不拉稀肚拉稀  金牌会员 | 2024-10-31 20:04:19 | 显示全部楼层 | 阅读模式
打印 上一主题 下一主题
楼主

主题 853|帖子 853|积分 2561

一、引言

在当代软件开发中，创建具有精良用户体验的图形用户界面（GUI）至关紧张。WPF 作为一种先进的 GUI 技术，提供了强大的数据绑定机制，使得开发人员能够轻松地将数据与用户界面元素举行关联，实现数据的自动更新和显示。理解 WPF 数据绑定机制对于高效开发高质量的 WPF 应用步伐具有紧张意义。
二、WPF 数据绑定概述

（一）什么是 WPF 数据绑定

WPF 数据绑定是一种将数据源与用户界面元素举行关联的技术。通过数据绑定，当数据源中的数据发生变革时，与之绑定的用户界面元素会自动更新显示；反之，当用户在用户界面上举行操作时，数据源中的数据也会相应地举行更新。这种双向的数据交互方式极大地提高了开发服从，淘汰了手动更新数据的繁琐代码。
（二）数据绑定的优势


  • 提高开发服从：开发人员无需手动编写大量的代码来更新用户界面或同步数据源，数据绑定机制会自动处理这些使命。
  • 分离关注点：将数据逻辑与用户界面分离，使得代码更加清楚、易于维护。开发人员可以专注于数据的处理和业务逻辑，而不必关心用户界面的具体实现细节。
  • 增强用户体验：数据的自动更新和同步使得用户界面更加相应实时，提高了用户体验。
三、WPF 数据绑定的工作原理

（一）绑定源和绑定目标

在 WPF 数据绑定中，存在绑定源和绑定目标两个概念。绑定源是提供数据的对象，可以是任何实现了特定接口（如 INotifyPropertyChanged）的对象。绑定目标是用户界面元素，如文本框、列表框等，用于显示绑定源中的数据。
（二）绑定路径

绑定路径是用于指定从绑定源到要绑定的数据的路径。例如，如果绑定源是一个包罗多个属性的对象，绑定路径可以指定具体要绑定的属性名称。通过设置精确的绑定路径，WPF 可以准确地找到要绑定的数据。
（三）绑定引擎

WPF 中的绑定引擎负责监控绑定源和绑定目标的变革，并在需要时举行数据的同步。当绑定源中的数据发生变革时，绑定引擎会自动更新绑定目标；当绑定目标中的数据被用户修改时，绑定引擎会将修改后的数据更新到绑定源中。
四、绑定模式

（一）单向绑定


  • 概念和特点

    • 单向绑定是指数据从绑定源流向绑定目标，即当绑定源中的数据发生变革时，绑定目标会自动更新显示，但用户在绑定目标上的操作不会影响绑定源。
    • 这种绑定模式适用于只需要显示数据而不需要用户修改数据的场景，例如显示静态信息或只读数据。

  • 示例代码

    • 以下是一个使用单向绑定的示例代码：

  1. <Window x:Class="WpfApp.MainWindow"
  2.         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  3.         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  4.         Title="WPF Data Binding Example">
  5.     <StackPanel>
  6.         <TextBlock Text="{Binding Path=Message, Mode=OneWay}"/>
  7.     </StackPanel>
  8. </Window>
复制代码
  1. using System;
  2. using System.Windows;
  4. namespace WpfApp
  5. {
  6.     public partial class MainWindow : Window
  7.     {
  8.         public MainWindow()
  9.         {
  10.             InitializeComponent();
  11.             DataContext = new ViewModel();
  12.         }
  13.     }
  15.     public class ViewModel
  16.     {
  17.         public string Message { get; set; } = "Hello, WPF Data Binding!";
  18.     }
  19. }
复制代码
（二）双向绑定


  • 概念和特点

    • 双向绑定是指数据可以在绑定源和绑定目标之间双向活动。当绑定源中的数据发生变革时，绑定目标会自动更新显示；同时，当用户在绑定目标上举行操作时，绑定源中的数据也会相应地举行更新。
    • 这种绑定模式适用于需要用户输入数据并将其保存到数据源的场景，例如表单输入、数据编辑等。

  • 示例代码

    • 以下是一个使用双向绑定的示例代码：

  1. <Window x:Class="WpfApp.MainWindow"
  2.         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  3.         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  4.         Title="WPF Data Binding Example">
  5.     <StackPanel>
  6.         <TextBox Text="{Binding Path=UserName, Mode=TwoWay}"/>
  7.     </StackPanel>
  8. </Window>
复制代码
  1. using System;
  2. using System.Windows;
  4. namespace WpfApp
  5. {
  6.     public partial class MainWindow : Window
  7.     {
  8.         public MainWindow()
  9.         {
  10.             InitializeComponent();
  11.             DataContext = new ViewModel();
  12.         }
  13.     }
  15.     public class ViewModel
  16.     {
  17.         private string _userName;
  19.         public string UserName
  20.         {
  21.             get { return _userName; }
  22.             set
  23.             {
  24.                 _userName = value;
  25.                 OnPropertyChanged(nameof(UserName));
  26.             }
  27.         }
  29.         public event PropertyChangedEventHandler PropertyChanged;
  31.         protected virtual void OnPropertyChanged(string propertyName)
  32.         {
  33.             PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
  34.         }
  35.     }
  36. }
复制代码
（三）OneTime 绑定


  • 概念和特点

    • OneTime 绑定是指在绑定建立时，将绑定源中的数据复制到绑定目标一次，之后不再举行自动更新。即使绑定源中的数据发生变革，绑定目标也不会更新。
    • 这种绑定模式适用于显示静态数据或只在特定时候需要显示的数据，例如初始化时显示的设置信息等。

  • 示例代码

    • 以下是一个使用 OneTime 绑定的示例代码：

  1. <Window x:Class="WpfApp.MainWindow"
  2.         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  3.         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  4.         Title="WPF Data Binding Example">
  5.     <StackPanel>
  6.         <TextBlock Text="{Binding Path=AppVersion, Mode=OneTime}"/>
  7.     </StackPanel>
  8. </Window>
复制代码
  1. using System;
  2. using System.Windows;
  4. namespace WpfApp
  5. {
  6.     public partial class MainWindow : Window
  7.     {
  8.         public MainWindow()
  9.         {
  10.             InitializeComponent();
  11.             DataContext = new ViewModel();
  12.         }
  13.     }
  15.     public class ViewModel
  16.     {
  17.         public string AppVersion { get; set; } = "1.0.0";
  18.     }
  19. }
复制代码
五、数据验证

（一）验证规则的界说


  • IDataErrorInfo 接口

    • WPF 提供了 IDataErrorInfo 接口用于实现数据验证。实现该接口的类需要提供两个属性：Error 和 this [string columnName]。Error 属性用于返回整个对象的错误信息，而 this [string columnName] 属性用于返回特定属性的错误信息。
    • 当数据绑定引擎检测到数据发生变革时，会调用 this [string columnName] 属性来检查该属性是否存在错误。如果存在错误，绑定引擎会将错误信息显示在用户界面上，通常以红色边框或错误提示的情势呈现。

  • INotifyDataErrorInfo 接口

    • INotifyDataErrorInfo 接口是 WPF 4.5 引入的用于数据验证的接口。与 IDataErrorInfo 接口相比，它提供了更强大的功能，支持异步验证和多个错误信息的显示。
    • 实现该接口的类需要提供 HasErrors 属性、GetErrors 方法和 ErrorsChanged 事件。HasErrors 属性用于指示对象是否存在错误，GetErrors 方法用于返回特定属性的错误信息列表，ErrorsChanged 事件用于通知绑定引擎数据验证状态发生了变革。

（二）在数据绑定中应用验证规则


  • 绑定到实现了验证接口的对象

    • 在数据绑定中，可以将用户界面元素绑定到实现了 IDataErrorInfo 或 INotifyDataErrorInfo 接口的对象。当用户在用户界面上举行操作时，绑定引擎会自动调用验证接口的方法来检查数据的有效性。
    • 例如，以下代码将一个文本框绑定到一个实现了 IDataErrorInfo 接口的对象：

  1. <Window x:Class="WpfApp.MainWindow"
  2.         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  3.         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  4.         Title="WPF Data Binding Example">
  5.     <StackPanel>
  6.         <TextBox Text="{Binding Path=Age, Mode=TwoWay, ValidatesOnDataErrors=True}"/>
  7.     </StackPanel>
  8. </Window>
复制代码
  1. using System;
  2. using System.Windows;
  4. namespace WpfApp
  5. {
  6.     public partial class MainWindow : Window
  7.     {
  8.         public MainWindow()
  9.         {
  10.             InitializeComponent();
  11.             DataContext = new Person();
  12.         }
  13.     }
  15.     public class Person : IDataErrorInfo
  16.     {
  17.         private int _age;
  19.         public int Age
  20.         {
  21.             get { return _age; }
  22.             set
  23.             {
  24.                 _age = value;
  25.             }
  26.         }
  28.         public string Error
  29.         {
  30.             get { return null; }
  31.         }
  33.         public string this[string columnName]
  34.         {
  35.             get
  36.             {
  37.                 string error = null;
  38.                 if (columnName == "Age")
  39.                 {
  40.                     if (Age < 0 || Age > 120)
  41.                     {
  42.                         error = "Age must be between 0 and 120.";
  43.                     }
  44.                 }
  45.                 return error;
  46.             }
  47.         }
  48.     }
  49. }
复制代码

  • 使用 ValidationRules 属性

    • 除了使用验证接口，还可以通过设置用户界面元素的 ValidationRules 属性来添加自界说的验证规则。ValidationRules 属性是一个 ValidationRule 对象的集合，可以包罗多个验证规则。
    • 例如，以下代码使用 ValidationRules 属性添加了一个自界说的验证规则，用于检查输入的字符串是否为数字：

  1. <Window x:Class="WpfApp.MainWindow"
  2.         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  3.         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  4.         Title="WPF Data Binding Example">
  5.     <StackPanel>
  6.         <TextBox>
  7.             <TextBox.Text>
  8.                 <Binding Path=InputValue, Mode=TwoWay>
  9.                     <Binding.ValidationRules>
  10.                         <local:NumberValidationRule/>
  11.                     </Binding.ValidationRules>
  12.                 </Binding>
  13.             </TextBox.Text>
  14.         </TextBox>
  15.     </StackPanel>
  16. </Window>
复制代码
  1. using System;
  2. using System.Globalization;
  3. using System.Windows.Controls;
  5. namespace WpfApp
  6. {
  7.     public class NumberValidationRule : ValidationRule
  8.     {
  9.         public override ValidationResult Validate(object value, CultureInfo cultureInfo)
  10.         {
  11.             if (value is string input)
  12.             {
  13.                 int number;
  14.                 if (int.TryParse(input, out number))
  15.                 {
  16.                     return ValidationResult.ValidResult;
  17.                 }
  18.                 else
  19.                 {
  20.                     return new ValidationResult(false, "Please enter a valid number.");
  21.                 }
  22.             }
  23.             else
  24.             {
  25.                 return new ValidationResult(false, "Invalid input.");
  26.             }
  27.         }
  28.     }
  29. }
复制代码
六、高级数据绑定用法

（一）绑定到集合数据


  • 绑定到 ObservableCollection

    • ObservableCollection 是一个实现了 INotifyCollectionChanged 接口的集合类。当集合中的数据发生变革时，该接口会触发事件通知绑定引擎，从而实现自动更新绑定目标。
    • 例如，以下代码将一个列表框绑定到一个 ObservableCollection 对象：

  1. <Window x:Class="WpfApp.MainWindow"
  2.         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  3.         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  4.         Title="WPF Data Binding Example">
  5.     <StackPanel>
  6.         <ListBox ItemsSource="{Binding Path=People, Mode=OneWay}"/>
  7.     </StackPanel>
  8. </Window>
复制代码
  1. using System;
  2. using System.Collections.ObjectModel;
  3. using System.Windows;
  5. namespace WpfApp
  6. {
  7.     public partial class MainWindow : Window
  8.     {
  9.         public MainWindow()
  10.         {
  11.             InitializeComponent();
  12.             DataContext = new ViewModel();
  13.         }
  14.     }
  16.     public class ViewModel
  17.     {
  18.         public ObservableCollection<Person> People { get; set; } = new ObservableCollection<Person>();
  20.         public ViewModel()
  21.         {
  22.             People.Add(new Person { Name = "Alice", Age = 30 });
  23.             People.Add(new Person { Name = "Bob", Age = 35 });
  24.         }
  25.     }
  27.     public class Person
  28.     {
  29.         public string Name { get; set; }
  30.         public int Age { get; set; }
  31.     }
  32. }
复制代码

  • 数据模板和项模板

    • 当绑定到集合数据时，可以使用数据模板和项模板来定制每个数据项的显示方式。数据模板用于界说如何显示单个数据项，而项模板用于界说整个集合的结构。
    • 例如，以下代码使用数据模板和项模板来显示一个人员列表：

  1. <Window x:Class="WpfApp.MainWindow"
  2.         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  3.         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  4.         Title="WPF Data Binding Example">
  5.     <StackPanel>
  6.         <ListBox ItemsSource="{Binding Path=People, Mode=OneWay}">
  7.             <ListBox.ItemTemplate>
  8.                 <DataTemplate>
  9.                     <StackPanel>
  10.                         <TextBlock Text="{Binding Path=Name}"/>
  11.                         <TextBlock Text="{Binding Path=Age}"/>
  12.                     </StackPanel>
  13.                 </DataTemplate>
  14.             </ListBox.ItemTemplate>
  15.         </ListBox>
  16.     </StackPanel>
  17. </Window>
复制代码
  1. using System;
  2. using System.Collections.ObjectModel;
  3. using System.Windows;
  5. namespace WpfApp
  6. {
  7.     public partial class MainWindow : Window
  8.     {
  9.         public MainWindow()
  10.         {
  11.             InitializeComponent();
  12.             DataContext = new ViewModel();
  13.         }
  14.     }
  16.     public class ViewModel
  17.     {
  18.         public ObservableCollection<Person> People { get; set; } = new ObservableCollection<Person>();
  20.         public ViewModel()
  21.         {
  22.             People.Add(new Person { Name = "Alice", Age = 30 });
  23.             People.Add(new Person { Name = "Bob", Age = 35 });
  24.         }
  25.     }
  27.     public class Person
  28.     {
  29.         public string Name { get; set; }
  30.         public int Age { get; set; }
  31.     }
  32. }
复制代码
（二）绑定到 XML 数据


  • 使用 XmlDataProvider

    • XmlDataProvider 是 WPF 中的一个数据源提供步伐，可以用于绑定到 XML 数据。通过设置 XmlDataProvider 的 Source 属性，可以指定要绑定的 XML 文件或 XML 字符串。
    • 例如，以下代码将一个树形视图绑定到一个 XML 文件：

  1. <Window x:Class="WpfApp.MainWindow"
  2.         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  3.         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  4.         Title="WPF Data Binding Example">
  5.     <StackPanel>
  6.         <TreeView ItemsSource="{Binding Source={StaticResource xmlData}, XPath=/Root/Node}">
  7.             <TreeView.Resources>
  8.                 <XmlDataProvider x:Key="xmlData" Source="data.xml"/>
  9.             </TreeView.Resources>
  10.         </TreeView>
  11.     </StackPanel>
  12. </Window>
复制代码

  • XPath 表达式

    • 在绑定到 XML 数据时，可以使用 XPath 表达式来指定要绑定的数据路径。XPath 是一种用于在 XML 文档中定位特定元素和属性的语言。
    • 例如，在上述代码中，XPath 表达式 “/Root/Node” 用于指定从 XML 文档的根元素 “Root” 下的 “Node” 元素开始绑定数据。

（三）绑定到数据库数据


  • 使用 Entity Framework 或其他数据访问技术

    • 可以使用 Entity Framework 等数据访问技术将 WPF 应用步伐与数据库举行连接，并将数据库中的数据绑定到用户界面元素。
    • 例如，以下代码使用 Entity Framework 绑定到一个数据库表中的数据：

  1. <Window x:Class="WpfApp.MainWindow"
  2.         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  3.         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  4.         Title="WPF Data Binding Example">
  5.     <StackPanel>
  6.         <DataGrid ItemsSource="{Binding Path=Customers, Mode=OneWay}"/>
  7.     </StackPanel>
  8. </Window>
复制代码
  1. using System;
  2. using System.Windows;
  3. using WpfApp.DataAccess;
  5. namespace WpfApp
  6. {
  7.     public partial class MainWindow : Window
  8.     {
  9.         public MainWindow()
  10.         {
  11.             InitializeComponent();
  12.             DataContext = new ViewModel();
  13.         }
  14.     }
  16.     public class ViewModel
  17.     {
  18.         public ObservableCollection<Customer> Customers { get; set; }
  20.         public ViewModel()
  21.         {
  22.             using (var context = new MyDbContext())
  23.             {
  24.                 Customers = new ObservableCollection<Customer>(context.Customers);
  25.             }
  26.         }
  27.     }
  29.     public class Customer
  30.     {
  31.         public int Id { get; set; }
  32.         public string Name { get; set; }
  33.         public string Email { get; set; }
  34.     }
  35. }
复制代码
在这个示例中，Entity Framework（实体框架）被用于从数据库中检索数据并将其绑定到一个 “DataGrid”（数据表格）上。“ViewModel”（视图模型）类通过使用 “MyDbContext”（数据库上下文）查询数据库来初始化一个 “Customer”（客户）对象的 “ObservableCollection”（可观察集合）。
对象关系映射（ORM）与数据绑定：
像 Entity Framework 这样的对象关系映射工具简化了将数据库表映射到对象以及反向映射的过程。这使得将数据库数据绑定到 WPF 用户界面元素变得更加容易。当使用 ORM 时，对绑定对象所做的更改可以自动持久化回数据库，提供了无缝的数据绑定体验。
七、WPF 数据绑定的性能优化

（一）避免不必要的绑定更新


  • 恰当使用绑定模式

    • 根据应用步伐的具体需求选择合适的绑定模式。例如，如果数据是静态的或者很少变革，使用 “OneTime” 绑定模式可以避免不必要的更新。这样，绑定只会在建立时举行一次数据复制，之后即使数据源发生变革，绑定目标也不会更新。

  • 高效实现变更通知

    • 如果在数据对象中实现 “INotifyPropertyChanged” 接口，确保仅在属性值实际发生变革时才触发 “PropertyChanged” 事件。可以通过比较新值和旧值来实现这一点，避免不必要的事件触发和绑定更新。

（二）优化集合绑定


  • 明智地使用 “ObservableCollection”

    • “ObservableCollection” 在绑定集合时很方便，但如果集合频仍变革，它可能会消耗较多资源。如果性能是一个问题，可以考虑使用其他集合范例或者实现自界说的变更通知机制。

  • 对集合控件举行假造化

    • 对于大型集合，考虑使用支持假造化的控件，如 “ListView” 或 “DataGrid”。假造化允许只加载和渲染可见的项目，在处理大型数据集时可以提高性能。

（三）淘汰数据传输大小


  • 选择性绑定

    • 不要绑定整个对象，而是仅绑定必要的属性。这样可以淘汰数据源与用户界面之间传输的数据量。例如，如果一个对象有多个属性，但用户界面只需要显示其中的几个属性，那么只绑定这些特定的属性可以提高性能。

  • 如果可能，压缩数据

    • 如果传输的数据量很大，可以考虑使用压缩技术来减小数据大小。然而，需要权衡压缩和解压缩的处理开销与数据大小的淘汰带来的长处。

八、结论

WPF 的数据绑定机制是一个强大的功能，使开发人员能够轻松创建动态且相应迅速的用户界面。通过理解数据绑定的概念和技术，包括绑定模式、数据验证以及高级用法场景，开发人员可以构建更高效、用户友爱的应用步伐。此外，优化数据绑定性能可以进一步提升 WPF 应用步伐的整体性能。凭借其灵活性和强大功能，WPF 数据绑定是当代应用步伐开发的宝贵工具。

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。
回复

使用道具 举报

0 个回复

倒序浏览
返回列表

快速回复

高级模式
B Color Image Link Quote Code Smilies
您需要登录后才可以回帖 登录 or 立即注册

本版积分规则

拉不拉稀肚拉稀

金牌会员
这个人很懒什么都没写!

楼主热帖

标签云

存储 挺好的 服务器
微信订阅号
微信服务号
微信客服
小程序
H5
关于我们 商务合作 网站地图
©Copyright 2022-2024 杭州祥升科技有限公司 版权所有 浙ICP备20004199号
快速回复 返回顶部 返回列表