C# WPF data binding method and data binding after rewriting the data template
Write in front
This article will introduce how WPF implements front-end and back-end data binding and the methods and classes commonly used in data bindingAnd for controls such as DataGrid and ListView, how to perform data binding on controls after rewriting the data template.
This article mainly introduces the basic implementation of data binding. Through this blog post, you will be able to write a C# and WPF project with MVVM design pattern. If you are a senior developer of C# and WPF, this article may not be of much help to you, but if you are a developer who is learning and understanding C# and WPF, this article can help you understand the MVVM design pattern and data binding.
1. Implement front-end and back-end data binding:
When it comes to front-end and back-end data binding, we need to talk about WPF’s MVVM design pattern first. It is improved from the traditional MVC design pattern. The difference is that MVVM Data source updates do not require a Controller to synchronize data to the foreground, and changes in foreground data do not require a controller to synchronize to the background. If you want to learn more about the MVVM design pattern in detail, I think Baidu Encyclopedia’s explanation and explanation of this part is very detailed and systematic. You can also read the examples below. I believe that the code examples will give you a deeper understanding of MVVM.
Example:
Source code address (code cloud): https://gitee.com/hkb1202/csharp-wpf-data-binding-demo
The examples are based on the .Net Core 3.1 platform. They are written and tested by bloggers. I believe you can better understand this part of the content through the examples.
Create a new WPF project and add the Command class and MainWindowsViewModel class
Command.cs code:
1 using System;
2 using span> System.Windows.Input;
3
4 namespace WpfExample
5 {
6 public span> class Command : ICommand
7 {
8
9 ///
10 /// An event that checks whether the command can be executed. It is triggered when a UI event occurs and the control state or data changes.
11 ///
12 public event EventHandler CanExecuteChanged
13 {
14 add
15 {
16 if span> (_canExecute != null)
17 {
18 CommandManager.RequerySuggested += value;
19 }
20 }
21 remove
22 {
23 if span> (_canExecute != null)
24 {
25 CommandManager.RequerySuggested -= value;
26 }
27 }
28 }
29
30 ///
31 /// Method to determine whether the command can be executed
32 ///
33 private Func< object, bool> _canExecute;
34
35 ///
36 /// The method the command needs to be executed
37 ///
38 private Action< object> _execute;
39
40 ///
41 /// Create a command
42 ///
43 /// The method to execute the command
44 public Command( Action<object> execute) : this (execute, null )
45 {
46
47 }
48
49 ///
50 /// Create a command
51 ///
52 /// The method to execute the command
53 /// Method to determine whether the command can be executed
54 public Command( Action<object> execute, Func< object, bool> canExecute)
55 {
56 _execute = execute ;
57 _canExecute = canExecute ;
58 }
59
60 ///
61 /// Determine whether the command can be executed
62 ///
63 /// Parameters passed in by the command
64 /// Can it be executed span>
65 public bool CanExecute(object parameter)
66 {
67 if span> (_canExecute == null) return true;
68 return span> _canExecute(parameter);
69 }
70
71 ///
72 /// Execute command
73 ///
74��, and display the content in the control.
Click the "Modify Text Content Button" in the lower right corner to change the content of the TextBlock control
After modifying Xiao Ming's name, click the delete button. The prompt message shows that Xiao Ming's name has also been changed, indicating that the data source has been changed at the same time.
1. Data source: Data binding is implemented by using ViewModel as the data source and binding to the front-end xaml. By modifying the data source in the background, the content can be directly synchronized to the front-end interface. For details, see the above examples of deleting and adding data and modifying Text. People, SelectItem, and TextInfo are all data sources.
2. Command: In addition to the real-time updating of data, the foreground operations should also be transmitted to the background, and the background logic should respond. At this time we need to use Command (command). In this example, the click event of the button and the enter event of the keyboard are transmitted to the background through commands. However, the usage of commands is far more than these two. It can be used in actual During the development process, we are learning and trying according to different needs. It is worth noting that commands can take parameters. The CommandParameter in the front-end code is its parameter. For example, a button click command can use parameters to determine which button is clicked. Of course, each button can also be bound to an independent Order. DelClick, AddClick, ReviseClick, and PressEnterKey are all commands.
3. Rewriting of the data template: In this example, the data template for the phone column and deletion of a column in the DataGrid control is rewritten. We can see that the phone column is rewritten for TextBox, deletes a column and is rewritten for Button, and the table header Data templates can also be rewritten. You can write almost any control in DataTemplate. If you need to place multiple controls, you can use layout controls such as Grid and StackPanel to encapsulate them. It is worth noting that after rewriting the data template, you need to pay special attention to the writing method of command binding. You need to pay attention to the Path and RelativeSource properties. For details, see the writing method in the example code. If you follow the conventional Binding writing method, you will find that the backend cannot receive it. The command you bound.
4. Two-way binding: As the name implies, binding is two-way. Not only is the background data updated automatically synchronized to the foreground, but the data updates in the foreground will also be automatically synchronized to the background. This two-way binding is also a major feature of the MVVM design pattern. In this example, you can see that after modifying Xiao Ming's name, the modified content is automatically synchronized to the background data source without you performing any operations (it is worth noting What is important here is that the selected cell needs to lose focus before the modified content will be synchronized to the background data source). This is two-way binding. Of course, you can set multiple modes during the binding process. If you do not set it, the default is two-way binding. The setting method is through the Mode attribute (Binding="{Binding Name,Mode=TwoWay}"). You can set Default, OneTime , OneWay, OneWayToSource, TwoWay.
The above are some key points involved in this example. These contents are the basic content of WPF and C# development. I hope they can be of some help to your study and work. If you have any comments on some usage and writing of this article, Corrections and exchanges are welcome. Thanks.
2023.4.17 2:55 pm
微信扫一扫打赏
支付宝扫一扫打赏
