Hi,
In my application, we have used RadTreeView to show the hierarchical data.
The structure is like this:
-Parent
-Parent1
-Child1
-Child2
-Parent2
-Child1
-Parent
I want to hide the Parent1 node.
We can achieve this by templating and hiding the HeaderRow. But the problem is all the underlying children are also getting hidden.
I want to keep all the children still visible.
Also, I want to make this Parent1 visible/hidden as per user action.
Please let me know how I can achieve this.
13 Answers, 1 is accepted
I can suggest you two approaches for your case.
- The first one is to bind the Visibility property of the Grid element with x:Name="HeaderRow" that is defined in the ControlTemplate of RadTreeView. To do this you can extract the template and modify it a bit. I attached a project showing this approach. I am using an attached property to sync the model with the treeviewitem.
- The second approach is to add and remove the root element from the ItemsSource of the treeview when you want to show/hide it.
Regards,
Martin Ivanov
Progress Telerik
Hi Martin,
Thanks for the quick response.
I used the Header Row visibility approach and it is working fine.
But I came across one scenario which is not behaving correctly.
When we collapse the RadTreeViewItem; visibility of ItemsHost present in the RadTreeView is changing to collapsed.
Now in this case, if I am hiding the header row immediate children are not visible as the ItemsHost is collapsed.
Is there a way to avoid this?
I tried setting Visibility of ItemsHost to visible in this particular case but it didn't work.
I used below triggers:
To Hide Header Row:
<DataTrigger Binding="{Binding RelativeSource={RelativeSource Self},Path=DataContext.ShowServiceGroup}" Value="false">
<Setter Property="Visibility" TargetName="HeaderRow" Value="Collapsed"/>
<Setter Property="Visibility" TargetName="ItemsHost" Value="Visible" />
</DataTrigger>
To make ItemsHost visible:
<Trigger Property="Visibility" SourceName="HeaderRow" Value="Collapsed">
<Setter Property="Visibility" TargetName="ItemsHost" Value="Visible" />
</Trigger>
Pleae help me in this scenario.
In the sample application, you have given we can reproduce my scenario.
Just collapse the "Root" node and then check-uncheck the "Is Root Visible" checkbox.
When you uncheck you won't see anything.
In uncheck case, I explicitly want to make the below hierarchy visible.
Could you please let me know the solution for this.
Some additional info on this :
What we want to achieve is when the HeaderRow is not expanded (child are not visible) and we make it collapsed.
ItemsPresenter (which hold the child node) of RadTreeView should get visible.
To achieve your requirement you can set the IsExpanded property of the treeview item to True. This will make the items host visible. I updated my project to show this approach. I hope it helps.
Regards,
Martin Ivanov
Progress Telerik
Hi Martin,
Thanks your solution worked for me.
Though now with this I am facing one weird behavior.
Sometimes few child nodes are getting hidden automatically.
I am not setting visibility for these nodes. They are always visible.
But in few cases (expand) I can not see them and still they take place on screen.
I have attached a screenshot in which you can check the issue.
Also, I have attached the template we are using for RADTreeViewItem.
Could you please help regarding this.
I can't be sure why this issue occurs, but I could suggest you to double check if the Visibility of the RadTreeViewItems is set somewhere in your application. If so, you can replace it with ItemVisibility which is more reliable for the treeview items.
Regards,
Martin Ivanov
Progress Telerik
Hi Martin,
I cross-checked in the application and i am sure that we are not setting visibility anywhere.
Though I dug into more and found one thing.
This behavior is only reproducible when the virtualization of the tree view is on.
If I switch off the virtualization this behavior is not visible.
Please let me know your views how can I eliminate this completely.
Shashank Mishra
Tue 5/15/2018 4:23 PM
Inbox; Sent Items
To:
Shashank Mishra;
Hi Martin,
I am able to reproduce the issue on the sample you gave me.
You just need to set property IsVirtualizing="True" for tree view.
Once this property is set do following steps:
1. Launch the application. Do not maximize it. Let it be in the same size as it is launched in.
2. Collapse all the tree items.(Item 0, Item 1,Item 2).
3. Hide the root node using checkbox.
4. Now expand the Item 1 node. You will be able to see the children of Item 1 as well as Item 0 and Item 2 nodes.
5. Now expand Item 0.
After step#5 you will be able to see the issue.
Only Item 0 and its children are visible. Item 1 will be visible but all of its children will not be visible also Item 2 is completely gone.
This is the issue I am facing.
If you just remove the IsVirtuaizing property everything will work smooth.
Could you please advices us how to solve this issue.
Hi Martin,
Could you please have a look at this issue and suggest us solution for this.
It is urgent for us.
Thank you for the detailed report. I was able to reproduce the issue. It turns out that hiding the header of an item does not work properly when the virtualization is enabled. This is because panel that arranges the treeview item relies on that all elements in the template of the items will be measured properly. To resolve this you can use Visibility.Hidden instead of Visibility.Collapsed which uses the BooleanToVisibilityConverter. In this case you will need to implement custom converter. Here is an example in code:
public
class
BooleanToVisibilityConverter : IValueConverter
{
public
object
Convert(
object
value, Type targetType,
object
parameter, CultureInfo culture)
{
return
(
bool
)value ? Visibility.Visible : Visibility.Hidden;
}
public
object
ConvertBack(
object
value, Type targetType,
object
parameter, CultureInfo culture)
{
throw
new
NotImplementedException();
}
}
The other approach which you can try is to remove the root item from the ItemsSource of RadTreeView when you want to hide it. Or alternatively, re-populate the treeview with different sources. I updated my last project to show this approach. I hope that helps.
Regards,
Martin Ivanov
Progress Telerik
Hi Martin,
Thanks for the reply.
I tried your first solution but that's not the behavior we want.
If we only hide the header row then it leaves a blank space in the hierarchy.
This is not our desired behavior.
On your second solution :
There are few issues for us :
1. We are binding 20k nodes to the tree view.
2. The same data structure is used for internal processing also. I can not remove the nodes from the data structure. This will impact existing functionality.
3. Creating a duplicate data structure to just bind it to tree view to hide/show the node will result in performance impact.
4. Also handling these two data structures and keeping them in sync will be difficult.
Please let me know your views.
Also if you have any other easy way out.
To avoid the blank space when you hide the header row, you can apply a margin for the entire RadTreeView control that will offset it top and left. For example:
this
.treeView.Margin =
new
Thickness(-20, -20, 0, 0);
As for the other approach with replacing the root, instead of populating the treeview with the root from the original data structure, you can duplicate the data. But not copying it. Instead, you can copy only the root element and set its children collection to the children collection of the original root. This way you won't need to make a copy of each separate item, but only provide a reference to the original collection.
Regards,
Martin Ivanov
Progress Telerik