Table of Contents
Images #
About #
An amazingly versatile and powerful TreeView control with both a modern style and a classic style.
Features:
- Drag/Drop
- Checkboxes
- Remove Button
- Full color customization
Enumerations #
| Name | Values |
|---|---|
| Styles | Modern |
| Classic | |
| Dark | |
| DropPositions | Above |
| On | |
| Below |
Constants #
| Name | Type | Value |
|---|
This class exposes no constants.
Events #
| Definition | Description |
|---|---|
| ColumnResized( index as Integer ) | Raised when the user resizes a column. |
| MouseEnterNode( theNode as GraffitiTreeViewNode ) | Is fired when the mouse enters the drawable area of a GraffitiTreeViewNode. |
| MouseExitNode( theNode as GraffitiTreeViewNode ) | Fires when the mouse exits the drawable area of a GraffitiTreeViewNode. |
| NodeCollapse( theNode as GraffitiTreeViewNode ) As Boolean | Signals that a TreeViewNode is to be collapsed. Return True to allow. |
| NodeDoubleClick( theNode as GraffitiTreeViewNode ) | Fired when a node has been double clicked. |
| NodeDrag(node as GraffitiTreeViewNode, target as GraffitiTreeViewNode, position as GraffitiTreeView.DropPositions) as Boolean | Controls display of the drop indicator in node drag operations. Return True to omit drawing drop indicator. |
| NodeDrop(node as GraffitiTreeViewNode, target as GraffitiTreeViewNode, position as GraffitiTreeView.DropPositions) as Boolean | Controls whether a node drop target is valid. Return True to cancel the drop operation. |
| NodeEditBegin( theNode as GraffitiTreeViewNode ) | This event signals that the user has clicked the edit icon on a node. |
| NodeEditCanceled( theNode as GraffitiTreeViewNode ) | Fires when the user cancels editing of a node. |
| NodeEditComplete( theNode as GraffitiTreeViewNode ) | Signals that the user has completed editing a TreeViewNode. |
| NodeExpand( theNode as GraffitiTreeViewNode ) As Boolean | Signals that a TreeViewNode is to been expanded. Return True to allow. |
| NodeMultiselectionChange(theNodes() as GraffitiTreeViewNode) | Fires when the MutliSelect property is True. |
| NodeRemove( theNode as GraffitiTreeViewNode ) | Fires when the user has clicked the remove icon of a TreeViewNode. |
| NodeSelectionChange( theNode as GraffitiTreeViewNode ) | Is fired to notify that the user has selected a different node (or deselected the previously selected node). Only when MultiSelect = False. |
| NodeValueChange( theNode as GraffitiTreeViewNode ) | Fires to notify that the user has changed the node’s boolean value. |
| RightClick( theNode as GraffitiTreeViewNode ) | Signals that the user has right-clicked theNode. |
Methods #
| Definition | Description |
|---|---|
| AddChildNode( toNode as GraffitiTreeViewNode, theNode as GraffitiTreeViewNode ) | Adds theNode to toNode and refreshes the display. |
| AddNode( theNode as GraffitiTreeView ) | Appends theNode to the display |
| AddNode( ParentNode as GraffitiTreeViewNode, NewNode as GraffitiTreeViewNode ) | See AddChildNode. |
| CollapseNode( theNode as GraffitiTreeViewNode ) | Collapse a TreeViewNode to hide all children. |
| CollapseNode( theNodeText as String ) | |
| ColumnWidth( index as Integer ) as Integer | Returns the current pixel width of the specified column. |
| ColumnWidth( index as Integer, assigns width as Integer ) | Used to set the pixel width of a column. |
| EditCurrentNode() | Shows the editor for the currently selected node. |
| EditNode( theNode as GraffitiTreeViewNode ) | Shows the editor for the specified node. |
| ExpandNode( theNode as GraffitiTreeViewNode ) | Expands a node to show its children. |
| ExpandNode( theNodeText as String ) | |
| GetCheckedNodes() as GraffitiTreeViewNode() | Returns an array of GraffitiTreeViewNodes that have a true boolean value. |
| GetColumnFromX(x as Integer) as Integer | Returns the column index at the specified X position in the display. |
| GetNodeByTag( theTag as Variant ) as GraffitiTreeViewNode | Returns the first node with a tag matching theTag. |
| GetNodeByText( theText as Variant ) as GraffitiTreeViewNode | Returns the first node with the specified text. |
| GetNodeFromXY( X as Integer, Y as Integer ) as GraffitiTreeViewNode | Returns the node at the specified display coordinates. |
| GetNodeFromY( Y as Integer ) as GraffitiTreeViewNode | Returns the node at the specified Y coordinate. |
| GetSelectedNodes( Y as Integer ) as GraffitiTreeViewNode() | Returns all currently selected nodes. |
| GetVisibleNodeByText( theText as String ) as GraffitiTreeViewNode | Returns the currently visible node with theText. |
| InsertNode( Position as Integer, NewNode as GraffitiTreeViewNode, ParentNode as GraffitiTreeViewNode = Nil ) | Inserts NewNode in to the node array, or ParentNode’s child array, as Position. |
| LastNodeIndex() as Integer | Returns the index of the last top-level node. |
| Node( index as Integer ) as GraffitiTreeViewNode | Returns the node at the specified index. |
| RemoveAllNodes( fromNode as GraffitiTreeViewNode = Nil) | Removes all nodes from either the node array or fromNode’s child array. |
| RemoveNode( theIndex as Integer ) | Removes the specified node. If it is the child of another node, it is removed from that parent. If it has children, all children are also removed. |
| RemoveNode( theNode as GraffitiTreeViewNode ) | |
| ScrollTo( node as GraffitiTreeViewNode ) | Scrolls the display to the specified node. |
| SearchNodes(searchText as String, PartialMatch as Boolean = True) as GraffitiTreeViewNode | Searches node text for the specified string. |
| SetNodeChecked( NodeTextOrTag as Variant, IsChecked as Boolean, IsText as Boolean = True ) | Sets the checked value of the specified node. If IsText = True, then NodeTextOrTag should be the node’s text. |
| SetNodeNotifications( theIndex as Integer, NotificationCount as Integer ) | Sets the notification display count on the node’s icon. If >10, an exclamation point is displayed. |
| SetNodeNotifications( theNode as GraffitiTreeViewNode, NotificationCount as Integer ) | |
| SetNodeSelected( NodeTextOrTag as Variant, IsSelected as Boolean, IsText as Boolean = True ) | Sets the selection of the specified node. If IsText = True, then NodeTextOrTag should be the node’s text. |
Properties #
| Name | Type | Default Value | Description |
|---|---|---|---|
| AllowColumnResize | Boolean | False | Determines whether columns can be resized by the user dragging from the right edge of a column. |
| AllowDeselect | Boolean | False | Determines if the user is allowed to deselect all nodes by clicking outside the rows. |
| BackgroundColor | Color | &c000000 | Background color of the control. |
| BorderColor | Color | &c000000 | Border color of the control. |
| CanDrag | Boolean | False | Determines whether to enable functionality to drag nodes from the component to other controls. |
| CheckColor | Color | &c000000 | Color used to checkboxes. |
| CheckHoverColor | Color | &c000000 | Color used to draw checkboxes when the mouse if over them. |
| CheckSelectedColor | Color | &c000000 | Color used to draw checkboxes with a state of True. |
| ColumnCount | Integer | 0 | Number of columns. |
| ColumnWidths | String | “” | String representing the columns widths. |
| ColumnWidthMaximum | Integer | 20 | Maximum column width as a result of resize. |
| ColumnWidthMinimum | Integer | 20 | Minimum column width as a result of resize. |
| CustomColors | Boolean | False | If the control is to use the specified custom color properties. |
| CustomPictures | Boolean | False | If the control is to use the specified custom picture properties. |
| Editor | TextField | Nil | TextField instance used for node editing. |
| ExpanderColor | Color | &c000000 | Default color for expanders when not hovered of selected. |
| ExpanderHoverColor | Color | &c000000 | Color for expanders when hovered. |
| ExpanderSelectedColor | Color | &c000000 | Color for expanders when the row is selected. |
| FullRowSelect | Boolean | False | Whether the control displays selections spanning the full row, or just the caption. |
| HasHeader | Boolean | False | Whether the control displays a large hearder. |
| HeaderColor | Color | &c000000 | Background color of the header. |
| HeaderHeight | Integer | 32 | Height of the header. |
| HeaderText | String | “” | Text to displayed in the header. |
| HeaderTextColor | Color | &c000000 | Color of text in the header. |
| HeaderTextFont | String | “system” | Font of text in the header. |
| HeaderTextSize | Integer | 16 | Size, in points, of the header text. |
| IconChecked | Picture | Nil | Picture representation of node’s checkbox with it’s Value set to true. |
| IconCheckedHover | Picture | Nil | Picture representation of node’s checkbox when hovered. |
| IconCheckedSelected | Picture | Nil | Picture representation of node’s checkbox when the row is selected. |
| IconFolderCollapsed | Picture | Nil | Picture representation of node’s expander when collapsed. |
| IconFolderCollapsedHover | Picture | Nil | Picture representation of node’s expander when collapsed and hovered. |
| IconFolderCollapsedSelected | Picture | Nil | Picture representation of node’s expander when collapsed and selected. |
| IconFolderExpanded | Picture | Nil | Picture representation of node’s expander when expanded. |
| IconFolderExpandedHover | Picture | Nil | Picture representation of node’s expander when expanded and hovered. |
| IconFolderExpandedSelected | Picture | Nil | Picture representation of node’s expander when expanded and selected.. |
| IconRemove | Picture | Nil | Picture to show for the remove action. |
| IconRemoveHover | Picture | Nil | Picture to show when the remove button is hovered. |
| IconRemoveSelected | Picture | Nil | Picture to show when the remove button’s row is selected. |
| IconReorder | Picture | Nil | Picture to show for the reorder button. |
| IconReorderHover | Picture | Nil | Picture to show for the reorder button when hovered. |
| IconReorderSelected | Picture | Nil | Picture to show for the reorder button when the row is selected. |
| IconUnchecked | Picture | Nil | Picture representation of node’s checkbox with it’s Value set to false. |
| IconUncheckedHover | Picture | Nil | Picture representation of node’s checkbox with it’s Value set to false and hoevered. |
| IconUncheckedSelected | Picture | Nil | Picture representation of node’s checkbox with it’s Value set to false and the row is selected. |
| ListIndex | Integer | -1 | Current selection row index. |
| MultiSelect | Boolean | False | If a user may select more than one node/row. |
| NotificationColor | Color | &c000000 | Background color of notification icon. |
| NotificationTextColor | Color | &c000000 | Text color of notification icon. |
| RemoveColor | Color | &c000000 | Color of remove icon. |
| RemoveColorHover | Color | &c000000 | Color of remove icon when hovered. |
| RemoveColorSelected | Color | &c000000 | Color of remove icon when row selected. |
| ReorderColor | Color | &c000000 | Color of reorder icon. |
| ReorderColorHover | Color | &c000000 | Color of reorder icon when hovered. |
| ReorderColorSelected | Color | &c000000 | Color of reorder icon when row selected. |
| RowColor | Color | &c000000 | Background color of rows. |
| RowColorAlt | Color | &c000000 | Background color of alternating rows. |
| RowHeight | Integer | 29 | Height of rows. |
| RowHoverColor | Color | &c000000 | Background color when row is hovered. |
| RowHoverTextColor | Color | &c000000 | Text color when row is hovered. |
| RowTextColor | Color | &c000000 | Text color of rows. |
| RowTextFont | String | “system” | Font used to display node captions. |
| RowTextSize | Integer | 0 | Text size, in points, of nodes. |
| ScrollMax | Integer (Read-Only) | 0 | Maximum scroll position. |
| ScrollPosition | Integer | 0 | Current scroll position. |
| SelectedRowColor | Color | &c000000 | Background color of selected row. |
| SelectedRowTextColor | Color | &c000000 | Text color of selected row. |
| ShowBorder | Boolean | True | When True, a border is drawn around the edge of the control. |
| Style | GraffitiTreeView.Styles | Modern | The style to apply to the tree’s drawing. |
| VerticalScroll | ScrollBar | Nil | The VerticalScrollBar instance to be used. |
Examples #
Expand/Collapse Nodes By Click #
For expanding or collapsing of nodes by interaction with the mouse, you must implement the NodeCollapse and NodeExpand events, and return True.