WPF Binding: What does {Binding} mean?

With this first article, I would like to start the post translation cycle from a wonderful blog , in which Beatriz Costa explains in detail certain aspects of Binding in WPF. The first post covers the topic of using Binding without specifying any additional properties.

Basically, Binding, which you see in various examples, have certain values ​​for the Source and Path properties. The Source property determines the object to which the Binding is sent, and the Path property determines the property of the object whose value you need. I saw some people who were confused by their first meeting with an empty Binding - "{Binding}". At first glance, it seems that we did not give the Binding the necessary information to do at least something useful. But it is not so and I will explain why. If you read my previous posts, then you should understand that it is not necessary to set the Source property of a Binding, as there is a DataContext declared somewhere above the object tree. So, when you want to point to the entire object, and not just one of its properties, you must omit the Path property.

The first approach is when the source is a string and you just want to point to the entire string (and, for example, not to its Length property).

< Window.Resources > < system:String x:Key =” helloString ” > Hello </ system:String > </ Window.Resources > < Border DataContext =”{ StaticResource helloString }” > < TextBlock TextContent =”{ Binding }” /> </ Border > * This source code was highlighted with Source Code Highlighter .

1. < Window.Resources > < system:String x:Key =” helloString ” > Hello </ system:String > </ Window.Resources > < Border DataContext =”{ StaticResource helloString }” > < TextBlock TextContent =”{ Binding }” /> </ Border > * This source code was highlighted with Source Code Highlighter .
2. < Window.Resources > < system:String x:Key =” helloString ” > Hello </ system:String > </ Window.Resources > < Border DataContext =”{ StaticResource helloString }” > < TextBlock TextContent =”{ Binding }” /> </ Border > * This source code was highlighted with Source Code Highlighter .
3. < Window.Resources > < system:String x:Key =” helloString ” > Hello </ system:String > </ Window.Resources > < Border DataContext =”{ StaticResource helloString }” > < TextBlock TextContent =”{ Binding }” /> </ Border > * This source code was highlighted with Source Code Highlighter .
5. < Window.Resources > < system:String x:Key =” helloString ” > Hello </ system:String > </ Window.Resources > < Border DataContext =”{ StaticResource helloString }” > < TextBlock TextContent =”{ Binding }” /> </ Border > * This source code was highlighted with Source Code Highlighter .
6. < Window.Resources > < system:String x:Key =” helloString ” > Hello </ system:String > </ Window.Resources > < Border DataContext =”{ StaticResource helloString }” > < TextBlock TextContent =”{ Binding }” /> </ Border > * This source code was highlighted with Source Code Highlighter .
7. < Window.Resources > < system:String x:Key =” helloString ” > Hello </ system:String > </ Window.Resources > < Border DataContext =”{ StaticResource helloString }” > < TextBlock TextContent =”{ Binding }” /> </ Border > * This source code was highlighted with Source Code Highlighter .

< Window.Resources > < system:String x:Key =” helloString ” > Hello </ system:String > </ Window.Resources > < Border DataContext =”{ StaticResource helloString }” > < TextBlock TextContent =”{ Binding }” /> </ Border > * This source code was highlighted with Source Code Highlighter .

Another standard approach is when you want to associate an element with an object that has several properties.

1. < Window.Resources >
2. < local: GreekGod Name = ” Zeus ” Description = ” Supreme God of the Olympians ” RomanName = ” Jupiter ” x: Key = ” zeus ” />
3. </ Window.Resources >
5. < Border DataContext = ”{ StaticResource zeus }” >
6. < ContentControl Content = ”{ Binding }” />
7. </ Border >

* This source code was highlighted with Source Code Highlighter .

In this situation, ContentControl does not know how to display the data of the GreekGod class. Therefore, you will only see the result of calling the ToString () method, which is usually a bit wrong. Instead, you can use DataTemplate, which allows you to define the presentation of your data.

1. < Window.Resources >
2. < local: GreekGod Name = ” Zeus ” Description = ” Supreme God of the Olympians ” RomanName = ” Jupiter ” x: Key = ” zeus ” />
3. < DataTemplate x: Key = ” contentTemplate ” >
4. < DockPanel >
5. < TextBlock Foreground = ” RoyalBlue ” TextContent = ”{ Binding Path = Name }” />
6. < TextBlock TextContent = ” : ” Margin = ” 0 , 0 , 5 , 0 ″ />
7. < TextBlock Foreground = ” Silver ” TextContent = ”{ Binding Path = Description }” />
8. </ DockPanel >
9. </ DataTemplate >
10. </ Window.Resources >
12. < Border DataContext = ”{ StaticResource zeus }” >
13. < ContentControl Content = ”{ Binding }” ContentTemplate = ”{ StaticResource contentTemplate }” />
14. </ Border >

* This source code was highlighted with Source Code Highlighter .

Notice that the Binding inside the DataTemplat does not define the Source property. This is because the DataContext is automatically set as Source.


Here you can find a project for Visual Studio with the code that was used in the article.
')
From the translator :
The author of the original article is a woman, so the text of the translation was written from a woman’s face.
I would also like to know how interesting the Binding theme is to habroops, and whether to continue this series of translations.
The idea of ​​translation is inspired by the post WPF Series: Intro aka Introduction .