Hi,
We use MVVM in our application, our requirement to display records in form of Tree, in child node we display data in column wise currently we showing data in four columns(Value, Avg., St.Dev, PCT) and in last coulmn "PCT" value color is generated based on its value (red circled in snapshot), we want same look and feel by using XamDataTree or any other control like in attached snapshot.
By default first node will be expanded and when user switch to other node then previous expanded node will be collapsed automatically, and expanded the the new one where user click it. Is it possible to achieve same look and feel like in showing snapshot ? Sample application is really very helpful for me.
Hi elinder,
Right now there are probably 3 controls that you could use to achieve this. The XamDataTree, the XamDataGrid and the XamGrid. I'm not sure which one would be the best choice to go with though. The XamDataGrid and XamGrid both have the ability to display columns so one of them may be able to be adjusted to look like your mock-up. Your mock-up looks almost exactly like the XamDataTree though so maybe if all you plan to have are columns in the child nodes then it's probably easier just to modify the XamDataTree node tempates to include a column format and then just stick some dummy headers above the XamDataTree.
I'll look at the options and let you know what I come up with.
Hi Rob,
Thanks for quick response, XamDataTree is the best option, because we must showing data in column wise in child node, now need to modify the XamDataTree node templates to include a column format, can you prepare a small sample application with all my functionlities that i was explained in my previous post ?
I have attached a sample that modifies the XamDataTree slightly to produce a view very similar to your screenshot. This should give you a pretty good idea on how to implement your requirement.
Let me know if you have any questions.
I started looking into provided solution and it works great with two level hierarichy but in my case Stats are further one level down i.e. ParentNode -> ChildNode -> ChildNodeStats.
So, name will come from ParentNode and ChildNode and then corresponding stat values will come from Stats. I tried setting different things including i) Setting TargetTypeName to Stats ii) changing binding of child nodes, but no success.
I am attaching a sample showing above scenario. So, is it possible to use your provided solution in this scenario? Any help?
Thanks
The ChildNode and Stat class structure doesn't make sense to me. If you have a collection of Stats objects in the ChildNode class, I would expect that you would want to have a 3rd level to the tree where you would expand "Days sales outstanding", for example, and you would then see your list of Stats underneath that. But when I look at your initial screenshot, I can't see how it's supposed to work that way. All of your stats are on the same level as the ChildNode. Did you change your tree requirements?
I have attached a sample which shows the Stats on a third level.
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 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: 500Manually set node width: 500Node level: 2Node Indent: 15Final 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.