Downloads added

I’ve added a couple of demo- projects that i used in my presentation to the download section of the blog. Please first rename the files to .rar and then extract them to a folder of choice.

DataBinding in WPF (Part 2)

During the session that I gave last Saturday a lot of people where suprised that there was more to WPF than just fancy graphics. While explaining the power of databinding I noticed people getting enthusiastic about the possibilities. So I will be posting a couple of Blog posts about Databinding in WPF.

Part 2 : Binding elements to the exposed data

Now that we have our data exposed we can bind it to elements through databinding. Before I show this I thought it would be wise to introduce the concept of WPF databinding.
In WPF you can bind to different types of data. Binding means that the value of a certain property is determined by the value in a given datasource. In the simplest example, this datasource could be a Textbox with the name ‘myTextBox’ and the path to the value could be the Text property.
To tell XAML that you are declaring a binding you must use accolades to tell XAML, ‘watch it, there’s syntax coming up’.
Binding to the Textbox example above is done like this

<TextBlock Text=”{Binding ElementName=myTextBox, Path=Text}”/>

In this case I bind to another element by specifically typing ElementName. Note that you don’t use any quotes inside the accolade part. I could also bind to a relative source, which means I can bind to the first textbox above the current element. This is via a RelativeSource but is out of the scope of this blog entry. We will focus on binding to the data we have exposed in the first part.

To bind to our datacontext we simply make a binding to the complete object. We can do this very easy with an empty Binding syntax

This basically tells the property : Get your data from the first DataContext you encounter. By not specifying a path you tell the binding it should bind to the complete object, in this case, the referenced CollectionView.
Very important here is the IsSynchronizedWithCurrentItem property on the Listbox. This updates the DataContext to move to the selected item in the listbox. All the bound elements will then reflect that change. If we turn this off, nothing happens when selecting a different item.

In the ItemTemplate of the listbox I tell the listbox how to show the items in the list. If I wouldn’t specify any ItemTemplate the listbox would return a simple .ToString() on my CollectionView collection. That’s not what we want so we specify a DataTemplate in which we tell the listbox how the items in the CollectionView should be presented.

In the XAML above I use empty bindings with a specific path. The empty binding tells the binding to bind with the first DataContext it encounters. The path specifies which property it should bind to.

Summary
Now we have our data available and some elements bound to it. In this example we are only binding data from the source (XmlDataProvider) to the target (ListBox). No updates are generated. This is called one-way Binding. Next up is a short overview of the different types of DataBinding available.

DataBinding in WPF (Part 1)

During the session that I gave last Saturday a lot of people where suprised that there was more to WPF than just fancy graphics. While explaining the power of databinding I noticed people getting enthusiastic about the possibilities. So I will be posting a couple of Blog posts about Databinding in WPF.

Part 1 : Exposing my data to my application

In WPF there are numerous ways of exposing data to your application. In the example I will be giving I will focus on XML because it’s made so incredibly easy in WPF and Visual Studio 2008. WPF introduces the XmlDataProvider, a class which can be attached to any XML file. (or in this case, a RSS file). XmlDataProvider can be declared in XAML

Notice the level where I declare the XmlDataProvider. I chose the Window because I know my data will be used by a couple of different sources inside this window. XmlDataProvider supports the XPath attribute where I can use any XPath query I want to direct to the data I want to show. In this case, all news items in the channel.
For now, don’t mind the IsAsynchronous and IsInitialLoadEnabled, they are simply there to make the data load on startup but not hold up the visual thread whenever the data can’t be reached.

I have to declare a NameSpaceMapping for the ‘media:’ extension in my RSS file. Just like you have to do when using the x: prefix in your XAML file. I do this by declaring a NameSpaceMappingCollection in the XmlNameSpaceManager property of the XmlDataProvider.

In order to control the visual output of my data I create a CollectionViewSource in which I can Filter, Sort and Group. I can do this by simply referring to the XmlDataProvider in the Source property.

Finally, in order to expose this data to elements in my window I have to add a reference to this CollectionView to the DataContext property of one of the desired elements. We’ll choose for the overlaying Grid element. This means that every element within this grid can access and manipulate the expose data.

Summary
Now I have the data available through a CollectionView attached to the DataContext of our main grid. Next up is binding this collection to a target. In my example, a Listbox a Hyperlink and a TextBlock.