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.
3 Answers, 1 is accepted
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
Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.
Rank 1
Iron
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.
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);
. . . . . . .
Rank 1
Iron
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.
Thank you.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); }
Best regards.
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
Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.