Treeview button on every node align on the right side

[Kevin]

Hello,

I followed this thread to add a button on every node of my treeview (https://www.telerik.com/forums/how-to-add-button-in-every-node)
Now, I would like to know if it's possible to stick those buttons on the right side of the tree view.
I tried to use the alignment property of the button but no luck... Any solutions?

Thank you in advance for your help.

[Dinko | Tech Support Engineer]

Hello Kevin,

Thank you for your interest in our RadTreeView control for WinForms.

If I have correctly understood your question, you want to move the buttons to the most right side of the RadTreeView control. In this case, if we used the approach in the mentioned article, you can set the StretchHorizontally property of the RadHostItem to true. Then set the same property to the RadButton element to false. The last step is to set the Alignment property of the button to right. The following code snippet demonstrates what I have in mind.

internal class CustomTreeNodeElement : TreeNodeElement
{
	. . . . . .
	protected override void CreateChildElements()
	{
		base.CreateChildElements();

		RadButton button = new RadButton();
		button.ButtonElement.Alignment = ContentAlignment.MiddleRight;
		button.ButtonElement.StretchHorizontally = false;
		button.Size = new Size(65, 15);
		
		button.Text = "Add Node";
		RadHostItem host = new RadHostItem(button);
		host.StretchHorizontally = true;
		host.StretchVertically = true;

		this.Children.Add(host);
	}
}

Give this approach a try and let me know how it goes. 

Regards,
Dinko
Progress Telerik

[Kevin]

Hello Dinko,

Thank you very much for your reply.

I tried your solution and it's working well but when I change the button to be a dropdown button I have some issue with the menu.
But I managed to find another solution, let me share it here in case other people are wondering.

protected override void CreateChildElements()
        {
            base.CreateChildElements();

            // Create the layout element to place the dropdown button to the right
            StackLayoutElement nodeContentContainer = new StackLayoutElement();
            nodeContentContainer.Orientation = Orientation.Vertical;
            nodeContentContainer.StretchHorizontally = true;
            nodeContentContainer.StretchVertically = false;

            // Create the dropdown button
            RadDropDownButtonElement ddBtnControls = new RadDropDownButtonElement();
            ddBtnControls.Text = "Controls";
            ddBtnControls.Size = new Size(50, 25);
            ddBtnControls.StretchHorizontally = false;
            
            // Create the menu of the dropdown
            RadMenuItem menu1= new RadMenuItem("menu1");
            ddBtnControls.Items.Add(menu1);
            RadMenuItem menu2 = new RadMenuItem("menu2");
            ddBtnControls.Items.Add(menu2);
            RadMenuItem menu3 = new RadMenuItem("menu3");
            ddBtnControls.Items.Add(menu3);

            // Add the layout and the dropdown button
            this.Children.Add(nodeContentContainer);
            this.Children.Add(ddBtnControls);
        }

But I'm stepping upon another issue right now, when the node text is too long the button will go all the way to the right with a horizontal scrollbar. Does the treeview have some way to have some ellipsis or wrapping?

Thank you again.
Best regards.

[Dinko | Tech Support Engineer]

Thank you for the additional details. Due to the custom implementation, the build-in text wrap is not working. At this moment I wasn't able to make this work using this custom code. I will need more time to try a way to make it work. I will contact you again tomorrow with further details regarding your scenario.

[Dinko | Tech Support Engineer]

Thank you for your patience.

I have reviewed your case and looking at your last code snippet it seems that you are not using LightVisualElement to show the text as demonstrated in the mentioned forum post. If you are using LightVisualElement you can set its AutoEllipsis property to true and set a specific size to the Size property. 

protected override void CreateChildElements()
{
    _container = new DockLayoutPanel();
    _container.StretchHorizontally = true;
    _container.StretchVertically = false;

    _labelElement = new LightVisualElement();
    _labelElement.ShouldHandleMouseInput = false;
    _labelElement.NotifyParentOnMouseInput = true;
    _labelElement.StretchVertically = false;
    _labelElement.AutoEllipsis = true;
    _labelElement.AutoSize = false;
    _labelElement.Size = new Size(50, 20);
. . . . . . .

[Kevin]

Hello Dinko,

Happy new year, sorry for the late reply here.
Is it possible to share with me the complete code?

I tried like this but I lose the alignment on the right and the ellipsis is not working.

        protected override void CreateChildElements()
        {
            base.CreateChildElements();

            DockLayoutPanel container = new DockLayoutPanel();
            container.StretchHorizontally = true;
            container.StretchVertically = false;

            LightVisualElement labelElement = new LightVisualElement();
            labelElement.ShouldHandleMouseInput = false;
            labelElement.NotifyParentOnMouseInput = true;
            labelElement.StretchVertically = false;
            labelElement.AutoEllipsis = true;
            labelElement.AutoSize = false;
            labelElement.Size = new Size(50, 20);
            container.Children.Add(labelElement);

            RadDropDownButtonElement ddBtnControls = new RadDropDownButtonElement();
            ddBtnControls.Text = "Controls";
            ddBtnControls.Size = new Size(50, 25);
            ddBtnControls.StretchHorizontally = false;
            RadMenuItem menu1 = new RadMenuItem("menu1");
            ddBtnControls.Items.Add(menu1);
            RadMenuItem menu2 = new RadMenuItem("menu2");
            ddBtnControls.Items.Add(menu2);
            RadMenuItem menu3 = new RadMenuItem("menu3");
            ddBtnControls.Items.Add(menu3);
            container.Children.Add(ddBtnControls);

            Children.Add(container);
        }

Thank you.
Best regards.

[Dinko | Tech Support Engineer]

Hi Kevin,

I am attaching the sample project which I used to test your scenario. Can you check it out and let me know what I am missing in the sample project to mimic your implementation? 

Regards,
Dinko
Progress Telerik