Telerik Forums / UI for WinForms Forum / Treeview /

Treeview tooltips instead of horizontal scroll bar

Telerik UI for WinForms
Resources Buy Try

24 posts, 1 answers

erwin

400 posts

Member since:
Dec 2006

Posted 23 Jul 2008 Link to this post

2008Q1 SP1

How can I configure the treeview so that - if a node's text is
too large for the treeview - a tooltip appears on that node (only) instead of
a horizontal scroll bar.

Just the way for example Outlook 2007 does it.
The UI is less cluttered in case there are only a few long names among
a lot of shorter names.

If not possible by default is there a way to implement it myself?
(I don't want tooltips on all nodes, just on those that cannot be fully displayed
without scroll bars).

Erwin

Jordan

Admin

547 posts

Posted 25 Jul 2008 Link to this post

Hello erwin,

This is custom functionality that you will have to implement, because RadTreeView does not support this out of the box. You could try something like the code below:

    
            public Form1() 
        
                    { 
        
                        InitializeComponent(); 
        
                        this.radTreeView1.HScrollBar.Visible = false; 
        
                        this.radTreeView1.HScrollBar.VisibleChanged += new EventHandler(HScrollBar_VisibleChanged); 
        
                        foreach (RadTreeNode rootNode in this.radTreeView1.Nodes) 
        
                        { 
        
                            if (rootNode.Text.Length > 4) 
        
                            { 
        
                                rootNode.ToolTipText = rootNode.Text; 
        
                            } 
        
                        } 
        
                    } 
        
                    void HScrollBar_VisibleChanged(object sender, EventArgs e) 
        
                    { 
        
                        this.radTreeView1.HScrollBar.Visible = false; 
        
                    }

Of course if you want to have tooltips for other than the root nodes you will need to traverse the tree view nodes.
Or you could write a command that sets the tool tip for a node if necessary and execute it on the RadTreeView.

Regards,
Jordan
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

erwin

400 posts

Member since:
Dec 2006

Posted 25 Jul 2008 Link to this post

not practical, because I would have to measure the length of the displayed
string plus find out the position within the tree control.
(The control can be dynamically resized by the User)

The requirement is very common if you want to mimic the behaviour
of the current MS Outlook with a Panel Bar that contains TreeViews.
Displaying the horizontal Scroll Bar if just a few entries are too long
clutters the UI.

Regards
Erwin

Answer

Jordan

Admin

547 posts

Posted 28 Jul 2008 Link to this post

Hi Erwin,

You could try handling the Layout and Scroll events of RadTreeView to update the tooltips like this:

    
            protected override void OnLoad(EventArgs e) 
        
                    { 
        
                        base.OnLoad(e); 
        
                        this.radTreeView1.HScrollBar.Visible = false; 
        
                        this.radTreeView1.HScrollBar.VisibleChanged += new EventHandler(HScrollBar_VisibleChanged); 
        
                        this.radTreeView1.Layout += new LayoutEventHandler(radTreeView1_Layout); 
        
                        this.radTreeView1.Scroll += new ScrollEventHandler(radTreeView1_Scroll); 
        
                    } 
        
                    void radTreeView1_Scroll(object sender, ScrollEventArgs e) 
        
                    { 
        
                        this.UpdateNodeTooltips(); 
        
                    } 
        
                    void radTreeView1_Layout(object sender, LayoutEventArgs e) 
        
                    { 
        
                        this.UpdateNodeTooltips();   
        
                    } 
        
                    private void UpdateNodeTooltips() 
        
                    { 
        
                        for (int i = 0; i < this.radTreeView1.TreeViewElement.Items.Count; i++) 
        
                        { 
        
                            TreeNodeUI treeNodeUI = this.radTreeView1.TreeViewElement.Items[i] as TreeNodeUI; 
        
                            int nodeRight = treeNodeUI.Bounds.Right + this.radTreeView1.Left; 
        
                            int treeViewRight = this.radTreeView1.Right; 
        
                            if (this.radTreeView1.VScrollBar.Visible) 
        
                            { 
        
                                treeViewRight -= this.radTreeView1.VScrollBar.Width; 
        
                            } 
        
                            bool showTooltip = nodeRight > treeViewRight; 
        
                            RadTreeNode node = treeNodeUI.AssociatedTreeNode; 
        
                            if (node != null) 
        
                            { 
        
                                node.ToolTipText = (showTooltip) ? node.Text : null; 
        
                            } 
        
                        } 
        
                    } 
        
                    void HScrollBar_VisibleChanged(object sender, EventArgs e) 
        
                    { 
        
                        this.radTreeView1.HScrollBar.Visible = false; 
        
                    }

