Introduction to WPF Data Binding

• Download SimpleDataBinding - 25.71 KB

Introduction

Anybody who have heard of WPF should now be wondering what is this Data binding

Yes, I was also feeling a bit difficult to understand what is Data binding, but things are becoming clearer to me as I go through many samples.

This post will give you an introduction to Data binding and you will really find how easy is to use Data binding than the normal way of doing things

Background

What is Data binding ?

From MSDN,

Data binding is the process that establishes connection between the application UI and business logic

Ok, I think few may be confused here. Let me explain with a simple example.

We have a TextBox and Label. Whenever the text in the TextBox changes, the Label gets updated. So think the TextBox as the application UI and the value getting updated as the business logic - here we update the Label to have the updated value.

Sounds similar to having an event handler for TextBox, for whenever text being updated, updating the Label�s content to hold that TextBox�s value in the event handler ? Yes, its exactly the same but now we are going to do this with Data binding.

What else do I need to know about Data binding ?

There are few things to get familiar with before going to the demonstration of data binding.

• To establish a binding we use the Binding object
• Binding has these four components,
  • a binding Target component
  • a Target Property
  • a binding Source component
  • a Path to the value in the binding source

And,

Binding Flow

As seen in the above diagram,

• One way binding causes the target property to get updated automatically when source property gets updated
• Two way binding causes both (source<->target)
• One way to source causes the source property to get updated automatically when target property gets updated

Having gone through a bit about (yes, its just a bit ) data binding, lets jump into an example.

Using the code

Here is what we want to do,

We have a TextBox and Label. Whenever the text in the TextBox changes, the Label gets updated

Normal (Usual) Approach

XAML code below,

<TextBox Name=�TextUnBound� TextChanged=�NotBoundTextChanged� />
<TextBlock Name=�TxtBlockUnBound� />

And we would have our event handler in the back-end code (C#) do our job,

public void NotBoundTextChanged(Object obj, EventArgs eventargs)
{ TxtBlockBound.Text = TextUnBound.Text; }

The above mentioned approach is to have an event handler and do our stuff inside that event handler

WPF Approach

XAML code below,

<TextBox Name=�TextBound� >Data Bound</TextBox>
   <TextBlock Name=�TxtBlockBound� >
       <TextBlock.Text>
           <Binding ElementName=�TextBound� Path=�Text� />
       </TextBlock.Text>
</TextBlock>

And the above does our job

Pretty simple isn�t it ? We haven�t even used any back-end code

So what was the Magic done here ? As told earlier, we have specified a Binding object for our TextBlock�s Text Property (which is our binding target property) to be bound to the the Element TextBox and Path Text (which is our binding source property). And remember, its One Way, so whenever our source gets updated, automatically the target gets updated.

History

Jan 10th, 2008 - Added the article