Tree ​
Inherits: Control < CanvasItem < Node < Object
A control used to show a set of internal TreeItems in a hierarchical structure.
Description
A control used to show a set of internal TreeItems in a hierarchical structure. The tree items can be selected, expanded and collapsed. The tree can have multiple columns with custom controls like LineEdits, buttons and popups. It can be useful for structured displays and interactions.
Trees are built via code, using TreeItem objects to create the structure. They have a single root, but multiple roots can be simulated with hide_root:
func _ready():
var tree = Tree.new()
var root = tree.create_item()
tree.hide_root = true
var child1 = tree.create_item(root)
var child2 = tree.create_item(root)
var subchild1 = tree.create_item(child1)
subchild1.set_text(0, "Subchild1")To iterate over all the TreeItem objects in a Tree object, use TreeItem.get_next and TreeItem.get_first_child after getting the root through get_root. You can use Object.free on a TreeItem to remove it from the Tree.
Incremental search: Like ItemList and PopupMenu, Tree supports searching within the list while the control is focused. Press a key that matches the first letter of an item's name to select the first item starting with the given letter. After that point, there are two ways to perform incremental search: 1) Press the same key again before the timeout duration to select the next item starting with the same letter. 2) Press letter keys that match the rest of the word before the timeout duration to match to select the item in question directly. Both of these actions will be reset to the beginning of the list if the timeout duration has passed since the last keystroke was registered. You can adjust the timeout duration by changing ProjectSettings.gui/timers/incremental_search_max_interval_msec.
Properties
false | ||
false | ||
true | ||
clip_contents | true (overrides Control) | |
false | ||
1 | ||
0 | ||
true | ||
focus_mode | 2 (overrides Control) | |
false | ||
false | ||
true | ||
true | ||
0 |
Methods
Theme Properties
Color(0.27, 0.27, 0.27, 1) | ||
Color(0.95, 0.95, 0.95, 1) | ||
Color(1, 1, 1, 1) | ||
Color(0.7, 0.7, 0.7, 1) | ||
Color(0.875, 0.875, 0.875, 0.5) | ||
Color(0, 0, 0, 1) | ||
Color(1, 1, 1, 1) | ||
Color(0.7, 0.7, 0.7, 0.25) | ||
Color(0.27, 0.27, 0.27, 1) | ||
Color(0.27, 0.27, 0.27, 1) | ||
Color(0.875, 0.875, 0.875, 1) | ||
4 | ||
1 | ||
1 | ||
0 | ||
4 | ||
0 | ||
0 | ||
0 | ||
0 | ||
0 | ||
16 | ||
0 | ||
0 | ||
1 | ||
1 | ||
4 | ||
12 | ||
4 | ||
-1 | ||
-1 | ||
-1 | ||
-1 | ||
4 | ||
4 | ||
Signals
Emitted when a button on the tree was pressed (see TreeItem.add_button).
cell_selected() 🔗
Emitted when a cell is selected.
check_propagated_to_item(item: TreeItem, column: int) 🔗
Emitted when TreeItem.propagate_check is called. Connect to this signal to process the items that are affected when TreeItem.propagate_check is invoked. The order that the items affected will be processed is as follows: the item that invoked the method, children of that item, and finally parents of that item.
column_title_clicked(column: int, mouse_button_index: int) 🔗
Emitted when a column's title is clicked with either @GlobalScope.MOUSE_BUTTON_LEFT or @GlobalScope.MOUSE_BUTTON_RIGHT.
custom_item_clicked(mouse_button_index: int) 🔗
Emitted when an item with TreeItem.CELL_MODE_CUSTOM is clicked with a mouse button.
custom_popup_edited(arrow_clicked: bool) 🔗
Emitted when a cell with the TreeItem.CELL_MODE_CUSTOM is clicked to be edited.
empty_clicked(click_position: Vector2, mouse_button_index: int) 🔗
Emitted when a mouse button is clicked in the empty space of the tree.
item_activated() 🔗
Emitted when an item is double-clicked, or selected with a ui_accept input event (e.g. using Enter or Space on the keyboard).
item_collapsed(item: TreeItem) 🔗
Emitted when an item is collapsed by a click on the folding arrow.
item_edited() 🔗
Emitted when an item is edited.
item_icon_double_clicked() 🔗
Emitted when an item's icon is double-clicked. For a signal that emits when any part of the item is double-clicked, see item_activated.
item_mouse_selected(mouse_position: Vector2, mouse_button_index: int) 🔗
Emitted when an item is selected with a mouse button.
item_selected() 🔗
Emitted when an item is selected.
multi_selected(item: TreeItem, column: int, selected: bool) 🔗
Emitted instead of item_selected if select_mode is set to SELECT_MULTI.
nothing_selected() 🔗
Emitted when a left mouse button click does not select any item.
Enumerations
enum SelectMode: 🔗
SelectMode SELECT_SINGLE = 0
Allows selection of a single cell at a time. From the perspective of items, only a single item is allowed to be selected. And there is only one column selected in the selected item.
The focus cursor is always hidden in this mode, but it is positioned at the current selection, making the currently selected item the currently focused item.
SelectMode SELECT_ROW = 1
Allows selection of a single row at a time. From the perspective of items, only a single items is allowed to be selected. And all the columns are selected in the selected item.
The focus cursor is always hidden in this mode, but it is positioned at the first column of the current selection, making the currently selected item the currently focused item.
SelectMode SELECT_MULTI = 2
Allows selection of multiple cells at the same time. From the perspective of items, multiple items are allowed to be selected. And there can be multiple columns selected in each selected item.
The focus cursor is visible in this mode, the item or column under the cursor is not necessarily selected.
enum DropModeFlags: 🔗
DropModeFlags DROP_MODE_DISABLED = 0
Disables all drop sections, but still allows to detect the "on item" drop section by get_drop_section_at_position.
Note: This is the default flag, it has no effect when combined with other flags.
DropModeFlags DROP_MODE_ON_ITEM = 1
Enables the "on item" drop section. This drop section covers the entire item.
When combined with DROP_MODE_INBETWEEN, this drop section halves the height and stays centered vertically.
DropModeFlags DROP_MODE_INBETWEEN = 2
Enables "above item" and "below item" drop sections. The "above item" drop section covers the top half of the item, and the "below item" drop section covers the bottom half.
When combined with DROP_MODE_ON_ITEM, these drop sections halves the height and stays on top / bottom accordingly.
Property Descriptions
bool allow_reselect = false 🔗
If true, the currently selected cell may be selected again.
bool allow_rmb_select = false 🔗
If true, a right mouse button click can select items.
If true, allows navigating the Tree with letter keys through incremental search.
bool column_titles_visible = false 🔗
If true, column titles are visible.
The number of columns.
The drop mode as an OR combination of flags. See DropModeFlags constants. Once dropping is done, reverts to DROP_MODE_DISABLED. Setting this during Control._can_drop_data is recommended.
This controls the drop sections, i.e. the decision and drawing of possible drop locations based on the mouse position.
bool enable_recursive_folding = true 🔗
If true, recursive folding is enabled for this Tree. Holding down Shift while clicking the fold arrow or using ui_right/ui_left shortcuts collapses or uncollapses the TreeItem and all its descendants.
bool hide_folding = false 🔗
If true, the folding arrow is hidden.
If true, the tree's root is hidden.
bool scroll_horizontal_enabled = true 🔗
If true, enables horizontal scrolling.
bool scroll_vertical_enabled = true 🔗
If true, enables vertical scrolling.
SelectMode select_mode = 0 🔗
void set_select_mode(value: SelectMode)
SelectMode get_select_mode()
Allows single or multiple selection. See the SelectMode constants.
Method Descriptions
void clear() 🔗
Clears the tree. This removes all items.
TreeItem create_item(parent: TreeItem = null, index: int = -1) 🔗
Creates an item in the tree and adds it as a child of parent, which can be either a valid TreeItem or null.
If parent is null, the root item will be the parent, or the new item will be the root itself if the tree is empty.
The new item will be the index-th child of parent, or it will be the last child if there are not enough siblings.
void deselect_all() 🔗
Deselects all tree items (rows and columns). In SELECT_MULTI mode also removes selection cursor.
bool edit_selected(force_edit: bool = false) 🔗
Edits the selected tree item as if it was clicked.
Either the item must be set editable with TreeItem.set_editable or force_edit must be true.
Returns true if the item could be edited. Fails if no item is selected.
void ensure_cursor_is_visible() 🔗
Makes the currently focused cell visible.
This will scroll the tree if necessary. In SELECT_ROW mode, this will not do horizontal scrolling, as all the cells in the selected row is focused logically.
Note: Despite the name of this method, the focus cursor itself is only visible in SELECT_MULTI mode.
Returns the button ID at position, or -1 if no button is there.
int get_column_at_position(position: Vector2) const 🔗
Returns the column index at position, or -1 if no item is there.
int get_column_expand_ratio(column: int) const 🔗
Returns the expand ratio assigned to the column.
String get_column_title(column: int) const 🔗
Returns the column's title.
HorizontalAlignment get_column_title_alignment(column: int) const 🔗
Returns the column title alignment.
TextDirection get_column_title_direction(column: int) const 🔗
Returns column title base writing direction.
String get_column_title_language(column: int) const 🔗
Returns column title language code.
int get_column_width(column: int) const 🔗
Returns the column's width in pixels.
Rect2 get_custom_popup_rect() const 🔗
Returns the rectangle for custom popups. Helper to create custom cell controls that display a popup. See TreeItem.set_cell_mode.
int get_drop_section_at_position(position: Vector2) const 🔗
Returns the drop section at position, or -100 if no item is there.
Values -1, 0, or 1 will be returned for the "above item", "on item", and "below item" drop sections, respectively. See DropModeFlags for a description of each drop section.
To get the item which the returned drop section is relative to, use get_item_at_position.
TreeItem get_edited() const 🔗
Returns the currently edited item. Can be used with item_edited to get the item that was modified.
func _ready():
$Tree.item_edited.connect(on_Tree_item_edited)
func on_Tree_item_edited():
print($Tree.get_edited()) # This item just got edited (e.g. checked).int get_edited_column() const 🔗
Returns the column for the currently edited item.
Rect2 get_item_area_rect(item: TreeItem, column: int = -1, button_index: int = -1) const 🔗
Returns the rectangle area for the specified TreeItem. If column is specified, only get the position and size of that column, otherwise get the rectangle containing all columns. If a button index is specified, the rectangle of that button will be returned.
TreeItem get_item_at_position(position: Vector2) const 🔗
Returns the tree item at the specified position (relative to the tree origin position).
TreeItem get_next_selected(from: TreeItem) 🔗
Returns the next selected TreeItem after the given one, or null if the end is reached.
If from is null, this returns the first selected item.
Returns the last pressed button's index.
TreeItem get_root() const 🔗
Returns the tree's root item, or null if the tree is empty.
Vector2 get_scroll() const 🔗
Returns the current scrolling position.
TreeItem get_selected() const 🔗
Returns the currently focused item, or null if no item is focused.
In SELECT_ROW and SELECT_SINGLE modes, the focused item is same as the selected item. In SELECT_MULTI mode, the focused item is the item under the focus cursor, not necessarily selected.
To get the currently selected item(s), use get_next_selected.
int get_selected_column() const 🔗
Returns the currently focused column, or -1 if no column is focused.
In SELECT_SINGLE mode, the focused column is the selected column. In SELECT_ROW mode, the focused column is always 0 if any item is selected. In SELECT_MULTI mode, the focused column is the column under the focus cursor, and there are not necessarily any column selected.
To tell whether a column of an item is selected, use TreeItem.is_selected.
bool is_column_clipping_content(column: int) const 🔗
Returns true if the column has enabled clipping (see set_column_clip_content).
bool is_column_expanding(column: int) const 🔗
Returns true if the column has enabled expanding (see set_column_expand).
void scroll_to_item(item: TreeItem, center_on_item: bool = false) 🔗
Causes the Tree to jump to the specified TreeItem.
void set_column_clip_content(column: int, enable: bool) 🔗
Allows to enable clipping for column's content, making the content size ignored.
void set_column_custom_minimum_width(column: int, min_width: int) 🔗
Overrides the calculated minimum width of a column. It can be set to 0 to restore the default behavior. Columns that have the "Expand" flag will use their "min_width" in a similar fashion to Control.size_flags_stretch_ratio.
void set_column_expand(column: int, expand: bool) 🔗
If true, the column will have the "Expand" flag of Control. Columns that have the "Expand" flag will use their expand ratio in a similar fashion to Control.size_flags_stretch_ratio (see set_column_expand_ratio).
void set_column_expand_ratio(column: int, ratio: int) 🔗
Sets the relative expand ratio for a column. See set_column_expand.
void set_column_title(column: int, title: String) 🔗
Sets the title of a column.
void set_column_title_alignment(column: int, title_alignment: HorizontalAlignment) 🔗
Sets the column title alignment. Note that @GlobalScope.HORIZONTAL_ALIGNMENT_FILL is not supported for column titles.
void set_column_title_direction(column: int, direction: TextDirection) 🔗
Sets column title base writing direction.
void set_column_title_language(column: int, language: String) 🔗
Sets language code of column title used for line-breaking and text shaping algorithms, if left empty current locale is used instead.
void set_selected(item: TreeItem, column: int) 🔗
Selects the specified TreeItem and column.
Theme Property Descriptions
Color children_hl_line_color = Color(0.27, 0.27, 0.27, 1) 🔗
The Color of the relationship lines between the selected TreeItem and its children.
Text Color for a TreeItem.CELL_MODE_CUSTOM mode cell when it's hovered.
Color drop_position_color = Color(1, 1, 1, 1) 🔗
Color used to draw possible drop locations. See DropModeFlags constants for further description of drop locations.
Color font_color = Color(0.7, 0.7, 0.7, 1) 🔗
Default text Color of the item.
Color font_disabled_color = Color(0.875, 0.875, 0.875, 0.5) 🔗
Text Color for a TreeItem.CELL_MODE_CHECK mode cell when it's non-editable (see TreeItem.set_editable).
Color font_outline_color = Color(0, 0, 0, 1) 🔗
The tint of text outline of the item.
Color font_selected_color = Color(1, 1, 1, 1) 🔗
Text Color used when the item is selected.
Color guide_color = Color(0.7, 0.7, 0.7, 0.25) 🔗
Color of the guideline.
Color parent_hl_line_color = Color(0.27, 0.27, 0.27, 1) 🔗
The Color of the relationship lines between the selected TreeItem and its parents.
Color relationship_line_color = Color(0.27, 0.27, 0.27, 1) 🔗
The default Color of the relationship lines.
Default text Color of the title button.
The horizontal space between each button in a cell.
int children_hl_line_width = 1 🔗
The width of the relationship lines between the selected TreeItem and its children.
Draws the guidelines if not zero, this acts as a boolean. The guideline is a horizontal line drawn at the bottom of each item.
int draw_relationship_lines = 0 🔗
Draws the relationship lines if not zero, this acts as a boolean. Relationship lines are drawn at the start of child items to show hierarchy.
The horizontal space between item cells. This is also used as the margin at the start of an item when folding is disabled.
The maximum allowed width of the icon in item's cells. This limit is applied on top of the default size of the icon, but before the value set with TreeItem.set_icon_max_width. The height is adjusted according to the icon's ratio.
int inner_item_margin_bottom = 0 🔗
The inner bottom margin of a cell.
int inner_item_margin_left = 0 🔗
The inner left margin of a cell.
int inner_item_margin_right = 0 🔗
The inner right margin of a cell.
int inner_item_margin_top = 0 🔗
The inner top margin of a cell.
The horizontal margin at the start of an item. This is used when folding is enabled for the item.
The size of the text outline.
Note: If using a font with FontFile.multichannel_signed_distance_field enabled, its FontFile.msdf_pixel_range must be set to at least twice the value of outline_size for outline rendering to look correct. Otherwise, the outline may appear to be cut off earlier than intended.
int parent_hl_line_margin = 0 🔗
The space between the parent relationship lines for the selected TreeItem and the relationship lines to its siblings that are not selected.
int parent_hl_line_width = 1 🔗
The width of the relationship lines between the selected TreeItem and its parents.
int relationship_line_width = 1 🔗
The default width of the relationship lines.
The maximum distance between the mouse cursor and the control's border to trigger border scrolling when dragging.
The speed of border scrolling.
int scrollbar_h_separation = 4 🔗
The horizontal separation of tree content and scrollbar.
int scrollbar_margin_bottom = -1 🔗
The bottom margin of the scrollbars. When negative, uses panel bottom margin.
int scrollbar_margin_left = -1 🔗
The left margin of the horizontal scrollbar. When negative, uses panel left margin.
int scrollbar_margin_right = -1 🔗
The right margin of the scrollbars. When negative, uses panel right margin.
int scrollbar_margin_top = -1 🔗
The top margin of the vertical scrollbar. When negative, uses panel top margin.
int scrollbar_v_separation = 4 🔗
The vertical separation of tree content and scrollbar.
The vertical padding inside each item, i.e. the distance between the item's content and top/bottom border.
Font of the item's text.
Font of the title button's text.
Font size of the item's text.
Font size of the title button's text.
The arrow icon used when a foldable item is not collapsed.
Texture2D arrow_collapsed 🔗
The arrow icon used when a foldable item is collapsed (for left-to-right layouts).
Texture2D arrow_collapsed_mirrored 🔗
The arrow icon used when a foldable item is collapsed (for right-to-left layouts).
The check icon to display when the TreeItem.CELL_MODE_CHECK mode cell is checked and editable (see TreeItem.set_editable).
Texture2D checked_disabled 🔗
The check icon to display when the TreeItem.CELL_MODE_CHECK mode cell is checked and non-editable (see TreeItem.set_editable).
The check icon to display when the TreeItem.CELL_MODE_CHECK mode cell is indeterminate and editable (see TreeItem.set_editable).
Texture2D indeterminate_disabled 🔗
The check icon to display when the TreeItem.CELL_MODE_CHECK mode cell is indeterminate and non-editable (see TreeItem.set_editable).
The arrow icon to display for the TreeItem.CELL_MODE_RANGE mode cell.
The check icon to display when the TreeItem.CELL_MODE_CHECK mode cell is unchecked and editable (see TreeItem.set_editable).
Texture2D unchecked_disabled 🔗
The check icon to display when the TreeItem.CELL_MODE_CHECK mode cell is unchecked and non-editable (see TreeItem.set_editable).
The updown arrow icon to display for the TreeItem.CELL_MODE_RANGE mode cell.
StyleBox used when a button in the tree is pressed.
StyleBox used for the cursor, when the Tree is being focused.
StyleBox cursor_unfocused 🔗
StyleBox used for the cursor, when the Tree is not being focused.
Default StyleBox for a TreeItem.CELL_MODE_CUSTOM mode cell when button is enabled with TreeItem.set_custom_as_button.
StyleBox for a TreeItem.CELL_MODE_CUSTOM mode button cell when it's hovered.
StyleBox for a TreeItem.CELL_MODE_CUSTOM mode button cell when it's pressed.
The focused style for the Tree, drawn on top of everything.
The background style for the Tree.
StyleBox for the selected items, used when the Tree is not being focused.
StyleBox for the selected items, used when the Tree is being focused.
StyleBox used when the title button is being hovered.
Default StyleBox for the title button.
StyleBox used when the title button is being pressed.