GeometryReader

 

GeometryReader 를 사용하게 되면 부모 레이아웃의 크기를 알아내서 위치 및 사이즈를 조절할 수 있습니다.

 

아래 코드에서는 뷰의 크기를 계산하여 현재 상태가 세로인지 가로인지를 파악할 수 있도록 한 예제 코드입니다. GeometryReader를 사용하며 클로저를 통해서 .size.height 와 .size.width 를 사용하여 크기를 파악할 수 있습니다.

struct ContentView: View {
   var body: some View {
      GeometryReader { geometry in
         let isPortrait = geometry.size.height > geometry.size.width
         let message = isPortrait ? "Portrait" : "Landscape"

         HStack {
            Text(message)
         }.frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, maxHeight: .infinity, alignment: .center)
      }.ignoresSafeArea()
   }
}

 

또는 다음 코드와 같이 뷰의 크기에 맞춰 특정 컨텐츠의 크기 또한 조절할 수 있습니다. 다음은 Image 의 크기를 화면 뷰의 크기에 맞춰 조절하는 코드입니다.

struct ContentView: View {
   var body: some View {
      GeometryReader { geometry in
         HStack {
            Image(.spot1)
               .resizable()
               .scaledToFit()
               .frame(width: geometry.size.width / 2, height: geometry.size.height / 4)
               .background(Color.gray)
         }.frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, maxHeight: .infinity)
      }
   }
}