WPF TreeView snap to hide / show expand / collapse icon

Question

I implemented a WPF tree with load on demand, as described in this (very good) article. In the mentioned solution, the dummy element is used to save the popup element + icon / treeview. The dummy element is replaced with real data when the user clicks on the expander.

I want to refine the model by adding the public bool HasChildren { get { ... } } property to my TreeNodeViewModel support.

Question:
How to bind this property to hide / show the extension icon (in XAML)? I can not find a suitable trigger / setter combination.
(INotifyPropertyChanged is correctly implemented.)

Thank you for your time.

Update 1:
I want to use my public bool HasChildren instead of using a dummy element.
Determining whether an element has children is somewhat expensive, but still much cheaper than choosing children.

Answer 1

Julian,

This is a really good question. Why don't you try writing your own tree element? :) I mean, not from scratch, just get from the existing TreeViewItem and add your property. I have prepared a quick sample, but feel free to modify it as you wish (and ask questions if something is not entirely clear). Here we go:

 public class TreeViewItem_CustomControl : TreeViewItem { static TreeViewItem_CustomControl() { HasChildrenProperty = DependencyProperty.Register("HasChildren", typeof(Boolean), typeof(TreeViewItem_CustomControl)); } static DependencyProperty HasChildrenProperty; public Boolean HasChildren { get { return (Boolean)base.GetValue(HasChildrenProperty); } set { if (value) { if (this.Items != null) { this.Items.Add(String.Empty); //Dummy item } } else { if (this.Items != null) { this.Items.Clear(); } } base.SetValue(HasChildrenProperty, value); } } } 

This was the code for your custom TreeViewItem. Now let use it in XAML:

 <TreeView> <TreeViewItem Header="qwer"> Regulat tree view item. </TreeViewItem> <CustomTree:TreeViewItem_CustomControl x:Name="xyz" Header="temp header" Height="50"> <TreeViewItem>Custom tree view item, which will be removed.</TreeViewItem> </CustomTree:TreeViewItem_CustomControl> </TreeView> 

As you can see, the first element is ordinary, and the second is your ordinary. Please note that he has one child. You can then bind the HasChildren property to some boolean in your ViewModel or just simply test my own class by setting HasChildren to False from the code located above the aforementioned XAML:

 xyz.HasChildren = false; 

Now, despite the fact that your element has one child, the extension button does not appear, so this means that my custom class is working.

Hope I helped you, but feel free to ask if you have any questions.

Peter.

Answer 2

After a quick search of Josh code, I found this constructor:

 protected TreeViewItemViewModel(TreeViewItemViewModel parent, bool lazyLoadChildren) { _parent = parent; _children = new ObservableCollection<TreeViewItemViewModel>(); if (lazyLoadChildren) _children.Add(DummyChild); } 

So, if you pass false for the lazyLoadChildren parameter from your inheriting ViewModel classes, the + icon should not appear because DummyChild is not added. Since you seem to know if your children have or not, you should pass the appropriate value for the lazyLoadChildren property. Or am I missing something?