Main Content

uitree

ツリーまたはチェック ボックス ツリー コンポーネントの作成

ページ内をすべて折りたたむ

構文

t = uitree
t = uitree(style)
t = uitree(parent)
t = uitree(parent,style)
t = uitree(___,Name,Value)

説明

t = uitree は、標準ツリーを新しい Figure ウィンドウ内に作成し、Tree オブジェクトを返します。MATLAB® は関数 uifigure を呼び出してこの Figure を作成します。

t = uitree(style) は指定されたスタイルのツリーを作成します。標準ツリーではなく、チェック ボックス ツリーを作成するには、style を 'checkbox' に指定します。

例

t = uitree(parent) は、指定した親コンテナーに標準ツリーを作成します。親には、関数 uifigure を使用して作成された Figure か、またはその子コンテナーのいずれかを指定できます。

例

t = uitree(parent,style) は、指定された親コンテナー内に指定されたスタイルのツリーを作成します。

例

t = uitree(___,Name,Value) は、1 つ以上の Name,Value 引数で指定されたプロパティをもつツリーを作成します。このオプションは、前述の構文のすべての入力引数の組み合わせで使用できます。

例

すべて折りたたむ

[Sample Data] という名前の親ノードと Sample 1 という名前の子ノードを含むツリーを作成します。ツリーを展開すると、両方のノードが表示されます。

fig = uifigure;
t = uitree(fig);
parent = uitreenode(t,'Text','Sample Data');
child = uitreenode(parent,'Text','Sample 1');
expand(t)

Tree with two nodes. A node with text "Sample Data" has a child node with text "Sample 1".

[Sample Data] という名前の親ノードと Sample 1 という名前の子ノードを含むチェック ボックス ツリーを作成します。ツリーを展開すると、両方のノードが表示されます。

fig = uifigure;
t = uitree(fig,'checkbox');
parent = uitreenode(t,'Text','Sample Data');
child = uitreenode(parent,'Text','Sample 1');
expand(t)

Check box tree with two nodes. A node with text "Sample Data" has a child node with text "Sample 1". Both nodes have check boxes to the left of the text.

異なるファイル タイプを視覚的に区別できるように、ファイル構造を展示するツリー中のノードのスタイルを決定します。

ツリー UI コンポーネントを作成します。各最上位ノードはフォルダーを表します。各子ノードはそのフォルダー中のファイルを表します。ツリーを展開すると、すべてのノードが表示されます。

fig = uifigure("Position",[300 300 350 400]);
t = uitree(fig);

% Parent nodes
n1 = uitreenode(t,"Text","App 1");
n2 = uitreenode(t,"Text","App 2");
n3 = uitreenode(t,"Text","Images");

% Child nodes
n11 = uitreenode(n1,"Text","myapp1.m");
n21 = uitreenode(n2,"Text","myapp2.m");
n22 = uitreenode(n2,"Text","app2callback.m");
n31 = uitreenode(n3,"Text","peppers.png");

expand(t)

Tree with three top-level nodes with text "App 1", "App 2", and "Images", and nested nodes with file names.

3 つのスタイルを作成します。1 つはフォントの太さが太字、1 つはフォントの角度がイタリック、1 つはアイコンです。

dirStyle = uistyle("FontWeight","bold");
mStyle = uistyle("FontAngle","italic");
imgStyle = uistyle("Icon","peppers.png");

太字のスタイルを最上位ノードに適用して、フォルダーを表すノードを区別します。イタリックのスタイルを App 1 ノードおよび App 2 ノードの子に適用して、MATLAB プログラム ファイルを表すノードを区別します。最後に、イメージ ファイルを表すノードにアイコンのスタイルを適用し、イメージのプレビューを表示します。

addStyle(t,dirStyle,"level",1)
addStyle(t,mStyle,"node",[n1.Children;n2.Children])
addStyle(t,imgStyle,"node",n31)

Tree UI component. The "App 1", "App 2", and "Images" nodes are bold, the nodes with file names that end in .m are italic, and the image file name has an icon of the image to its left.

