Activity Tracker – WPF DataBinding the TabControl with TreeView
Aug 28, 2010 • Michal Franc -
In the first post about Activity Tracker, I have created a simple style for my application. In this post, I want to show DataBinding. With this feature, we can make a flexible connection between Model and View Layer. There is no need for code. Everything is constructed in XAML language, which is similar to the HTML Markup.
Simple Binding - DataTemplate
In the first example, we have a simple DataTemplate. It contains a structured Grid, Button and couple of TextBlocks. By assigning to the Text Property Binding logic we are telling the Template too look for a specific property in a Class, which will be used with the Template.
Template is looking for specified properties in a collection bound to the
ItemsSource Property. We can also do this by the DataContext, it’s more powerful concept for another Post.
Simple DataTemplate doesn’t have the ability to automatically create a hierarchy. I could make a code and implement a logic to get this effect but fortunately WPF have a HierarchicalDataTemplate. This special template is automatically making a hierarchical view used on the TreeViews.
Task class contains a list of Childrens which is used in the HierarchicalDataTemplate.
HierarchicalDataTemplate has a property ItemsSource which is binded to Children’s property. The Template will create the root element and also elements from the Children’s List. I don’t have to worry about how it’s working. Magic happens behind the scene.
Binding TabControl Content
Every TabControl contains a TreeView, which is filled with Task Items. I wanted another Template, which would automatically inject the TreeView into TabControl.
TabItem Template creates a Transparent TreeView. It’s bound to the Content property. This is a property of Project class which is used to create a new TabItems with children’s injected to the TreeView.
Project class is a root for every Task set. It’s Title bound to the Header property of a TabItem.
In order to bind the Title from the Project class to the TabItem the header, I had to change a tab item style a bit. The Content Presenter was replaced by the TextBlock which Text Property is bound to The Title.
When all is done I just need to create sample data.