* 공부했던 내용을 주관적으로 해석하여 '제가' 이해하기 쉽도록 작성하였습니다. 잘못된 정보가 있을 시 알려주시면 제게 큰 힘이 됩니다!
메크로도 어느정도 마무리 되었겠다,
초심으로 돌아와서 SwiftUI의 가장 기초인 구조부터 다시 뜯어보기로!
(사실 메크로 오늘 끝남)
Section 1. [ Exploring the structure of a SwiftUI app ]
import SwiftUI // 1단계
@main // 2단계
struct MyApp: App { // 3단계
var body: some Scene { // 4단계
WindowGroup { // 5단계
ContentView() // 6단계
}
}
}
1 단계
SwiftUI의 기호 및 기능에 액세스하기 위해 앱은 import선언을 사용하여 SwiftUI 프레임워크를 가져옵니다.
2 단계
SwiftUI 앱의 진입점(앱의 시작)을 나타내기 위해 샘플에서는 @main앱 구조에 특성을 적용합니다.
- @main은 앱에서 하나만 적용할 수 있음
3단계
Struct는 프로토콜을 준수하며 앱의 콘텐츠와 동작을 제공합니다.
4단계
구조는 프로토콜 body의 요구 사항인 계산된 속성을 구현합니다.
- Scene에는 사용자 인터페이스를 정의하는 계층구조가 포함되어 있다.
- SwiftUI가 제공하는 씬들 : WindowGroup, Window, DocumentGroup, Settings
5단계
만들려는 앱에 맞는 그룹을 사용해야한다,
예를들어, 문서편집기 등 같은 것들을 만들려면 DoucumentGroup 사용
6단계
장면에는 이미지와 텍스트로 구성된 뷰 계층 구조를 생성하는 사용자 정의 뷰인 가 포함되어 있습니다.
Section 2. [ Content view ]
SwiftUI 에서는 앱이 사용자 인터페이스로 표시하는 view hierarchy가 포함되어 있습니다.
view hierarchy는 레이아웃을 정의하는 역할을 한다.
예를들어 WindowGroup에는 다른 뷰들을 구성하는 ContentView가 view hierarchy에 포함되어있다.
<< 연 습 ! >>
import SwiftUI // 1단계 : SwiftUI Framework 삽입하기
struct ContentView: View { // 2단계 : ContentView는 View의 프로토콜을 따른다.
var body: some View { // 3단계 : ContentView는 body라는 계산된 프로퍼티를 가진다.
VStack { // 4단계 : 하위 뷰 들을 수직적으로 정렬하는 VStack!
Image(systemName: "globe") // 5단계 : SF Symbol를 사용하는 이미지뷰
.imageScale(.large) // 6단계 : 크기를 조정하는 View 모디파이어
.foregroundColor(.accentColor) // 7단계 : 컬러를 넣는 View 모디파이어
Text("Hello, world!") // 8단계 : Text를 표기하는 View
}
.padding() // 9단계 : VStack에 padding 모디파이어를 적용시킴
}
}
✶ 프로퍼티란?
✶ 이니셜라이저란?
이니셜라이저는 클래스, 구조체, 열거형 인스턴스를 사용하기 위해 준비 작업을 하는 단계이다. 이 단계에서 각 저장 프로퍼티의 초기값 을 설정한다. 초기화 과정은 initializer 를 정의하는 것으로 구현할 수 있다.
댓글