スポーツ別にグループ分けされたアスリート名を表示するアプリを作成します。アプリ ユーザーが名前をクリックすると、MATLAB はそのアスリートに関するデータを表示します。

ツリー、入れ子にされたツリー ノードのセット、およびツリーのコールバック関数を作成するための次のコマンドを含む mytreeapp.m というプログラム ファイルを作成します。SelectionChangedFcn プロパティは、ユーザーがツリーのノードをクリックしたときに実行する関数を指定します。

function mytreeapp
    fig = uifigure;
    t = uitree(fig,"Position",[20 20 150 150]);

    % Assign callback in response to node selection
    t.SelectionChangedFcn = @nodechange;

    % First level nodes
    category1 = uitreenode(t,"Text","Runners","NodeData",[]);
    category2 = uitreenode(t,"Text","Cyclists","NodeData",[]);

    % Second level nodes.
    % Node data is age (y), height (m), weight (kg)
    p1 = uitreenode(category1,"Text","Joe","NodeData",[40 1.67 58] );
    p2 = uitreenode(category1,"Text","Linda","NodeData",[49 1.83 90]);
    p3 = uitreenode(category2,"Text","Rajeev","NodeData",[25 1.47 53]);
    p4 = uitreenode(category2,"Text","Anne","NodeData",[88 1.92 100]);

    % Expand the tree
    expand(t);
    
    % Create the function for the SelectionChangedFcn callback
    % When the function is executed, it displays the data of the selected item
    function nodechange(src,event)
        node = event.SelectedNodes;
        display(node.NodeData);
    end
end

ユーザーが mytreeapp を実行してツリーのノードをクリックすると、MATLAB はそのノードの NodeData を表示します。

Tree UI component with parent nodes labeled "Runners" and "Cyclists". Each parent node has two child nodes with athlete names.

食品カテゴリ別にグループ分けされた食料品店リストを表示するアプリを作成します。アプリ ユーザーは個々の項目または食品カテゴリ全体をオンにすることができ、MATLAB はオンにされた項目の合計重量を表示します。

チェック ボックス ツリー、入れ子にされたツリー ノードのセット、およびチェック ボックス ツリーの 2 つのコールバック関数を作成するための次のコマンドを含む mycheckboxtreeapp.m というプログラム ファイルを作成します。CheckedNodesChangedFcn プロパティは、ユーザーがツリーのノードをオンまたはオフにしたときに実行する関数を指定します。SelectedNodesChangedFcn プロパティは、ユーザーがツリーのノードを選択したときに実行する関数を指定します。

function mycheckboxtreeapp
    fig = uifigure;
    cbt = uitree(fig,'checkbox','Position',[20 20 150 150]);
    
    % Assign callbacks in response to node check and selection
    cbt.CheckedNodesChangedFcn = @checkchange;
    cbt.SelectionChangedFcn = @selectchange;
    
    % First level nodes
    category1 = uitreenode(cbt,'Text','Vegetables','NodeData',[]);
    category2 = uitreenode(cbt,'Text','Fruits','NodeData',[]);

    % Second level nodes.
    % Node data is the weight of the food item (in grams)
    p1 = uitreenode(category1,'Text','Cucumber','NodeData',400);
    p2 = uitreenode(category1,'Text','Carrot','NodeData',65);
    p3 = uitreenode(category2,'Text','Apple','NodeData',183);
    p4 = uitreenode(category2,'Text','Banana','NodeData',120);

    % Expand the tree
    expand(cbt);
    
    % Create the function for the CheckedNodesChangedFcn callback
    % When this function is executed, it displays the total weight
    % of all checked items
    function checkchange(src,event)
        nodes = event.LeafCheckedNodes;
        if ~isempty(nodes)
            data = [nodes.NodeData];
            display(sum(data));
        end
    end

    % Create the function for the SelectedNodesChangedFcn callback
    % When this function is executed, it displays the name
    % of the selected item
    function selectchange(src,event)
        node = event.SelectedNodes;
        display(node.Text);
    end
end

ユーザーが mycheckboxtreeapp を実行してツリーのノードをオンまたはオフにすると、MATLAB は、2 次レベルのオンになったすべてのノードの重量の合計 (NodeData に保存されている) を表示します。ユーザーがツリーのノードを選択すると、MATLAB はそのノードのテキストを表示します。

