[iOS / UIKit] Positioning Content Within Layout Margins

Positioning Content Within Layout Margins

레이아웃 여백 내에 콘텐츠 배치

 

Position views so that they are not crowded by other content.

다른 콘텐츠에 의해 몰리지 않도록 보기를 배치합니다.

 

Overview

Layout margins provide a visual buffer between a view’s content and any content outside of the view’s bounds. The layout margins consist of inset values for each edge (top, bottom, leading, and trailing) of the view. These inset values create a space between the edges of the view’s bounds rectangle and the content inside the view. Figure 1 shows two views with different sets of layout margins. Apart from the empty space they add around your content, margins have no visible representation.

레이아웃 여백은 뷰의 콘텐츠와 뷰의 경계를 벗어난 내용 사이에 시각적 완충 기능을 제공합니다. 배치 여백은 뷰의 각 모서리(상단, 하단, 선행 및 후행)에 대한 삽입 값으로 구성됩니다. 이러한 삽입 값은 뷰의 경계 직사각형 모서리와 뷰 내부의 내용 사이에 공백을 작성합니다. 그림 1은 레이아웃 여백 세트가 서로 다른 두 뷰를 보여줍니다. 콘텐츠 주위에 추가하는 빈 공간을 제외하고 여백은 표시되지 않습니다.

 

Figure 1 A view's margins

To set up constraints that respect the layout margins, enable the Constrain to margins option in Xcode, as shown in Figure 2. (If you do not enable that option, Xcode creates your constraints relative to the view’s bounds rectangle.) If the superview’s margins change later, the positions of elements tied to those margins are updated accordingly.

레이아웃 여백과 관련된 constraints을 설정하려면 그림 2와 같이 Xcode에서 여백으로 제한 옵션을 활성화합니다. (이 옵션을 활성화하지 않으면 Xcode는 보기의 경계 직사각형을 기준으로 constraints을 작성합니다.) 나중에 슈퍼뷰의 여백이 변경되면 해당 여백에 묶인 요소의 위치가 그에 따라 업데이트됩니다.

 

Figure 2 Constraining content to a view's margins

Even if you are not using constraints to position your content, you can still manually position content relative to a view’s layout margins. The directionalLayoutMargins property of each view contains the edge inset values to use for the view’s margins. Take those margin values into account when computing the position of items in your view.

constraints을 사용하여 콘텐츠를 배치하지 않더라도 뷰의 레이아웃 여백에 상대적인 콘텐츠를 수동으로 배치할 수 있습니다. 각 뷰의 directionLayoutMargins 특성에는 뷰의 여백에 사용할 모서리 삽입 값이 포함되어 있습니다. 보기에서 항목의 위치를 계산할 때 이러한 여유도 값을 고려하십시오.

 

Change the Default Layout Margins

기본 레이아웃 여백을 변경합니다.

 

UIKit provides default layout margins for each view, but you can change the default values to values that are more appropriate for your view. To change a view’s margin values, update the view’s directionalLayoutMargins property. (You can also use the Size inspector to set the value of that property at design time. In the Layout Margins section, choose the Language Directional option and enter the margin values for each of the view’s edges, as shown in Figure 3.)

UIKit은 각 뷰에 대한 기본 레이아웃 여백을 제공하지만, view에 더 적합한 값으로 기본값을 변경할 수 있습니다. 뷰의 여백 값을 변경하려면 뷰의 directionLayoutMargins 특성을 업데이트합니다. 크기 검사기를 사용하여 설계 시 해당 특성의 값을 설정할 수도 있습니다. 배치 여백 섹션에서 언어 방향 옵션을 선택하고 그림 3과 같이 뷰의 각 모서리에 대한 여백 값을 입력합니다.)

 

Figure 3 Setting layout margins in the Size inspector

For the root view of a view controller, UIKit enforces a set of minimum layout margins to ensure that content is displayed correctly. When the values in the directionalLayoutMargins property are less than the minimum values, UIKit uses the minimum values instead. You can get the minimum margin values from the systemMinimumLayoutMargins property of the view controller. To prevent UIKit from applying the minimum margins altogether, set the viewRespectsSystemMinimumLayoutMargins property of your view controller to false.

뷰 컨트롤러의 root view에 대해 UIKit은 콘텐츠가 올바르게 표시되도록 최소 레이아웃 여백 집합을 적용합니다. directionLayoutMargins 특성의 값이 최솟값보다 작으면 UIKit이 대신 최솟값을 사용합니다. 뷰 컨트롤러의 시스템 MinimumLayoutMargins 특성에서 최소 여백 값을 가져올 수 있습니다. UIKit이 최소 여백을 모두 적용하지 못하도록 하려면 보기 컨트롤러의 viewRespectsSystemMinimumLayoutMargins 속성을 false로 설정합니다.

 

The view’s actual margins are computed using the view’s configuration and the value of its directionalLayoutMargins property. A view’s margins are affected by the settings of its insetsLayoutMarginsFromSafeArea and preservesSuperviewLayoutMargins properties, which can increase the default margin values to ensure appropriate spacing of your content.

뷰의 실제 여백은 뷰의 구성과 directionLayoutMargins 특성 값을 사용하여 계산됩니다. 뷰의 여백은 insetLayoutMarginsFromSafeArea의 설정에 의해 영향을 받고 SuperviewLayoutMargins 특성을 보존합니다. 이 특성은 콘텐츠의 적절한 간격을 위해 기본 여백 값을 늘릴 수 있습니다.

 

 

 

※ 참고 출처

애플 개발자 문서

Apple Developer Documentation