Main Content

앱 디자이너에서 그리드 레이아웃 관리자 사용하기

그리드 레이아웃 관리자를 사용하면 Position 벡터에서 UI 컴포넌트의 픽셀 위치를 설정하지 않고도 앱을 배치할 수 있습니다. 크기를 조정할 수 있는 앱의 경우 그리드 레이아웃 관리자가 앱 디자이너의 자동 크기 조정 동작보다 더 많은 유연성을 제공합니다. 또한 SizeChangedFcn 콜백 함수를 코딩하는 것보다 구성하기 더 쉽습니다.

그리드 레이아웃 관리자를 추가하고 구성하기

앱 디자이너에서 비어 있는 앱이나 Figure 내 비어 있는 컨테이너 컴포넌트에 그리드 레이아웃 관리자를 추가할 수 있습니다.

그리드 레이아웃 관리자를 사용하려면 그리드 레이아웃을 컴포넌트 라이브러리에서 캔버스로 끌어서 놓으십시오. 또는 Figure나 컨테이너를 마우스 오른쪽 버튼으로 클릭하고 상황별 메뉴에서 그리드 레이아웃 적용을 선택할 수도 있습니다. 그리드 레이아웃 관리자는 전체 앱 창이나 이를 배치한 컨테이너에 걸쳐 적용됩니다. 그리드 레이아웃 관리자는 앱 디자이너 캔버스에서 능동적으로 구성하지 않는 한 표시되지 않습니다.

그리드 레이아웃 관리자를 구성하려면 디자인 보기에서 그리드 레이아웃을 추가한 영역을 클릭하고 그리드 레이아웃에 포커스를 맞춥니다. 그런 다음 그리드 레이아웃 관리자의 왼쪽 상단 코너에 있는 버튼을 선택하거나 그리드 레이아웃을 마우스 오른쪽 버튼으로 클릭하고 그리드 레이아웃 구성을 선택합니다. 그런 다음 행이나 열을 선택하고 크기 조정 구성 메뉴에서 맞춤, 가중 또는 고정을 지정합니다. 이러한 옵션에 대한 자세한 내용은 GridLayout Properties 항목을 참조하십시오. 행과 열을 추가하거나 제거할 수도 있습니다. 구성된 그리드 레이아웃의 예제를 보려면 그리드 레이아웃을 사용하여 앱 컴포넌트 위치와 크기 관리하기 항목을 참조하십시오.

Grid layout manager resize configuration options. A row is selected, and there are options to add or remove rows, and to specify the row height as fit, weighted, or fixed.

픽셀 기반 위치에서 그리드 레이아웃 관리자로 컴포넌트 변환하기

UI Figure 또는 컨테이너 내의 컴포넌트를 픽셀 기반 위치 지정에서 그리드 레이아웃 관리자로 변환할 수 있습니다. 컴포넌트가 있는 UI Figure나 컨테이너에 그리드 레이아웃 관리자를 적용하면 컴포넌트가 그리드 레이아웃 관리자에 추가되고 컴포넌트의 Position 벡터는 그리드에서 컴포넌트 위치를 지정하는 Layout.Row 값과 Layout.Column 값으로 대체됩니다. 컴포넌트 계층 구조도 컴포넌트 브라우저에서 업데이트됩니다.

Two images of the Component Browser with some components. On the left, the components are listed under app.UIFigure. On the right, the components are listed under app.GridLayout.

그리드 레이아웃 관리자는 다른 컨테이너 컴포넌트와 다른 속성을 지원합니다. 경우에 따라 콜백 코드에서 이러한 유형의 속성을 설정하거나 그리드 레이아웃으로 관리할 때 사용할 수 없는 컴포넌트 속성을 설정하는 경우 콜백 코드를 업데이트해야 할 수 있습니다. 콜백이나 기타 동작이 예상대로 작동하지 않는 경우 이 표에 나열된 것과 같은 코드 패턴을 찾습니다.

