TreeView expand / selection behaviour

[Martin]

Hello,

the standard behaviour of a treeview in a windows application is, "expand on clicking the arrow/plus symbol", and "select on clicking the treeviews item text". The Telerik RadTreeView also expands/collapses when tapping on the text.

Is there any possibility to prevent the treeview item from expanding/collapsing when tapping its text and instead raising a selection event?

I tried different approches, but nothing worked. I also definded a custom item cell as item template by using "ListViewTemplateCell", but it keeps expanding.

On the treeview item text label I implemented a TapGestureRecognizer (see attached picture). That mostly works, except when you hit the enclosing containers border, it will still expand.

regards,

Martin

[Yana]

Hello Martin,

Thank you for your interest in RadTreeView.

I will try to explain in short the reasons behind the current implementation of the control.

Indeed, the behavior of a standard windows treeview is a bit different, still,  we have designed our RadTreeView control in such a way to be easily used on a mobile device.  The current design suggests that expanding/collapsing is more responsive when tapping over the whole text rather than trying to hit the expander indicator. I am afraid that currently it is not possible to change this behavior.  You could change the gesture for expanding/collapsing with hold, for example.  Let me know what you think of such an approach.

Additionally, RadTreeView supports showing checkboxes which you can use to implement some kind of selection.  Through the CheckBoxMode property you could control the checked state propagation to the child items. For more details on this refer to RadTreeView: CheckBox elements topic.

Please give this feature a try and let me know if you have any questions or comments.

Regards,
Yana
Progress Telerik

[Martin]

Hello Yana,

thanks for your reply. I understand you motives for making the TreeView more easy useable on mobile devices. In our project we are porting a website to an mobile app. On that website there is a TreeView which behaves like a standard Windows TreeView. We have a user function executed when selecting a TreeItem. So selecting and expanding a TreeItem is different behaviour, which our customers are accustomed to.

Luckily I found a working solution..

In the RadTreeView I implemented the TreeViewUserCommand with Id ItemTap and set SuppressDefaultCommand to True. Now the default behaviour on selecting a TreeItem is disabled. After that I implemented a TapGestureRecognizer on the ExpandCollapseIndicator for expanding/collapsing the TreeItem programmatically and a TapGestureRecognizer on the items TextLabel for selecting and highlighting the TreeItem. Finally I enlarged the ExpandCollapseIndicators arrow to be tapped more easily. Works like a charm.

See attached file.

 

Regards,

Martin

[Yana]

Hi Martin,

Thank you for the follow-up.

I overlooked the possibility to use a custom template, sorry for not mentioning it in my previous reply.

The solution you've found is great and thanks again for sharing it in our forum.

Regards,
Yana
Progress Telerik