[SwiftUI] SwiftUI 의 layout 3 단계

SwiftUI 가 View의 크기를 결정하고 배치하는 방법을 알아보자

들어가기 전에

Text("눈물의 layout")
.background(Color.red)
.offset(x: 100, y: 100)
.background(Color.blue)
Text("눈물의 layout")
.background(Color.red)
.position(x: 100, y: 100)
.background(Color.blue)

Layout Basics

Root View 라고 해서 무조건 device 의 전체 영역을 말하는게 아니라 “특정 View (ContentView) 가 위치할 수 있는 상위 레이어” 라고 생각하면 더 이해가 쉬울듯

Layout Procedure

  1. Parent 는 Child 에게 size 제안
  2. Child 는 Parent 의 크기 제안을 고려해서 (완전히 무시도 가능) 자신의 size 를 결정
  3. Parent 는 child 의 결정을 존중 후 자신의 좌표 공간 내에 child 를 위치

Delicious Avocado Toast

Scrumptious Avocado

Ruler

마무리?

출처

--

--

 https://github.com/sujinnaljin/TIL

Love podcasts or audiobooks? Learn on the go with our new app.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store