증상 또는 경고설명제안된 조치
경고: 'GridLayout'의 컴포넌트에 'Position', 'InnerPosition' 또는 'OuterPosition'을(를) 설정할 수 없습니다.그리드 레이아웃 관리자에서 컴포넌트에 Position 속성을 설정할 수 없습니다.Layout 속성을 적절한 Row 값과 Column 값으로 설정하여 컴포넌트의 그리드 위치를 지정합니다.
다음 사용 중 오류가 발생함: matlab.ui.container.GridLayout/set
‌‌GridLayout 클래스에 FontSize 속성이 없습니다.
다른 컨테이너 컴포넌트에 설정한 속성이 그리드 레이아웃 관리자에서 지원되지 않을 수 있습니다.원하는 컨테이너에 속성을 설정하도록 코드를 업데이트합니다.
컨테이너에 할당된 상황별 메뉴가 실행 중인 앱에서 열리지 않습니다.컨테이너에 그리드 레이아웃 관리자를 추가하면 전체 컨테이너에 걸쳐 적용됩니다. 이는 클릭 이벤트가 컨테이너가 아니라 그리드에서 발생한다는 것을 의미합니다.상황별 메뉴를 그리드 레이아웃에 다시 할당합니다.

그리드 레이아웃 관리자에서 픽셀 기반 위치로 컴포넌트 변환하기

R2022a부터 그리드 레이아웃 관리자를 앱에서 제거하고, 픽셀 기반 위치 지정을 사용하도록 그리드의 컴포넌트를 변환할 수 있습니다. 컨테이너에서 그리드 레이아웃 관리자를 제거하려면 캔버스에서 컨테이너를 마우스 오른쪽 버튼으로 클릭하고 그리드 레이아웃 제거를 선택합니다.

UI Figure 또는 컨테이너에서 컴포넌트가 있는 그리드 레이아웃 관리자를 제거하면 그리드 레이아웃 관리자가 삭제되며 그리드 레이아웃 관리자가 원래 포함되어 있던 컨테이너에 컴포넌트가 추가됩니다. 그리드의 컴포넌트 위치를 지정했던 Layout.Row 값과 Layout.Column 값은 Position 벡터로 대체됩니다. 컴포넌트 계층 구조도 컴포넌트 브라우저에서 업데이트됩니다.

Two images of the Component Browser with some components. On the left, the components are listed under app.GridLayout. On the right, the components are listed under app.UIFigure.

경우에 따라 콜백 코드에서 제거된 그리드 레이아웃 관리자의 속성을 설정하는 경우 콜백 코드를 업데이트해야 할 수 있습니다.

예제: 픽셀 기반 위치가 아니라 그리드 레이아웃 관리자를 사용하도록 컴포넌트 변환하기

이 앱은 이미 컴포넌트가 있는 앱의 Figure에 그리드 레이아웃 관리자를 적용하는 방법을 보여줍니다. 또한 텍스트 기반 컴포넌트의 크기를 변경한 경우 그에 맞게 행과 열이 자동으로 조정되도록 그리드 레이아웃 관리자를 구성하는 방법도 보여줍니다.

  1. 앱 디자이너에서 앱을 엽니다. 디자인 보기에서 그리드 레이아웃 관리자를 Figure로 끌어서 놓습니다.

  2. 방금 Figure에 추가한 그리드 레이아웃 관리자를 마우스 오른쪽 버튼으로 클릭하고 상황별 메뉴에서 그리드 레이아웃 구성을 선택합니다.

  3. 드롭다운 메뉴와 테이블이 포함된 그리드의 행과 열을 하나씩 선택하고 크기 조정 구성을 맞춤으로 변경합니다. 변경을 마치면 컴포넌트 브라우저인스펙터 탭에서 ColumnWidth 값이 12.64x,1.89x,fit,fit,fit,fit이고 RowHeight 값이 1x,fit,1.93x,fit,3.07x,fit인지 확인합니다.

  4. 코드 보기로 전환합니다. allchild 함수가 app.UIFigure가 아니라 app.GridLayout의 컴포넌트에 글꼴 이름과 글꼴 크기를 설정하도록 각 DropDownValueChanged 콜백을 업데이트합니다.

  5. 이제 앱을 실행하여 변경된 컴포넌트의 크기에 맞게 그리드가 어떻게 조정되는지 확인합니다.

참고 항목

함수

속성

관련 항목