C#WPF数据绑定模板化操作四步走

前言:WPF数据绑定对于WPF应用程序来说尤为重要,本文将讲述使用MVVM模式进行数据绑定的四步走用法:

具体实例代码如下:

以下代码仅供参考,如有问题请在评论区留言,谢谢

 1 第一步:声明一个类用来实现接口 INotifyPropertyChanged,并在界面的后台代码中实例化vm对象
2
3 public class NotifyPropertyObject : INotifyPropertyChanged
4 {
5 public event PropertyChangedEventHandler PropertyChanged;
7 public void RaisePropertyChanged(string propertyName)
8 {
9 if (PropertyChanged != null)
10 {
11 PropertyChanged.Invoke(this, new PropertyChangedEventArgs(propertyName));
12 }
13 }
14 }
15
16 private MainWindowVM vm = new MainWindowVM(); //重点
17 public MainWindow()
18 {
19 InitializeComponent();
20 this.DataContext = vm;//重点
21 }
22
23 第二步:为每一个界面建立其模型类,如MainWindowVM,AzimuthWindowVM........,此种类型的类同样需继承自类NotifyPropertyObject
24 注意:(1)此类中主要添加后台的实现代码,其一是使后台代码尽可能简单;其二是便于数据的绑定
25 (2)此类中大多数情况下写的是属性和方法
26 示例:
27
28 public class MainWindowVM : NotifyPropertyObject
29 {
30 private double _dmsL0; //*子午线经度
31 public double dmsL0
32 {
33 get { return _dmsL0; }
34 set
35 {
36 _dmsL0 = value;
37 RaisePropertyChanged("dmsL0");
38 }
39 }
40 }
41
42 public class AzimuthWindowVM : NotifyPropertyObject
43 {
44 private string azName = "A001->B004的坐标方位角";
45 public string AzName
46 {
47 get { return azName; }
48 set
49 {
50 azName = value;
51 RaisePropertyChanged("AzName");
52 }
53 }
54 }
55
56 第三步:如果类中存在与界面相关的量,则让该类继承类NotifyPropertyObject,并在派生类中在属性中的Set代码块中进行绑定
57
58 public class Ellipsoid : NotifyPropertyObject
59 {
60 private double _a; //长半轴
61 public double a
62 {
63 get => _a;
64 set
65 {
66 _a = value;
67 if (_a > 0 && _f > 0)
68 {
69 Init(a, f);
70 }
71
72 RaisePropertyChanged("a");
73 }
74 }
75 }
76
77 第四步:在界面设计代码中进行绑定
78
79 示例:
80 1、<TextBox Grid.Column="2" VerticalAlignment="Center" Text="{Binding CurrentEllipsoid.a}"
81 IsEnabled="{Binding CurrentEllipsoid.IsCustomEllopsoid}"/>
82 2、<ComboBox VerticalAlignment="Center" ItemsSource="{Binding EllipsoidList}"
83 SelectedItem="{Binding CurrentEllipsoid}"/>
84 3、Title="{Binding Title}" 注意:标题也可绑定

经以上四步走,WPF数据绑定工作已经基本完成,实验证明该方法提高了程序的容错能力,以及程序数据结构的健壮性。

上一篇:C# winform 安装程序打包(自定义操作)


下一篇:原生js之四步走搞定Ajax