Issue with custom node layout in RadTreeView

0 Answers 6 Views
Treeview
yw
Top achievements
Rank 2
Iron
Iron
yw asked on 30 Aug 2025, 10:53 AM
I implemented custom nodes by referring to https://docs.telerik.com/devtools/winforms/controls/treeview/working-with-nodes/custom-nodes.
I want to display an icon on the left, and on the right, display Title, line, and Text in order from top to bottom.
The first problem is that when displaying, the distance between line and Text is large, and adjusting the Padding and Margin of each element in CreateChildElements has no effect. See Figure 1 and Figure 1-1. If other items are commented out and only Title or Text is retained on the right, the display is correct, and it also displays correctly when TextWrap = true, as shown in Figure 2 and Figure 2-1.
The second problem is that when both Title and Text are displayed correctly, the display area is wrong when TextWrap = true, as shown in Figure 3,Figure 3-1.
The red rectangle in the figure indicates the error point.
Does anyone know where the problem lies?
yw
Top achievements
Rank 2
Iron
Iron
commented on 30 Aug 2025, 12:33 PM | edited

protected override void CreateChildElements() { _root = new StackLayoutElement { Orientation = Orientation.Horizontal, StretchHorizontally = true, StretchVertically = true, NotifyParentOnMouseInput = true }; _rightPanel = new StackLayoutElement { Orientation = Orientation.Vertical, StretchHorizontally = true, StretchVertically = true, NotifyParentOnMouseInput = true, ShouldHandleMouseInput = true }; _rightPanel.Click += RightPanel_Click; _titleEl = new LightVisualElement { ShouldHandleMouseInput = false, NotifyParentOnMouseInput = true, TextAlignment = System.Drawing.ContentAlignment.MiddleLeft, TextWrap = true }; _line = new LinePrimitive { BackColor = Color.Black, Margin = new Padding(6, 4, 6, 4), LineWidth = 1, MinSize = new Size(0, 1) }; _textEl = new LightVisualElement { ShouldHandleMouseInput = false, NotifyParentOnMouseInput = true, TextAlignment = System.Drawing.ContentAlignment.MiddleLeft, Margin = new Padding(6, 0, 6, 2), TextWrap = true, AutoSize = true }; _rightPanel.Children.Add(_titleEl); _rightPanel.Children.Add(_line); _rightPanel.Children.Add(_textEl); _leftIconHost = new StackLayoutElement { Orientation = Orientation.Vertical, MinSize = new Size(20, 20), MaxSize = new Size(20, int.MaxValue), StretchVertically = true, NotifyParentOnMouseInput = true }; _icon = new ImagePrimitive { Alignment = System.Drawing.ContentAlignment.MiddleCenter, StretchHorizontally = false, StretchVertically = true, Margin = new Padding(6, 2, 6, 2) }; _icon.ShouldHandleMouseInput = true; _icon.NotifyParentOnMouseInput = true; _icon.MouseEnter += Icon_MouseEnter; _icon.MouseLeave += Icon_MouseLeave; _icon.Click += Icon_Click; _leftIconHost.Children.Add(_icon); _root.Children.Add(_leftIconHost); _root.Children.Add(_rightPanel); this.Children.Add(_root); }
Dinko | Tech Support Engineer
Telerik team
commented on 02 Sep 2025, 02:58 PM

I appreciate the provided code. I have reviewed the code, and I am not exactly sure where this space comes from. The provided code snippet is not enough to isolate this in a sample project. In general, when creating a custom node with custom elements, it will be better to arrange them manually. I would suggest checking the How to arrange elements in a custom RadTreeView node KB article that demonstrates this approach. You can use the code in the KB article as a starting point and modify it to fit in your scenario.

No answers yet. Maybe you can help?

Tags
Treeview
Asked by
yw
Top achievements
Rank 2
Iron
Iron
Share this question
or