Tree

Play Demo

Displays a simulated scene hierarchy in a TreeView widget. Users can expand/collapse branches, select items, add children to the selected node, or remove the selected node. A status label reflects the current selection.

Run: uv run python packages/graphics/examples/ui_tree_demo.py

Source Code

  1"""TreeView Demo -- live scene tree inspector with expand/collapse.
  2
  3Displays a simulated scene hierarchy in a TreeView widget. Users can
  4expand/collapse branches, select items, add children to the selected
  5node, or remove the selected node. A status label reflects the
  6current selection.
  7
  8Run: uv run python packages/graphics/examples/ui_tree_demo.py
  9"""
 10
 11from simvx.core import (
 12    AnchorPreset,
 13    Button,
 14    Colour,
 15    HBoxContainer,
 16    Label,
 17    Node,
 18    Panel,
 19    TreeItem,
 20    TreeView,
 21    VBoxContainer,
 22    Vec2,
 23)
 24from simvx.graphics import App
 25
 26
 27class TreeDemo(Node):
 28    """Root node for the tree view demo scene."""
 29
 30    _node_counter = 0
 31
 32    def ready(self):
 33        # --- Background panel ---
 34        panel = Panel(name="MainPanel")
 35        panel.set_anchor_preset(AnchorPreset.TOP_LEFT)
 36        panel.margin_left = 30
 37        panel.margin_top = 20
 38        panel.size = Vec2(420, 500)
 39        panel.bg_colour = Colour.hex("#1A1A2E")
 40        panel.border_colour = Colour.hex("#16213E")
 41        self.add_child(panel)
 42
 43        vbox = VBoxContainer(name="Layout")
 44        vbox.set_anchor_preset(AnchorPreset.FULL_RECT)
 45        vbox.margin_left = 10
 46        vbox.margin_top = 10
 47        vbox.margin_right = 10
 48        vbox.margin_bottom = 10
 49        vbox.separation = 10
 50        panel.add_child(vbox)
 51
 52        # --- Title ---
 53        title = Label("Scene Tree Inspector")
 54        title.text_colour = Colour.hex("#E94560")
 55        title.font_size = 18.0
 56        title.size = Vec2(400, 28)
 57        title.alignment = "center"
 58        vbox.add_child(title)
 59
 60        # --- Build scene hierarchy ---
 61        root_item = TreeItem("Root")
 62
 63        world = root_item.add_child(TreeItem("World"))
 64        world.add_child(TreeItem("Player (Node3D)"))
 65        world.add_child(TreeItem("Enemy1 (Node3D)"))
 66        world.add_child(TreeItem("Enemy2 (Node3D)"))
 67
 68        ui_branch = root_item.add_child(TreeItem("UI"))
 69        ui_branch.add_child(TreeItem("HUD"))
 70        ui_branch.add_child(TreeItem("Menu"))
 71
 72        root_item.add_child(TreeItem("Camera"))
 73
 74        # --- TreeView widget ---
 75        tree = TreeView(root=root_item, name="SceneTree")
 76        tree.size = Vec2(400, 300)
 77        tree.bg_colour = Colour.hex("#0A0A1A")
 78        tree.select_colour = Colour.hex("#0F3460")
 79        tree.text_colour = Colour.LIGHT_GRAY
 80        vbox.add_child(tree)
 81
 82        # --- Status label ---
 83        status = Label("Selected: (none)")
 84        status.text_colour = Colour.CYAN
 85        status.size = Vec2(400, 22)
 86        vbox.add_child(status)
 87
 88        def on_select(item):
 89            status.text = f"Selected: {item.text}"
 90
 91        tree.item_selected.connect(on_select)
 92
 93        # --- Action buttons ---
 94        btn_row = HBoxContainer(name="Actions")
 95        btn_row.size = Vec2(400, 35)
 96        btn_row.separation = 10
 97        vbox.add_child(btn_row)
 98
 99        def add_node():
100            parent = tree.selected or root_item
101            TreeDemo._node_counter += 1
102            parent.add_child(TreeItem(f"NewNode{TreeDemo._node_counter}"))
103            parent.expanded = True
104
105        def remove_selected():
106            sel = tree.selected
107            if sel and sel is not root_item and sel.parent:
108                sel.parent.remove_child(sel)
109                tree.selected = None
110                status.text = "Selected: (none)"
111
112        add_btn = Button("Add Node", on_press=add_node)
113        add_btn.size = Vec2(120, 35)
114        add_btn.bg_colour = Colour.hex("#0F3460")
115        add_btn.hover_colour = Colour.hex("#1A4A7A")
116        btn_row.add_child(add_btn)
117
118        rm_btn = Button("Remove Selected", on_press=remove_selected)
119        rm_btn.size = Vec2(160, 35)
120        rm_btn.bg_colour = Colour.hex("#533483")
121        rm_btn.hover_colour = Colour.hex("#6A4599")
122        btn_row.add_child(rm_btn)
123
124
125if __name__ == "__main__":
126    app = App(title="SimVX Tree Demo", width=800, height=600)
127    app.run(TreeDemo())