Filtering hierarchical data and another TreeView bug

20 ביולי 2007

תגובה אחת

[This blog was migrated. You will not be able to comment here.
The new URL of this post is http://khason.net/blog/filtering-hierarchical-data-and-another-treeview-bug/]


Well, well, well. Yet another TreeView bug discovered, while answering another WPF question. But, before it, let's answer it: "How to filter hierarchical data?"


What we have? We have treeview with XML data binded to it.
What we need? To filter it – for example filter out all odd nodes in any level.
How to do? Regular way, by using Predictate generic object.


Let's start. Light, motor, camera, Data





<root>
<
leaf id="1" name="leaf1">
<
group id="1" name="group1">
<
item name="item1" id="1">
<
subitem id="1">test 1</subitem>
<
subitem id="5">test 2</subitem>
<
subitem id="5">test 3</subitem>
<
subitem id="5">test 4</subitem>
<
subitem id="5">test 5</subitem>
</
item>
<
item name="item2" id="2">
<
subitem id="1">test 1</subitem>
<
subitem id="5">test 2</subitem>
<
subitem id="5">test 3</subitem>
<
subitem id="5">test 4</subitem>
<
subitem id="5">test 5</subitem>
</
item>


…..



Data template (hierarchical of cause)


<HierarchicalDataTemplate DataType="leaf" ItemsSource ="{Binding XPath=*}"> <TextBlock Text="{Binding XPath=@name}" /> </HierarchicalDataTemplate> <HierarchicalDataTemplate DataType="group" ItemsSource ="{Binding XPath=*}"> <TextBlock Text="{Binding XPath=@name}" Foreground="Blue" /> </HierarchicalDataTemplate> <HierarchicalDataTemplate DataType="item" ItemsSource ="{Binding XPath=*}"> <TextBlock Text="{Binding XPath=@name}" Foreground="Red"/> </HierarchicalDataTemplate>

 



Data provider and control to host our data



<XmlDataProvider Source="XMLFile1.xml" x:Key="mydata" XPath="*"/>

        
<TreeView Name="myTree" ItemsSource="{Binding Source={StaticResource mydata}, XPath=*}"/> 

 






Now let's add checkbox to switch filtering on and off



<CheckBox Name="predCheck" Checked="onPredChecked" Unchecked="onPredUnchecked">Filter by predicate object</CheckBox>
 

And now, take care on those routed events…


void onPredChecked(object sender, RoutedEventArgs e) { ICollectionView view = CollectionViewSource.GetDefaultView(myTree.ItemsSource); view.Filter = new Predicate<object>(FilterOdds); } void onPredUnchecked(object sender, RoutedEventArgs e) { ICollectionView view = CollectionViewSource.GetDefaultView(myTree.ItemsSource); view.Filter = null; }

 



How to filter (FilterOdds method)?


bool FilterOdds(object item) {
XmlElement elem = item as XmlElement;
bool res = false;
if (elem != null) {
res =
int.Parse(elem.SelectSingleNode("@id").InnerText) % 2 == 1; }
return res; }

 



Now, let's filter each node, while it's expanding.


void onExpanded(object sender, RoutedEventArgs e) {
TreeViewItem item = sender as TreeViewItem;
if (item != null) {
ICollectionView view = CollectionViewSource.GetDefaultView(item.ItemsSource);
if (view != null) {
if ((bool)predCheck.IsChecked) {
view.Filter =
new Predicate<object>(FilterOdds); }
else {
//Remove comment to stop expanding level 3 //view.Filter = null; } } }
//debug
Console.WriteLine("Item {0} on container {1}", myTree.ItemContainerGenerator.IndexFromContainer(item), ItemsControl.ItemsControlFromItemContainer(item).Name); }

 



Cool everything should work, isn't it? Yes, except the weird bug of treeview, that preventing it from expanding 3rd level node, if filter applied. Try to compile and run it. If the check box unchecked (no filtering) we can easily expand each node on every level. See yourself


image


But if we'll check the checkbox, 3rd level will be inaccessible for us (as well as all deeper levels) See…


image


If you'll try to expand it, focus will move one level up and node remains collapsed. Pretty bad, huh… Good unbugged programming…


Source code for this article 

הוסף תגובה
facebook linkedin twitter email

כתיבת תגובה

האימייל לא יוצג באתר. שדות החובה מסומנים *

תגובה אחת

  1. Suvyakta30 באוגוסט 2007 ב 11:57

    if all the child elements of treeview item node are filtered out, i dont want to show the expand/collapse option for that node.At present after I click on the node,this disappears.How to overcome this problem.For eg: if test1 to test 5 elements are filtered out,item 1 would still provide scope for expansion.After I click on item 1 the expand/collapse disappears.Please help.

    הגב