WPF Data Binding

Introduction

WPF provides a simple and powerful way to automatically update data between the business layer and the user interface. This mechanism is called data binding. Every time the data at the business layer changes, it will automatically update the user interface, which is the same in turn. This is the preferred method for WPF to pass to the user interface.

Data Binding can be unidirectional (resource --> target or target --> resource) or bidirectional (resource <--> target ).

The resource attribute to be bound can be a common CLR attribute or a dependency attribute. However, the bound target attribute must be a dependency attribute.

For better binding, both parties must provide a change notification so that the other party can be updated when one party changes. Common CLR attributes can be processed by implementing the propertychanged method of the inotifypropertychanged interface. Dependency properties are processed through the callback of the propertychanged property of the metadata.

The {binding} extension label is usually used for data binding in XAML. The following example shows how to bind a text box to a tag. The data in the tag changes according to the text box input.

 <StackPanel>
<TextBox x:Name="txtInput" />
<Label Content="{Binding Text, ElementName=txtInput, 
                     UpdateSourceTrigger=PropertyChanged}" />
</StackPanel>

Datacontext)

Each WPF control derived from frameworkelement has the datacontext attribute. This attribute allows you to set a visible data object. If you cannot accurately bind a resource to it, you can assign it a datacontext by default.

Datacontext can pass on its value for its child control. Therefore, you can set a datacontext in the upper-layer layout container, so all its child controls inherit its value. This is useful when you want to bind multiple attributes of an I data object.

Code

 <StackPanel DataContext="{StaticResource myCustomer}">
<TextBox Text="{Binding FirstName}"/>
<TextBox Text="{Binding LastName}"/>
<TextBox Text="{Binding Street}"/>
<TextBox Text="{Binding City}"/>
</StackPanel>

Numerical Conversion

If you want to bind two different types of attributes, you have to use numeric conversion. A value converter can convert a value from the source type to the target type and return a successful result. Although WPF already has some numeric conversion operations, you still need to execute the ivalueconverter interface to write your own converter in most cases.

A classic example is to bind a bool value to the visibililty property of the control. However, the visibility attribute is an enumeration type that contains Visble, collapsed, and hidden. Therefore, you need the following converter:

Code

 <StackPanel>
<StackPanel.Resources>
<BooleanToVisibilityConverter x:Key="boolToVis" />
</StackPanel.Resources>

<CheckBox x:Name="chkShowDetails" Content="Show Details" />
<StackPanel x:Name="detailsPanel" 
                Visibility="{Binding IsChecked, ElementName=chkShowDetails, 
                             Converter={StaticResource boolToVis}}">
</StackPanel>
</StackPanel>

The following example shows a simple converter that converts the bool type to visibilty. Tip: This converter is already included in. netframework.

Code

 public class BooleanToVisibilityConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, 
                          CultureInfo culture)
    {
        if (value is Boolean)
        {
            return ((bool)value) ? Visibility.Visible : Visibility.Collapsed;
        }

        return value;
    }

    public object ConvertBack(object value, Type targetType, object parameter, 
                              CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}