Check box tree with two top-level nodes, "Vegetables" and "Fruits". Each top-level node has two nested nodes beneath it.

table のデータに基づいてノードを追加するツリーを作成します。

UI コンポーネントを保持するグリッド レイアウト マネージャーをもつ Figure を作成します。電力会社の停電に関するサンプル データを読み込み、データを表示するテーブル UI コンポーネントを作成します。次にツリーを作成して、停電した地域および原因をリストするノードを保持します。

fig = uifigure;
gl = uigridlayout(fig,[1 2]);
gl.ColumnWidth = {'2x','1x'};

T = readtable("outages.csv");
T = T(1:20,["Region","OutageTime","Loss","Cause"]);
tbl = uitable(gl,"Data",T);

tr = uitree(gl);

ツリーに表示する table 変数を指定します。これらの変数それぞれに対して、テキストが変数名である最上位ノードを作成します。変数に対する table エントリを categorical 配列に変換し、カテゴリのリストを names として返すことにより、関連するデータを抽出します。次に、カテゴリをループします。各要素に対して、適切な親ノードの下でツリーにノードを追加します。

vars = ["Region","Cause"];

for k1 = 1:length(vars)
    var = vars{k1};
    varnode = uitreenode(tr,"Text",var);
    rows = T{:,var};
    names = categories(categorical(rows));
         
    for k2 = 1:length(names)
        text = names{k2};
        uitreenode(varnode,"Text",text);
    end
end

ツリーを展開すると、すべてのノードが表示されます。

expand(tr)

Figure window with a table and a tree. The table contains outage sample data, and the tree contains a node for each region and cause in the table data.

入力引数

すべて折りたたむ

ツリーのスタイル。次のいずれかとして指定します。

  • 'tree' — 項目の階層リスト

  • 'checkbox' — 各項目の左側にチェック ボックス付きで示される、チェック可能な項目の階層リスト

親コンテナー。関数 uifigure を使用して作成された Figure オブジェクト、またはその子コンテナー (Tab、Panel、ButtonGroup または GridLayout) のいずれかとして指定します。親コンテナーを指定しない場合、MATLAB は関数 uifigure を呼び出し、親コンテナーとして機能する新しい Figure オブジェクトを作成します。

名前と値の引数

オプションの Name,Value の引数ペアをコンマ区切りで指定します。Name は引数名で、Value は対応する値です。Name は一重引用符 (' ') で囲まなければなりません。Name1,Value1,...,NameN,ValueN のように、複数の名前と値のペアの引数を指定できます。

各タイプの Tree オブジェクトは、異なるプロパティのセットをサポートします。プロパティの完全なリストと各タイプについての説明は、対応するプロパティのページを参照してください。

詳細

すべて折りたたむ

選択されたノード

標準ツリーまたはチェック ボックス ツリーで選択されたノードは、ノード テキストの周囲が青で強調表示されて示されます。アプリ ユーザーは、ノード テキストをクリックしてノードを選択できます。

Multiselect プロパティが 'off' に設定されている標準ツリーとすべてのチェック ボックス ツリーでは、1 つのノードのみ選択できます。標準ツリーで、Multiselect プロパティを 'on' に設定すると、複数のノードを選択できます。

次の図では、Carrot ノードが選択されています。

Check box tree. The node with text "Carrot" has a blue highlight.

オンにされたノード

チェック ボックス ツリーでは、オンにされたノードは、ノード テキストの左側にあるオンにされたチェック ボックスで示されます。任意の数のノードをオンにすることができます。アプリ ユーザーは、チェック ボックスをクリックしてノードをオンまたはオフにできます。標準ツリーでは、ノードをオンにできません。

次の図では、Fruits ノード、Apple ノード、Banana ノードがオンになっています。

Check box tree. The nodes with text "Fruit", "Apple", and "Banana" have checked check boxes to the left of the text.

バージョン履歴

R2017b で導入

すべて展開する

参考

関数

プロパティ

ツール

トピック