Exploring the structure of a SwiftUI app

• SwiftUI 앱을 구성하는 원칙은 App, Scene, View 프로토콜이다.
• Entry point
  • swiftUI 앱에서 엔트리 포인트는 @main 애트리뷰트로 구분한다.
  • 앱은 단 하나의 고유한 엔트리 포인트와 main app 구조체를 가진다.
• 연산 프로퍼티 body
  • body 연산 프로퍼티 구현은 App 프로토콜 채택 시 필수로 준수해야한다.
  • body는 하나 혹은 두개의 primary, secondary scene을 반환할 수 있다.
• VStack/LazyVStack
  • VStack은 자동으로 적절한 화면 구성을 할 수 있는 view를 렌더링한다.
  • 그러나 많은 수의 subview를 표시해야하는 경우엔 LazyVStack 사용을 고려하라.
  • LazyVStack은 해당 시점에서 화면에 표시되는 view들만 렌더링한다.
  • HStack/LazyHStack도 있음.
• imageScale 수정자
  • 이 수정자를 쓰면 상대적인 크기를 조정할 수 있다.
  • small, medium, large가 있음
  • 화면 공간에 따라 적절한 크기로 수정한다.
• padding 수정자
  • 상세설정이 가능하다. 구체적인 값과 4개의 가장자리 중에 어느 것에 padding을 적용할지 지정한다.

---

Specifying the view hierarchy of an app using a scene

Section 1. Add a scene to the app

• Scene

  • swiftUI에서는 view의 계층구조를 만들기 위해 몇가지 단위를 지원하는데, 그 중 하나가 Scene이다.
  • scene은 네 종류가 있다.
    • WindowGroup
      • WindowGroup은 애플 플랫폼마다 다른 동작을 보여준다. macOS와 iPadOS 하나 이상의 window를 열 수 있다. macOS에서는 여러개의 인스턴스를 하나의 탭 세트로 결합할 수 있다.
    • Window
    • DocumentGroup
      • document 기반의 앱, 이를테면 워드 프로세서나 텍스트 에디터같은,을 만들때 사용할 수 있다.
    • Settings

• TabView

  • 서로 다른 subview 간의 전환을 지원한다.
  • tableItem 수정자를 사용하여 탭에 이미지와 텍스트를 표시한다.

Section 2. Define another view hierarchy

• 플랫폼을 지정하여 다른 view hierarchy를 표현하는 방법.

Section 3. Create custom scenes

• 멀티 플랫폼 지원을 위해 여러 버전의 view hierarchy를 만드는 것은 코드 가독성을 떨어지게 하고 유지보수를 어렵게 한다.
• custom scene을 만들어 이 문제를 해결한다.

Section 4. Refactor the code to use custom scenes

• section 3에서 정의한 custom scene로 코드 리팩토링을 진행한다.

---

Maintaining the adaptable sizes of built-in views

• Label
  • 텍스트와 심볼을 동시에 쓸 때 사용하라.
• Controls
  • controlSize 수정자
    • control을 작게 혹은 크게 만든다.
  • progressViewStyle 수정자
    • linear 혹은 circular로 설정 가능하다.
    • 프로그래스 바를 표현한다.
• 사용자에게 보다 익숙한 UX를 제공하기 위해 custom view 보다는 기본 제공되는 built-in view를 사용하라.
  • Menu, Link, EditButton, ColorPicker 등
  • Controls and indicators 참고
• Images and shapes
  • Images
    • 기본적으로 Image는 본래 사이즈로 화면에 표시된다.
      • resizable, scaledToFit과 같은 수정자를 사용하여 크기를 조정한다.
    • AsyncImage
      • 서버로부터 이미지 에셋을 받아오는 경우라면 asyncimage를 사용하라.
  • Shapes
    • SwiftUI는 요소의 사이즈, 컬러 등 요소들을 바꿀 수 있게 shape와 수정자를 제공한다.
    • 배경화면, 경계와 같은 시각적 요소를 만들어내기 위해 하나 혹은 여러개의 shape 조합을 사용하라.
    • 예시
      • frame(minWidth:idealWidth:maxWidth:minHeight:idealHeight:maxHeight:alignment:) 수정자
      • foregroundColor 수정자
      • RoundedRectanble → shape
      • HStack → shape
      • aspectRatio 수정자

---

기타

• 번외..
  • For instance, in macOS and iPadOS, a person can open more than one window from the group.
    • 영문장에서 “a person”이라고 지칭하는 건 처음 보는 것 같은데..!
    • 보통 you, we, she/he 정도는 봤어도..
    • 첨봐서 남겨봄

---

참고 링크: https://developer.apple.com/tutorials/swiftui-concepts