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)는 하나 이상의 Name,Value 인수로 지정된 속성이 있는 트리를 만듭니다. 위에 열거된 구문에 나와 있는 입력 인수를 조합하여 이 옵션과 함께 사용하십시오.

예제

모두 축소

Sample 1을 자식 노드로 갖는 부모 노드 Sample Data가 포함된 트리를 만듭니다. 트리를 확장하여 두 노드를 모두 표시합니다.

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 1을 자식 노드로 갖는 부모 노드 Sample Data가 포함된 체크박스 트리를 만듭니다. 트리를 확장하여 두 노드를 모두 표시합니다.

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.

굵은 글꼴 두께, 기울임꼴 글꼴 각도, 아이콘을 각각 사용하여 세 가지 스타일을 생성합니다.

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은 선택된 항목의 총 무게를 표시합니다.

체크박스 트리, 중첩된 트리 노드 집합, 체크박스 트리에 대한 두 개의 콜백 함수를 만드는 다음 명령이 포함된 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.

테이블의 데이터를 바탕으로 노드를 채우는 트리를 만듭니다.

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);

트리에 표시할 테이블 변수를 지정합니다. 각 변수마다 텍스트가 변수 이름인 최상위 노드를 생성합니다. 변수의 테이블 요소를 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'로 설정된 표준 트리와 모든 체크박스 트리에서는 항상 한 개의 노드만 선택될 수 있습니다. 표준 트리에서 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에 개발됨

모두 확장

참고 항목

함수

속성

툴

도움말 항목