Please give it a try and tell us if you have problems with that solution.

Sincerely yours,
Jordan
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

erwin

400 posts

Member since:
Dec 2006

Posted 28 Jul 2008 Link to this post

Hi, thanks - I tried it out and it works.

Made a copy error first which ended up adding tooltips to all visible nodes
which made scrolling considerably less smooth.
(If setting the tooltip property causes a lot of overhead - there's maybe
potential to further optimize if tooltip gets set only if not already set?)

But works nicely if only one or
two of the visible nodes overlap the client area of the tree and would
otherwise cause the horizontal scrollbar to appear.

Regards
Erwin

Jordan

Admin

547 posts

Posted 29 Jul 2008 Link to this post

Hi Еrwin,

Glad to hear that I was helpful.

When I was thinking about your problem, another, even easier solution came to mind. Instead of handling the Layout and Scroll events you can just handle the ToolTipTextNeeded event like:

    
            void radTreeView1_ToolTipTextNeeded(object sender, Telerik.WinControls.ToolTipTextNeededEventArgs e) 
        
                    { 
        
                        TreeNodeUI treeNodeUI = sender as TreeNodeUI; 
        
                        if (treeNodeUI == null) 
        
                        { 
        
                            return; 
        
                        } 
        
                        int nodeRight = treeNodeUI.Bounds.Right + this.radTreeView1.Left; 
        
                        int treeViewRight = this.radTreeView1.Right; 
        
                        if (this.radTreeView1.VScrollBar.Visible) 
        
                        { 
        
                            treeViewRight -= this.radTreeView1.VScrollBar.Width; 
        
                        } 
        
                        bool showTooltip = nodeRight > treeViewRight; 
        
                        RadTreeNode node = treeNodeUI.AssociatedTreeNode; 
        
                        if (node != null) 
        
                        { 
        
                            node.ToolTipText = (showTooltip) ? node.Text : null; 
        
                        } 
        
                    }

Also with this solution the scrolling should not be impacted.

Regarding the horizontal scrollbar, I guess you will have to extend the solution a bit with some logic that will determine if it should be visible.

Do not hesitate to write if you have more problems/questions/suggestions.

Regards,
Jordan
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

erwin

400 posts

Member since:
Dec 2006

Posted 29 Jul 2008 Link to this post

Thanks for this elegant Solution, Jordan.
Works like a charm. I especially like the fact that it does not interfere as
much with the normal operation as the former solution.

Regards
Erwin
erwin

400 posts

Member since:
Dec 2006

Posted 19 Mar 2011 Link to this post

Apparently this solution no longer works with Q1 2011 ...
erwin

400 posts

Member since:
Dec 2006

Posted 22 Mar 2011 Link to this post

bumped because it says telerik answered but there is no new telerik post in the thread.
Stefan
Admin

2911 posts

Posted 22 Mar 2011 Link to this post

Hi erwin,

Thank you for bringing this into our attention. We will add functionality to hide the scroll bars in the upcoming Service Pack.

I have added 500 Telerik points to your account for the feedback.

All the best,
Stefan
the Telerik team

Vote for the 7 Telerik products at the 2011 Great Indian Developer Awards!
erwin

400 posts

Member since:
Dec 2006

Posted 20 Apr 2011 Link to this post

Any hints on how to do this with 2011Q1SP1 ?

Regards
Erwin
Jack
Admin

2333 posts

Posted 22 Apr 2011 Link to this post

