WPF MVVM入门系列教程(四、数据绑定演示)

在前面的文章中,介绍了数据绑定功能及使用方法。

本文会使用一些数据绑定的实例来进行演示。演示过程中,涉及了数据模板功能,如果对数据模板功能还不熟悉,可以参考下面的链接:

https://learn.microsoft.com/zh-cn/dotnet/desktop/wpf/data/data-templating-overview?view=netframeworkdesktop-4.8

 

在WPF MVVM模式开发时,很多应用场景都是展示数据,而数据绑定对于数据呈现是非常重要的。

 

本文会循序渐进来演示数据绑定功能。最后一个示例会包含数据绑定中的大部分理论。

 

绑定复杂数据类型

在前面的示例中,我们介绍了数据绑定的基础。现在我们将前面在基础进行实践。

这里我们以书籍为模型进行演示。定义如下

复制代码
 1   internal class Book
 2   {
 3       public string Title { get; set; }
 4       public string Author { get; set; }
 5       public string Publish { get; set; }
 6       public string Price { get; set; }
 7       public string Date { get; set; }
 8       public string Descrption { get; set; }
 9       public string CoverImageUrl { get; set; }
10   }
复制代码

 

 

我们需要将它更改为可通知类型,修改后如下:

复制代码
 1 /// <summary>
 2 /// 这里仅作演示,正常只定义Book类型即可
 3 /// </summary>
 4 public class ObservableBook : INotifyPropertyChanged
 5 {
 6     private string title;
 7 
 8     public string Title 
 9     { 
10         get => title; 
11         set
12         {
13             title = value;
14             RaiseChanged();
15         } 
16     }
17 
18     private string author;
19 public string Author 20 { 21 get => author; 22 set 23 { 24 author = value; 25 RaiseChanged(); 26 } 27 } 28 29 ...省略... 30 31 32 public event PropertyChangedEventHandler PropertyChanged; 33 34 35 public void RaiseChanged([CallerMemberName]string memberName = "") 36 { 37 PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(memberName)); 38 } 39 }
复制代码

 

然后我们定义一下界面,布局如下

 

posted @   zhaotianff  阅读(56)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· 【自荐】一款简洁、开源的在线白板工具 Drawnix
· 没有Manus邀请码?试试免邀请码的MGX或者开源的OpenManus吧
· 园子的第一款AI主题卫衣上架——"HELLO! HOW CAN I ASSIST YOU TODAY
· 无需6万激活码!GitHub神秘组织3小时极速复刻Manus,手把手教你使用OpenManus搭建本
历史上的今天:
2022-11-08 WPF MVVM框架:CommunityToolkit.Mvvm包使用介绍
2022-11-08 如何在WPF中使用MVVM实现TreeView的层级显示
点击右上角即可分享
微信分享提示