Skip to content

Tree View

The tree view is a component for displaying a hierarchy. Actions can be performed when elements in each hierarchy are clicked.

Tips

Properties

UI Dialog

ItemInput valueOptionDefault value
IDstringautomatic
Widthnumber222
Heightnumber230
Xnumber
Ynumber
Colorstring
color picker
Font Sizenumber16
Visibilityboolean• on
• off
on
Valuetable
details1
Click Eventselect• None
• Action
None

Action

ItemPropertiesData TypeOptionsDefault value
idstringautomatic
widthnumber222
heightnumber230
xnumber
ynumber
colorstring
fontSizenumber16
visibilityboolean• true
• false
true
valuearray of object

Tips

[Details 1] Value (value)

[{
"id": "root",
"label": "Parent",
"children": [
{
"id": "1",
"label": "Child - 1"
},
{
"id": "2",
"label": "Child - 2",
"children": [
{
"id": "2a",
"label": "Child - 2-A"
}
]
}
]
}]

Event

Event nameDescription
onclickPerforms an action when clicked.

The "selected" property allows you to retrieve the object array containing the child elements of the element you clicked on.

ProjectExample
Obtaining Method$ui.tree_view_id.selected
Obtained Value{“id”:“2”,“label”:“Child - 2”,“children”:[{“id”:“2a”,“label”:“Child - 2-A”}]}