Hello erwin,

The horizontal scrollbar visibility is controlled automatically by RadTreeView. You can hide it by overriding the default RadTreeViewElement and its MeasureOverride method. Consider the code snippet below:

public class MyTreeView : RadTreeView

{

    public override string ThemeClassName

    {

        get { return typeof(RadTreeView).FullName; }

        set {}

    }

    protected override RadTreeViewElement CreateTreeViewElement()

    {

        return new MyTreeViewElement();

    }

}

public class MyTreeViewElement : RadTreeViewElement

{

    protected override Type ThemeEffectiveType

    {

        get { return typeof(RadTreeViewElement); }

    }



    protected override SizeF MeasureOverride(SizeF availableSize)

    {

        SizeF size = base.MeasureOverride(availableSize);

        this.HScrollBar.Visibility = ElementVisibility.Collapsed;

        this.HScrollBar.Value = 0;

        return size;

    }

}

In addition, the following code shows allows for customizing the tool-tip text:

void radTreeView1_ToolTipTextNeeded(object sender, ToolTipTextNeededEventArgs e)

{

    TreeNodeElement nodeElement = sender as TreeNodeElement;

    if (nodeElement != null)

    {

        if (nodeElement.Data.ActualSize.Width > this.radTreeView1.TreeViewElement.ViewElement.Size.Width)

        {

            e.ToolTipText = nodeElement.Data.Text;

        }

        else

        {

            e.ToolTipText = "";

        }

    }

}

I hope this helps.

Kind regards,
Jack
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
erwin

400 posts

Member since:
Dec 2006

Posted 25 Apr 2011 Link to this post

Thanks, Jack.

The only problem with this solution is, that the tree still scrolls horizontally which is of course a bit strange if there are no scrollbars. Is there a way I can prevent horizontal scrolling?

Erwin
Stefan
Admin

2911 posts

Posted 27 Apr 2011 Link to this post

Hi erwin,

Thank you for writing back.

Currently, I can no provide you with a working solution for preventing the auto scrolling mechanism. I have added this into out PITS system and we will address it in a future release.

Your Telerik points have been updated for this report.

Regards,
Stefan
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
erwin

400 posts

Member since:
Dec 2006

Posted 28 Apr 2011 Link to this post

Thanks Stefan,

I think what I would like to achieve is not that uncommon. For example Outlook 2010 has a tree to navigate through mailbox folders. That tree scrolls only vertically but not horizontally. If a mailbox name is too long to show fully, a tooltip appears.

Regards
Erwin
Stefan
Admin

2911 posts

Posted 03 May 2011 Link to this post

Hello erwin,

Thank you for writing back.

I fully agree with you that this is not uncommon and for this reason I have added this into our PITS system. As I mentioned, currently there is no work around that I can provide you with, that will give you the desired behavior. We will add such a functionality in one of the next releases.

All the best,
Stefan
the Telerik team

Q1’11 SP1 of RadControls for WinForms is available for download; also available is the Q2'11 Roadmap for Telerik Windows Forms controls.
kaddy

1 posts

Member since:
Mar 2010

Posted 17 May 2011 Link to this post

I was just trying to find a work around to this exact problem myself.

Hopefully this is something that can be added to the Q2 update.
Stefan
Admin

2911 posts

Posted 20 May 2011 Link to this post

Hi kaddy,

Thank you for writing.

As I mentioned in my previous post, currently there is no work around for this. Feel free to follow this link and add your vote for this issue in order to increase its priority.

Should you have any other questions or suggestions, do not hesitate to contact us.

Regards,
Stefan
the Telerik team

Q1’11 SP1 of RadControls for WinForms is available for download; also available is the Q2'11 Roadmap for Telerik Windows Forms controls.
Ken

2 posts

Member since:
Apr 2009

Posted 13 Sep 2011 Link to this post

I'm on 2011.2.11.831 and have found by accident (or desparation) that disabling the scroll bar stops it auto scrolling. I'll now try and hide it using the posts in this thread.

Hope that helps.

