11. Safe Area , Layout Margins

https://developer.apple.com/documentation/uikit/uiview/positioning_content_relative_to_the_safe_area

Positioning content relative to the safe area | Apple Developer Documentation

 

Safe Area

Safe Area아는 말 그대로 컨텐츠가 표시되기에 안전한 영역이다.(홈버튼, 가장자리 등 제외)

 

기본적으로 제공되는 Safe Area 영역이 있지만, 필요에 따라 Safe Area를 (기본 설정과)다르게 설정해 줄 수도 있다.

(viewDidAppear에서)

override func viewDidAppear(_ animated: Bool) {
   var newSafeArea = UIEdgeInsets()
   // Adjust the safe area to accommodate 
   //  the width of the side view.
   if let sideViewWidth = sideView?.bounds.size.width {
      newSafeArea.right += sideViewWidth
   }
   // Adjust the safe area to accommodate 
   //  the height of the bottom view.
   if let bottomViewHeight = bottomView?.bounds.size.height {
      newSafeArea.bottom += bottomViewHeight
   }
   // Adjust the safe area insets of the 
   //  embedded child view controller.
   let child = self.childViewControllers[0]
   child.additionalSafeAreaInsets = newSafeArea
}

위 아래 양 옆에 항상 보여지는 상태,메뉴 바 등이 필요한 경우... 컨텐츠가 여길 침범하지 않도록!

 

Layout Margins

https://developer.apple.com/documentation/uikit/uiview/positioning_content_within_layout_margins

Positioning content within layout margins | Apple Developer Documentation

체크 되어 있는 이 녀석!

Safe Area가 아닌 View와 관련이 있음.

 

1. 마진에 대해 제약을 추가한 경우(체크)

2. 마진 체크 안했을 경우

 

 

위와 같이 Constrain to margins를 체크하면 마진만큼 떨어지는 것을 알 수 있다.

마진의 크기는 아래와 같이 확인할 수 있고, 필요한 경우 값을 변경할 수도 있다.

 

Constrain to margins가 어떤 것인지는 대략 알고 있어서 주로 체크하지 않고 제약을 잡았었는데..

어떤 개념인지 이해할 수 있었고 추가적으로 마진의 크기 확인, 그리고 변경까지 할 수 있게 되어 유익한 시간이었다.

(+ Safe Area 변경 가능하다는 것도 알게 되었다.)

 

[학습 소스]

공식문서, 야곰 오토레이아웃 정복하기 강의

https://developer.apple.com/library/archive/documentation/UserExperience/Conceptual/AutolayoutPG/index.html

https://yagom.net/courses/autolayout/