SwiftUI View 3 (EnvironmentValue)

Updated:

🔷 EnvironmentValues

SwiftUI 에서는 뷰를 구성하는 데 필요한 각종 환경 설정과 관련된 정보를 EnvironmentValue 타입이 관리합니다

기존의 UITraitCollection 을 비롯한 colorScheme, timeZone, locale, calender, layoutDirection, sizeCategory 등 나눠졌는데 SwiftUI 에서는 EnvironmentValue 하나에 모두 담아서 쉽게 접근 및 관리할 수 있습니다.

이러한 EnvironmentValue 는 프레임워크에 의해 별도로 관리되고 있으므로 어떤 뷰에서든 접근할 수 있는데, 얻게 되는 값은 상위 계층의 뷰가 가진 환경 요소를 그대로 상속 받게 됩니다

🔑 단, 하위 계층에 있는 뷰에서 개별적으로 환경을 구성하였다면 그 뷰에 속한 자식 뷰들은 변경된 값을 우선하여 사용하게 됩니다

👉 environment 수식어

  • environment 수식어는 일반적인 수식어와의 가장 큰 차이점은 자식뷰에 영향을 미치느냐, 해당 뷰에만 영향을 미치느냐에 있습니다
// environment 수식어를 이용해 뷰의 특정 환경 요소에 대한 값을 덮어쓸 수 있습니다.
// 수식어가 적용된 뷰와 그 서브 트리에 일괄 반영됩니다.
var example01: some View {
  Text("Hello, SwiftUI")
    .frame(width: 100)
    .environment(\.font, .title) // 1번은 폰트를 타이트로
    .environment(\.lineLimit, 1) // 2번은 라인수를 1개로
    .environment(\.minimumScaleFactor, 0.5) // 3번은 ㅂㅍ의 크기가 텍스트에 다 담지 못할 때 원래 크기의 0.5배까지 작도록 설정

  // .environment 의 값이 중복되어 나열 될 경우 최하단에 있는 것부터 overlapping 되어 젹용 됨
}

스크린샷 2022-01-05 오후 2 23 43

  • 또한 프리뷰에서도 유용하게 활용할 수 있습니다. 동일한 ContentView 를 두개 또는 그 이상으로 나누고, 서로 다른 환경을 적용해주면 매번 다른 설정을 돌아가면 확인해 보지 ㅇ낳아도 쉽게 다양한 환경에서의 실행 결과를 볼 수 있습니다.

👉 @Environment

environment 수식어 는 뷰의 환경 요소를 변경시키기 위한 쓰기 전용의 기능이었다면, 이번에 @Environment 라는 프로퍼티 래퍼는 일기 전용으로 특정 뷰에서 EnvironmentValue 의 특정 요소를 읽어와 뷰 구성에 반양할 때 사용합니다.

예를 들어 LTR(left to Right) 언어와 (일반적인 언어), RTL(right to left) 에서 아랍어나 히브리어 처럼 다른 언어 환경에서 다르게 표형하고 싶을때 @Environment 를 사용할 수 있슴니다.

// Environment 프로퍼티 래퍼를 이용해 뷰의 특정 환경 요소에 대한 현재 값을 읽어올 수 있습니다.
struct Exampel03: View {
  @Environment(\.layoutDirection) var layoutDirection

  var body: some View {
    if layoutDirection == .leftToRight {
      return Text("Left to Right") // LTR 언어 사용 환경에서는 Left to Right 출력
    } else {
      return Text("Right to Left") // RTL 언어 사용 환경에서는 Right to Left 출력
    }
  }
}

👉 Custom Environment

  • 시스템에서 제공하는 것 외에도, 필요에 따라 앱에 필요한 환경 변수를 직접 추가해서 활용 할 수 있습니다

  • 그러기 위해선 EnvironmentKey 프로토콜을 채택한 타입을 만들고, defaultValue 타입 프로퍼티를 정의해야 합니다. defaultValue 는 해당 키에 대한 기본값으로 활용되며, 값의 타입을 결정 짓습니다

  • EnvironmentValue 타입에 실제 사용할 이름의 연산 프로퍼티를 추가 한 뒤에 getter, setter 를 정의하고, 환경 변수와 도일한 방식으로 사용이 가능합니다

// EnvironmentKey를 이용해 커스텀 환경 변수를 정의할 수도 있습니다.
struct Example04: View {
  var body: some View {
    Ch04_EnvironmentValues.MySubview()
      .environment(\.myEnvironment, 10) // myEnvironment dp 10 이라는 값을 설정
  }
}

struct MySubview: View {
  @Environment(\.myEnvironment) var myValue

  var body: some View {
    Text("\(myValue)") // 결과 10
  }
}
}

fileprivate struct MyEnvironmentKey: EnvironmentKey {
static let defaultValue: Int = 0
}
fileprivate extension EnvironmentValues {
var myEnvironment: Int {
  get { self[MyEnvironmentKey.self] }
  set { self[MyEnvironmentKey.self] = newValue }
}
}

스크린샷 2022-01-05 오후 3 16 41


🔶 🔷 📌 🔑 👉

🗃 Reference

Apple developer official docs - https://developer.apple.com/documentation/swiftui/environmentvalues

스윗한 SwiftUI - https://book.jacobko.info/#/book/1190014815

Categories:

Updated:

Leave a comment