Sorry false alarm, it does make a difference, but it still sometimes scrolls right when a long node is selected with the mouse.

Also the calculation to decide if a tip is needed doesn't work as the node width seems to be the available space, not what it wants.
erwin

400 posts

Member since:
Dec 2006

Posted 14 Sep 2011 Link to this post

Hi Everybody,

I still have this issue even though it is marked as "resolved" in PITS.
Also did not find any updated documentation.

Regards
Erwin
Stefan
Admin

2911 posts
Posted 16 Sep 2011 Link to this post

Hello guys,

Thank you for writing.

@Ken - you can control the scroll bar visibility by setting the ScrollState property:

radTreeView1.TreeViewElement.HorizontalScrollState = ScrollState.AlwaysHide;

radTreeView1.TreeViewElement.VerticalScrollState = ScrollState.AutoHide;

However, hiding scroll bars will not disable the scrolling functionality.Regarding tool tips, please refer to the following sample, which demonstrates how to achieve the desired functionality:

private void radTreeView1_NodeExpandedChanged(object sender, RadTreeViewEventArgs e)

{

    UpdateNodeTooltips(radTreeView1.Nodes);

}

private void radTreeView1_Layout(object sender, LayoutEventArgs e)

{

    UpdateNodeTooltips(radTreeView1.Nodes);

}

private void UpdateNodeTooltips(RadTreeNodeCollection nodesCollection)

{

    for (int i = 0; i < nodesCollection.Count; i++)

    {

        RadTreeNode node = nodesCollection[i];

        int nodeWidth = node.ActualSize.Width;

        int treeViewWidth = this.radTreeView1.Size.Width;

        bool showTooltip = nodeWidth > treeViewWidth;

        node.ToolTipText = (showTooltip) ? node.Text : null;

        if (node.Nodes.Count > 0)

        {

            UpdateNodeTooltips(node.Nodes);

        }

    }

}

@erwin, we added the ability to prevent vertical scrolling in our latest release. This is achievable by overriding TreeViewElement class and preventing the base logic in EnsureNodeVisibleHorizontal method:

protected override void EnsureNodeVisibleHorizontal(RadTreeNode node, TreeNodeElement nodeElement)

{

    //base.EnsureNodeVisibleHorizontal(node, nodeElement);

}

However, you are correct, the horizontal scrolling functionality is not working properly in all cases and I changed the issue status to "unresolved". We will improve our API and we will address the issue in one of our upcoming releases.

Attached you can find a sample project demonstrating the desired functionalities - tooltips, hiding the horizontal scroll bar and preventing the tree from scrolling when longer node is clicked.

I hope this helps. Let me know if you have any other questions.

All the best,
Stefan
the Telerik team

Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>

151596.zip
Stefan
Admin

2911 posts

Posted 21 Nov 2011 Link to this post

Hello Erwin,

I hope that you guys are doing well.

I am writing to inform you that in Q3 2011, which was released on Wednesday, the auto scroll behavior which you were experiencing is now stopped for most of the cases. However, if you want to completely stop this functionality, you can set the AutoScrollOnClick property of the TreeViewElement to false.

I hope that you find this information helpful.

All the best,
Stefan
the Telerik team

Q2’11 SP1 of RadControls for WinForms is available for download (see what's new); also available is the Q3'11 Roadmap for Telerik Windows Forms controls.
erwin

400 posts

Member since:
Dec 2006

Posted 21 Nov 2011 Link to this post

Thanks Stefan,

unfortunately I cannot run any test at the moment because of the Nodes.Clear() bug in Q3.

Regards
Erwin
Stefan
Admin

2911 posts

Posted 24 Nov 2011 Link to this post

Hello Erwin,

As you probably already know, we will introduce an internal build to address this issue. Stay tuned.

Regards,
Stefan
the Telerik team

Q3’11 of RadControls for WinForms is available for download (see what's new). Get it today.

Treeview tooltips instead of horizontal scroll bar

Jordan

Jordan

Jordan

Stefan

Jack

Stefan

Stefan

kaddy

Stefan

Ken

Stefan

Stefan

Stefan