Skip to content

NodePlusMinus

Usually, the treeview for nodes with children always shows the plus-minus sign (+) in the first column in a treeview with columns and before any other node controls.

In addition to standard behavior, Flexible TreeView allows to explicitly set the plus-minus sign location or even move it to any other column in a multi-columned tree and display other controls before the plus-minus sign. This option provides a more intuitive and easier UX for better user interaction with your application. For instance, you can display additional icons on the left side of the node before the plus-minus sign.

The NodePlusMinus control is responsible for displaying the plus-minus sign in Flexible TreeView. It is not added to the node controls list by default, which is why the plus-minus sign is always displayed as the first node control in the first column (if there are other columns in the tree).

To get manual control over the plus-minus sign location, you have to add NodePlusMinus explicitly into a treeview using the node controls designer:

Node controls designer

or from code:

NodePlusMinus pm = new NodePlusMinus();
pm.AttachTo(tree);
pm.AttachToColumn(tree.Columns[1]);
Dim pm As New NodePlusMinus()
pm.AttachTo(tree)
pm.AttachToColumn(tree.Columns(1))

Note

  • The index of the NodePlusMinus node control in the treeview node controls list will defines its location in the treeview.
  • If the treeview has columns but NodePlusMinus is not bound to any column, it will not be displayed.

After adding NodePlusMinus, it functions as an usual node control except for the following restrictions:

  • You cannot hide it by changing its Visible property.
  • You cannot adjust its visibility in the nodes in different states using the Visibility property.

If NodePlusMinus node control is explicitly added into a multi-columned treeview but it is not bound to any of the columns or it is bound to an invisible (Visible=false) column, then treeview functions as if Options.Selection.HighlightMode is set to eNodeHighlightMode.FullRow, that is, the plus-minus sign isn't displayed and the complete node row is highlighted.

Display node controls on the left side of the plus-minus sign#

Since NodePlusMinus node control functions as a general control, you may display it at any index in the node controls list so that other node controls can be displayed on the left side of the plus-minus sign. At the same time, such node controls function as general ones, i.e., editing, alignment, animation, soft-selection, etc. functions are available.

The image below shows how the node control position within the node controls list controls node control location in the treeview:

Node control position

Visibility#

To control the NodePlusMinus node control visibility, the following options are available:

  • Options.Appearance.ShowRootPlusMinus property - shows or hides the plus-minus sign for root nodes.
  • Options.Appearance.ShowChildPlusMinus property - shows or hides the plus-minus sign for child nodes.
  • NodePlusMinus also supports node control filtration. Read this topic for details.

RootIndent and NodeIndent#

When NodePlusMinus node control is displayed, the RootIndent and NodeIndent treeview properties are responsible for the shift size in pixels from the left side of the treeview.

RootIndent allows specifying the indent size from the left side for all root nodes, while NodeIndent allows specifying the indent size from the parent node for all child nodes.

RootIndent and NodeIndent

Note

If NodePlusMinus is hidden for root nodes (Options.Appearance.ShowRootPlusMinus=false), then the first node control in the root nodes will be displayed only with the indent specified in the RootIndent property. The NodeIndent property is not used for such nodes.

Even if other node controls are located on the left side (prior) of the plus-minus sign, NodePlusMinus and next node controls will still be displayed with the indent specified in the RootIndent property, even if the total width of node controls on the left side of NodePlusMinus is larger than the RootIndent property value.

Below, even though the 'priority' and 'attachment' icons have their own width, the NodePlusMinus node control is displayed with the static indent specified in the RootIndent property:

NodePlusMinus indent example