Hi WirtVest ERP,

Internally the XamDataTree is trying to calculate the maximum node width across all visible nodes.  That is, it is trying to see which node stretches out the farthest to the right and then it uses that width to compare against the width of the node panel that contains them all.  If the maximum width is greater than the node panel width, it sets the Visibility property of the internal ScrollBar.  What my sample was doing is manually setting the width of the nodes to be the width of the node panel.  Unfortunately I did not take into consideration that the maximum node width is calculated using the node's level and indentation as well.  So a quick example would be:

Node Panel Width: 500
Manually set node width: 500
Node level: 2
Node Indent: 15
Final Node Width: 500 + (2 * 15) = 530

So in this example, the tree panel was 500 pixels wide so I made the node 500 pixels wide so it would stretch across the whole thing.  Then the maximum node calculation looks at the other stuff and calculates that the node is 530 pixels, 30 pixels more than the node panel.  Thus it decides to show the scrollbar.

Now, to resolve this we need to remove the indentation as a variable and we can do this by setting the Indentation property to 0 on the NodeLayout.  This, however, means that child nodes will no longer indent.  So I think the proper way to handle this will be to have your own indentation property, maybe as an attached property, that the XamDataTreeNodeControl style will look at and use in order to push over the expansion indicator and node text in order to fake the indentation.  I have attached an updated sample that does this.

Hello Rob,

Your solution was very helpfull. Unfortunetly horizontal scroll bar is always visible even when all node content is visible. Is possible to disable this scrollbar?

Hi All,

Any update?

Hi Rob,

Thank you so much for your reply, i have solved my problem, but i have some more concerns about it like

1. Node is only selected when we click on text (parent / child), we want to make selection when we click on additional columns that you made through ChildNodeStyle. In attached snapshot we want to make node selection when we click on any image.
2. We need to collapsed all opened nodes on tree toggle button click except clicked once.
3. Can you fixed these points on urgent basis?

Hi elinder,

The process for adding arrow images to the nodes would be pretty similar to my previous sample.  It will involve retemplating the XamDataTreeNodeControl to add your images.  If you look at my previous sample, in the "StatNodeStyle" style you can see that I added a StackPanel called "columns" which rendered the columns.  From the DataContext for the node control you can get the underlying data item for that node and from there you can determine what kind of image to show (up arrow, down arrow or dash image).  Then for child nodes you would have a separate XamDataTreeNodeControl template that shows one arrow depending on the underlying node data.

As for determining what the parent node of the clicked node is, there's no built in MVVM solution for this.  If your underlying data is setup to keep track of parent nodes (the child node has a property that holds the parent node) then it is as simple as binding a view model property to the ActiveDataItem on the XamDataTree and then accessing the view model property and getting the parent from the underlying data.  Other than this, you can create a Behavior<T> which attaches to the XamDataTree and then you can handle the ActiveNodeChanged event inside the behavior.  This event will give you the newly activated node so you can then access the Manager property to get the ParentNode.  If you add a DependencyProperty to the Behavior<T> you should be able to bind something in your view model to it.