Tree View

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

Note

• The tree view is a component available only for desktop applications.

Dialog Property

Item	Input value	Option	Default value
ID	string		automatic
Width	number		222
Height	number		230
X	number
Y	number
Color	string color picker
Font Size	number		16
Visibility	boolean	• on • off	on
Value	table details1
Click Event	select	• None • Action	None

Action Property

Item	Properties	Data Type	Options	Default value
id	string		automatic
width	number		222
height	number		230
x	number
y	number
color	string
fontSize	number		16
visibility	boolean	• true • false	true
value	array of object

Note

• The [id] property cannot be set by an action.
• [value] is an object or array of objects consisting of id, label, and children. The children will further store objects or arrays of objects. The value is entered directly as an object.

[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 name	Description
onclick	Performs an action when clicked.

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

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