Treeは階層メニューなど開閉可能なツリー構造を表示するノードです。

ツリー構造の作成

ツリー構造を構成するオブジェクトは、jp.sunflower.scene.layout.TreeNodeクラスをmixinして作成します。 このクラスはmixinクラスで一般的なツリー構造を実装します。

class Item extends TreeNode {
    var name: String;
    override function toLabel() { name; }
}

toLabel関数のオーバーライド

toLabel関数は、Tree上で表示されるテキストを返します。 適切な文字列表現を生成して返すようにしてください。 デフォルトはtoStringです。

ノードクリック時の処理

リーフノードが選択された時に実行する処理は、nodeAction変数に関数を設定することで可能になります。

TreeNodeの初期化

階層メニューなど固定的なツリーの場合は、宣言的にツリーを作成できます。

var menu = Item {
    name: "Root"
    children: [
        Item {
            name: "Category-1"
            children: [
                Item {
                    name: "Menu-1-1"
                    nodeAction: function() {
                        println("Action-1-1");
                    }
                }
                Item {
                    name: "Menu-1-2"
                    nodeAction: function() {
                        println("Action-1-2");
                    }
                }
            ]
        }
        Item {
            name: "Category-2"
            children: [
                Item {
                    name: "Menu-2-1"
                    nodeAction: function() {
                        println("Action-2-1");
                    }
                }
                Item {
                    name: "Menu-2-2"
                    nodeAction: function() {
                        println("Action-2-2");
                    }
                }
            ]
        }
    ]
}

手続き的にツリーを作成する場合は、TreeNodeのappend関数を使用してください。

Treeの構築

TreeはNodeのサブクラスなので、上記で作成したようなNodeをrootに指定し初期化します。

Tree {
     root: menu
}

オプション