Main Content

align

UIControl 컴포넌트 및 Axes 객체 정렬

    설명

    참고

    align 함수는 앱 디자이너 또는 uifigure 함수를 사용하여 만든 앱에서는 지원되지 않습니다. 대신, 그리드 레이아웃 관리자를 사용하여 앱의 컴포넌트를 정렬하십시오. 자세한 내용은 대체 기능 항목을 참조하십시오.

    세로로 객체 정렬

    예제

    align(components,hloc,spacing)는 지정된 컴포넌트를 세로로 정렬합니다. 이 함수는 hloc의 값에 따라 객체의 왼쪽, 가운데 또는 오른쪽을 정렬하고 spacing의 값에 따라 객체 사이의 세로 간격을 조정합니다. 예를 들어, align(components,"left","none")은 왼쪽 가장자리를 정렬하고 간격 조정을 수행하지 않습니다. 각 객체의 크기는 변경되지 않습니다.

    align(components,hloc,"fixed",distance)는 세로 간격이 고정 간격(단위: 포인트)이 되도록 조정합니다.

    가로로 객체 정렬

    align(components,spacing,vloc)는 지정된 컴포넌트를 가로로 정렬합니다. 이 함수는 vloc의 값에 따라 객체의 위쪽, 중간 또는 아래쪽을 정렬하고 spacing의 값에 따라 객체 사이의 가로 간격을 조정합니다. 예를 들어, align(components,"none","top")은 위쪽 가장자리를 정렬하고 간격 조정을 수행하지 않습니다. 각 객체의 크기는 변경되지 않습니다.

    예제

    align(components,"fixed",distance,vloc)은 가로 간격이 고정 간격(단위: 포인트)이 되도록 조정합니다.

    중첩되도록 객체 정렬

    예제

    align(components,hloc,vloc)은 지정된 객체를 서로 중첩되도록 정렬합니다. 이는 hloc에 따라 객체를 세로로 정렬하고 vloc에 따라 객체를 가로로 정렬하는 것과 동일합니다. 예를 들어, align(components,"left","top")components에 있는 객체의 왼쪽 위 코너를 정렬합니다.

    계산된 위치 반환

    예제

    positions = align(___)은 지정한 객체가 정렬될 경우에 얻게 될 해당 객체의 계산된 위치를 행렬로 반환합니다. 단, 객체를 이동하지는 않습니다. 행렬 출력값의 각 행은 위치 벡터입니다. 위에 열거된 구문에 나와 있는 입력 인수를 조합하여 이 옵션과 함께 사용하십시오.

    예제

    positions = align(cpositions,___)cpositions에 위치 정보가 들어 있는 객체를 대상으로, 이를 정렬할 경우에 얻게 될 해당 객체의 계산된 위치를 반환합니다. 단, Figure에서 객체의 위치는 변하지 않습니다. 위에 열거된 구문에 나와 있는 입력값을 조합하고 componentscpositions로 바꾸어서 이 옵션에 사용하십시오.

    예제

    모두 축소

    완전히 정렬되어 있지 않은 세 개의 버튼을 포함하는 Figure를 만듭니다.

    f = figure("Position",[100 100 350 200]);
    u1 = uicontrol(f,"Position",[10 80 60 30],"String","One");
    u2 = uicontrol(f,"Position",[50 50 60 30],"String","Two");
    u3 = uicontrol(f,"Position",[30 10 60 30],"String","Three");
    

    Figure window with three unaligned buttons

    버튼의 가운데를 세로로 정렬하고 버튼 간 세로 간격을 균등하게 합니다. 객체를 세로로 정렬할 때 객체 간격 앞에 정렬 인수를 지정합니다.

    align([u1 u2 u3],"center","distribute");

    Figure window with three buttons in a column with equal vertical distance between each button

    완전히 정렬되어 있지 않은 세 개의 버튼을 포함하는 Figure를 만듭니다.

    f = figure("Position",[100 100 350 200]);
    u1 = uicontrol(f,"Position",[43 50 75 30],"String","Yes");
    u2 = uicontrol(f,"Position",[143 75 75 30],"String","No");
    u3 = uicontrol(f,"Position",[233 40 75 30],"String","Cancel");

    Figure window with three unaligned buttons

    버튼의 아래쪽 가장자리를 가로로 정렬하고 버튼 간 가로 간격을 10포인트로 설정합니다. 객체를 가로로 정렬할 때 정렬 인수 앞에 객체 간격을 지정합니다.

    align([u1 u2 u3],"fixed",10,"bottom");

    Figure window with three buttons in a row, with a distance of 10 pixels between each button

    버튼 하나와 axes 객체 하나를 포함하는 Figure를 만듭니다.

    f = figure("Position",[100 100 350 200]);
    ax = axes(f);
    btn = uicontrol(f,"String","Click");

    Figure window with an axes object and a button in the lower-left corner

    버튼의 가운데를 좌표축의 가운데에 맞춰 정렬합니다. 두 번째 인수 "center"는 컴포넌트를 세로로 정렬할 때 컴포넌트의 어느 부분을 정렬할지 지정하고 세 번째 인수 "middle"은 컴포넌트를 가로로 정렬할 때 컴포넌트의 어느 부분을 정렬할지 지정합니다.

    align([ax btn],"center","middle");

    Figure window with an axes object and button in the center of the axes

    객체를 실제로 정렬하지 않고 만약 정렬한다면 객체가 어디에 올지 계산합니다.

    세 개의 정렬되지 않은 버튼을 포함하는 Figure를 만듭니다.

    f = figure("Position",[100 100 350 200]);
    u1 = uicontrol(f,"Position",[130 25 75 30],"String","Yes");
    u2 = uicontrol(f,"Position",[35 60 75 30],"String","No");
    u3 = uicontrol(f,"Position",[200 160 75 30],"String","Cancel");

    Figure window with three unaligned buttons

    align을 출력 인수와 함께 호출하여 버튼을 정렬한 결과를 예측합니다. 출력값은 행렬로 표현되며, 행렬의 행은 버튼의 예측된 위치 벡터입니다.

    pos1 = align([u1 u2 u3],"right","fixed",3)
    pos1 =
    
       200    25    75    30
       200    59    75    30
       200    93    75    30

    또는 align에 버튼의 위치 벡터를 전달합니다.

    pos2 = align([u1.Position;u2.Position;u3.Position],"right","fixed",3)
    pos2 =
    
       200    25    75    30
       200    58    75    30
       200    91    75    30

    두 경우 모두 결과 위치는 동일합니다. 두 가지 함수 호출 모두 Figure에서 버튼의 위치를 변경하지 않습니다.

    figure(f)

    Figure window with three unaligned buttons

    입력 인수

    모두 축소

    정렬할 객체로, UIControl 또는 Axes 객체로 구성된 벡터로 지정됩니다. 벡터가 UIControl 또는 Axes가 아닌 다른 유형의 객체를 포함하는 경우 align 함수는 이를 무시합니다. 객체를 정렬하더라도 객체의 크기는 변경되지 않습니다.

    components에서 세로로 정렬할 객체의 가로 위치로, "left", "center" 또는 "right"로 지정됩니다. 다음 표에 이러한 옵션 각각에 대한 설명이 나와 있습니다.

    hloc

    결과

    "left"

    객체의 왼쪽 가장자리를 정렬합니다.

    Two rectangles with left edges aligned in a column

    "center"

    객체의 가로 가운데를 정렬합니다.

    Two rectangles with horizontal centers aligned in a column

    "right"

    객체의 오른쪽 가장자리를 정렬합니다.

    Two rectangles with right edges aligned in a column

    모든 정렬 옵션은 해당 객체들을 둘러싸는 경계 상자 내에서 객체의 위치를 맞춥니다. "left" 옵션은 객체의 왼쪽 가장자리를 해당 객체들을 둘러싸는 경계 상자의 왼쪽 가장자리에 맞춰 정렬하고, "right" 옵션은 객체의 오른쪽 가장자리를 해당 객체들을 둘러싸는 경계 상자의 오른쪽 가장자리에 맞춰 정렬합니다. "center" 옵션은 객체의 가운데를 경계 상자의 가운데에 맞춰 정렬합니다.

    객체 간 간격 조정으로, "none" 또는 "distribute"로 지정됩니다.

    • "none" — 객체 간 간격을 변경하지 않습니다. 객체를 세로로 정렬하는 경우, 세로로 이동하지 않습니다. 객체를 가로로 정렬하는 경우, 가로로 이동하지 않습니다.

    • "distribute" — 객체를 균등하게 분산합니다. 객체를 세로로 정렬하는 경우, 해당 객체들을 둘러싸는 경계 상자의 위쪽 가장자리와 아래쪽 가장자리 사이에 객체를 세로로 균등하게 분산합니다. 객체를 가로로 정렬하는 경우, 해당 객체들을 둘러싸는 경계 상자의 왼쪽 가장자리와 오른쪽 가장자리 사이에 객체를 가로로 균등하게 분산합니다.

    components에서 가로로 정렬할 객체의 세로 위치로, "top", "middle" 또는 "bottom"으로 지정됩니다.

    halign

    결과

    "top"

    객체의 위쪽 가장자리를 정렬합니다.

    Two rectangles with top edges aligned in a row

    "middle"

    객체의 세로 가운데를 정렬합니다.

    Two rectangles with horizontal middles aligned in a row

    "bottom"

    객체의 아래쪽 가장자리를 정렬합니다.

    Two rectangles with bottom edges aligned in a row

    모든 정렬 옵션은 해당 객체들을 둘러싸는 경계 상자 내에서 객체의 위치를 정렬합니다. "top" 옵션은 객체의 위쪽 가장자리를 해당 객체들을 둘러싸는 경계 상자의 위쪽 가장자리에 맞춰 정렬하고, "bottom" 옵션은 객체의 아래쪽 가장자리를 해당 객체들을 둘러싸는 경계 상자의 아래쪽 가장자리에 맞춰 정렬합니다. "middle" 옵션은 객체의 중간을 경계 상자의 중간에 맞춰 정렬합니다.

    객체 간 고정 간격으로, 단위가 포인트인 스칼라로 지정됩니다. 이때 72포인트는 1인치와 같습니다.

    객체의 현재 위치로, 행이 위치 벡터인 행렬로 지정됩니다. 각 위치 벡터는 [left bottom width height] 형식으로 객체의 위치와 크기를 지정하는, 요소를 4개 가진 벡터입니다. 모든 위치 벡터 측정값은 픽셀 단위입니다.

    대체 기능

    앱 디자이너 및 uifigure 함수로 만든 앱에서는 그리드 레이아웃 관리자를 사용하여 컴포넌트를 정렬하십시오. 그리드 레이아웃 관리자를 사용하여 UI 컴포넌트를 그리드에 배치할 수 있습니다. uigridlayout 함수를 호출하거나 앱 디자이너에서 그리드 레이아웃 컴포넌트를 캔버스로 끌어서 놓아 그리드 레이아웃 관리자를 만듭니다.

    예를 들어, Figure의 왼쪽 상단 코너에 3개의 버튼을 세로로 정렬하기 위해 4개 행과 2개 열을 포함하는 그리드 레이아웃 관리자를 만듭니다. 첫 번째 열과 처음 3개 행이 자신이 포함하고 있는 컴포넌트에 맞춰 조정되도록 지정합니다. 그런 다음, 3개의 버튼을 만들고 첫 번째 열의 처음 3개 행에 추가합니다.

    fig = uifigure;
    fig.Position = [100 100 200 200];
    gl = uigridlayout(fig);
    gl.RowHeight = {'fit','fit','fit','1x'};
    gl.ColumnWidth = {'fit','1x'};
    
    btn1 = uibutton(gl);
    btn1.Layout.Row = 1;
    btn1.Layout.Column = 1;
    btn2 = uibutton(gl);
    btn2.Layout.Row = 2;
    btn2.Layout.Column = 1;
    btn3 = uibutton(gl);
    btn3.Layout.Row = 3;
    btn3.Layout.Column = 1;
    

    Figure window with three buttons stacked vertically in the upper-left corner

    또는 앱 디자이너의 경우에는 캔버스 탭에서 공백 옵션을 사용하여 컴포넌트를 디자인 보기에서 정렬합니다. 자세한 내용은 앱 디자이너 디자인 보기에 앱 레이아웃 설정하기 항목을 참조하십시오.

    버전 내역

    R2012b에 개발됨

    참고 항목

    | |