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.

Windows Forms vs. WPF

To be honest; I’m getting a bit sick of this seemingly endless discussion. But i wanted to write about it anyway.

For me personally, WPF equals creativity and innovation.  Let me try and illustrate this for you. Imagine a beautiful, colorful painting that took the artist a long time to make but will draw large crowds. You might claim that, regardless of the time that was put into it, it’s still just a painting right? What are the benefits of this detailed, colorful painting? Why didn’t the painter make a more simple sketch; He would be done a lot quicker and the message would be the same right?

Wrong

Remember the Halo effect researched by Thorndike in the early 20′s? He wrote about two woman having the same intelligence but one more beautiful than the other. The Halo Effect describes the fact that other people think the ugly person is less smart than the beautiful woman. My opinion is that the same goes for software: If the functionality of the software is the same but Application A looks a lot more pretty, intuitive and clean than Application B, A sells. B doesn’t. WPF can do just that.
Just look at the gaming industry; It’s all about the graphics, less about the gameplay. Or common advertising; it’s all about beautiful woman with tiny cloth covering up certain body parts, less about the product.

By the way, all that emphasis on the UI possibilities of WPF is blown out of proportion. If you dig deeper in the technical aspects of WPF you discover that it not only gives you the power to ‘paint’ and innovate, it’s also a data powerhouse. Let’s take for example the databinding possibilities. The power to bind properties of elements to data that is constantly changing, reflecting changes not only in flat text, but with images, colors, animations, etc. etc. All thanks to the combination of Dependency Objects and their Dependency Properties, ValueConverters and DataTriggers. Isn’t that wonderful?

WPF is like creating a giant switchboard and configure it to behave in the way you want. Putting data into it and watch it work. You just feel in control. If you have worked with WPF, you will know what i mean.

So why do some Windows Forms lovers still hate WPF? I mean, WPF has a WindowsFormHost for all of your valuable assets, it even has a DataGrid to look at data in the conservative way. There is one point I agree about when people ‘defend’ Windows Forms. It’s really good at RAD (Rapid Application Development) in contrary to WPF. But hey, in comes that beautiful paining again!

So let’s get it out: WPF is here to stay and take over the world! What do you think?

Passed my 70-502 WPF exam!!

Happy to tell I passed the 70-502 exam this morning. 968 Points! Woohoo. Thanks goes out to Chris Anderson and Adam Nathan for their books. The exam covered quite a lot of areas though i find it was focused the most on Databinding. (Normal Binding, ElementBinding and RelativeBinding) and the hierachy of Dependency properties. Could’ve been my questions though. Now time to eat cake!

DataTriggers

DataTriggers are very userful when you want your application to react to changes in plain .NET classes. With DataTriggers you can react to ANY .NET property in your application. The example below illustrates a solution to a challenge that arose during a small project of mine.

The challenge arose when I was looking for a way to change the source of an image element when the property of my Order class changed. What we´ll do is change the status of an order and tell the image to change it´s source in order to reflect that change.

In order to so, we first need to implement the INotifyPropertyChanged interface for the Order class to make it respond to a change in its properties. This interface implements just one event called PropertyChanged. You need to trigger this event in each set of your properties if you want the magic to happen.

Now, when this property changes, all datacontext that is connected to the class will be notified the property has changed and will update its data.This is an easy but crucial step, next it was time to make the image change when the status changed from ordered to shipped.

WPF introduced styles and templates. Each Style or template can contain triggers. These triggers listen to certain events (Normal Triggers) or in this case, changes in data. (DataTrigger) and will fire whenever the binding equals a given value.
The problem was that, because most of the Dependency properties in WPF have their default conversion, i wasn’t sure how to change the source property on an Image. Simply changing the text threw an error because it couldn’t convert a string to an ImageSource.

Digging a bit deeper i found that the Source property actually contained a BitmapImage.

I first declare the binding of the trigger. In this case, the status property of the orders attached to a listbox. Next, i specify the value for the trigger to fire. Finally I set the property Source to an instance of the BitmapImage and tada! Magic happens.
Please note that by listing more triggers underneath each other i create an OR statement. If I wanted to make the change depend on more than one value, ie, create an AND statement. I could use the MultiDataTrigger and define the different values within the MultiDataTrigger.Conditions collection.

So, there we have it. Changes are passed to the elements that have a reference to the data thanks to the INotifyPropertyChanged and i’ve implemented a trigger that listens to those changes in order to decide which picture to show. Easy isn’t it?

DataGrid released

Microsoft just released the WPF toolkit that includes the WPF datagrid. There’s not a lot of intellisense available in the Datagrid yet, but there is a brief tutorial that can be found here. I will be looking into the datagrid later this month.

Hello everybody!

This will be the place where i will be posting stuff about WPF. Perhaps some C# or MCT related news, but WPF mostly Hope to read some feedback from everybody out there reading this!