iOS 11의 Insets와 Layout

iOS 11

0

Insets

탐색모음이나 탭 표시줄을 배치하여 아래의 테이블 내용이 들어가 보이게 할 경우 Insets로 그 범위를 지정한다. iOS10까지는 [Adjust Scroll View Insets]을 체크하고 배치하고, TableView등에 ScrollView관련 구성요소에 ContentInsets가 자동으로 설정되는 구조로 되어 있었다.

iOS11에서는 contentInsets대신 SafeAreaInsets -> adjustedContentInset에 그 범위를 반영하도록 한다. [Adjust Scroll View Insets](UIViewController.automaticallyAdjustScrollViewInsets)은 iOS11에서는 deprecated가 되었다.

View 레이아웃도 iOS11에서 SafeAreaLayoutGuides가 추가되어 UIViewController의 topLayoutGuide, bottomLayoutGuide가 deprecated가 되었다. Top/BottomLayoutGuide는 UIViewController에 있지만, SafeAreaLayoutGuides는 UIView별로 존재한다. 이는 UIView별로 있다는 것에서 View를 여러번 사용하던 가운데 하위 View에 대해서도 SafeAreaGuide 제약을 만들 수 있다.

또한, 추가된 UIViewController.additionalSafeAreaInsets가 추가되었다. 탭 표시줄/네비게이션 표준을 사용하지 않고 독자적으로 만드는 것에 사용할 수 있다.

iPhone X 크기

탐색 모음 탭 표시줄을 배치했을 때의 다양한 크기정보이다. 상태표시줄이 20 -> 44pt로 되어 있고, Bottom에 HomeIndicator 부분은 34pt로 추가되었다. 기기를 옆으로 누워지면 좌우 Insets가 44pt가 나온다.

Table.layoutMargin 값은 Preserve Superview Margins가 OFF일때의 값이다.

iPhone X의 Bottom부분의 배경에 색상을 지정하는 방법

첫번째, Align Bottom to: Safe Area로 하고 UIViewController.view.backgroundColor로 색상을 지정한다.

두번째, View를 두가지 방법으로 Align Bottom to: Safe Area, 다른 하나는 Bottom Space to: Superview에서 두가지 View의 Top Edge를 같게 설정한다.

파생된 형태로 2개의 View를 계속 배치하는 패턴도 있지만, 0.5pt의 틈이 생겨서 추천하지 않는다.

세번째, 스토리보드의 [Use Safe Area Layout Guides]를 체크한다음 2개의 View를 상위 게층화를 설정한다. 상위 View의 Safe Area Layout Guide를 체크한다.

하위 View의 Bottom제약을 Align Bottom to: Safe Area를 한다.

Insets가 설정되는 타이밍

소스코드에서 Insets값을 고려한 컨텐츠 크기에서 시작할 경우 그 타이밍이 중요하다. viewDidLoad의 타이멩에서 Insets를 서정하지 않았기 때문에 기본적으로 *** DidChange메소드가 준비되어 있어 해당 타이밍을 트리거한다.

구체적으로 어떤 타이밍에서 설정되는지를 체크한다.

 

Facebook Comments

No more articles