[SwiftUI] GeometryReader

GeometryReader

A container view that defines its content as a function of its own size and coordinate space.

→ content의 고유한 Size와 좌표 공간의 함수로 정의하는 Container View

→ 자식 뷰에 부모 뷰와 기기에 대한 크기 및 좌표계 정보를 전달하는 기능을 수행함

GeometryReader{ _ in
    Circle().fill(Color.purple)
        .frame(width: 200, height: 200)
        .overlay(Text("Center").font(.title))
}.background(Color.gray)

결과

 

GeometryProxy

@available(iOS 13.0, macOS 10.15, tvOS 13.0, watchOS 6.0, *)
public struct GeometryProxy {
    /// Geometry의 크기
    public var size: CGSize { get }
    /// GeometryRedaer가 사용된 환경의 safeAreaInsets
    public var safeAreaInsets: EdgeInsets { get }
    /// anchorPreference 수식어를 이용해 제공된 좌표나 프레임을 GeometryReader의 좌표계를 기준으로 다시 변환하여 사용하는 첨자
    public subscript<T>(anchor: Anchor<T>) -> T { get }
}

A proxy for access to the size and coordinate space (for anchor resolution) of the container view.

→ container View의 크기 및 좌표공간(앵커 해상도)에 대한 액세스 프락시

→ 두 개의 프로퍼티와 하나의 메서드 하나의 첨자를 제공하여 GeometryReader의 Layout 정보를 자식 View에 제공할 수 있음

 

예시

GeometryReader{ geometry in
    Text("Geometry Reader")
        .font(.largeTitle).bold()
    // position은 View의 center 위치를 지정하는 수식어
    // x : GeometryReader의 width의 절반
    // y : 상단 SafeAreatInset의 크기
        .position(x: geometry.size.width / 2,
                  y: geometry.safeAreaInsets.top)

    VStack{
        Text("Size").bold()
        // GeometryReader의 width
        Text("width : \(Int(geometry.size.width))")
        // GeometryReader의 height
        Text("height : \(Int(geometry.size.height))")
    }
    .position(x: geometry.size.width / 2,
              y: geometry.size.height / 2.5)

    VStack{
        Text("SafeAreaInsets").bold()
        // top SafeAreaInsets 크기
        Text("top : \(Int(geometry.safeAreaInsets.top))")
        // bottom SafeAreaInsets 크기
        Text("bottom : \(Int(geometry.safeAreaInsets.bottom))")
    }
    .position(x: geometry.size.width / 2,
              y: geometry.size.height / 1.4)
}
.font(.title)
.frame(height: 500) // height 500으로 고정
.border(Color.green, width: 5) // border

결과

 

CoordinateSpace

A resolved coordinate space created by the coordinate space protocol.

→ 좌표 공간 프로토콜에 의해 생성된 분해된 좌표 공간

→ Geometry Proxy는 frame에 대한 정보를 제공, 단순하게 CGRect 값을 전달하는 것이 아닌

enum CoordinateSpace 타입이 세 가지 중 하나를 지정하면 그 좌표 공간에 관한 정보를 전달

구분	설명
global	화면 전체 영역(window bounds)를 기준
local	GeometryReader bounds를 기준
named	명시적으로 이름을 할당한 공간을 기준

 

---

출처

스윗한 SwiftUI (이봉원 저, 비제이퍼블릭)

GeometryReader | Apple Developer Documentation

GeometryProxy | Apple Developer Documentation

CoordinateSpace | Apple Developer Documentation