[공식문서][SwiftUI] SwiftUI에 대하여 (부제: App 프로토콜)

Uno·2021년 10월 1일
1

SwiftUI

목록 보기
1/30

(이미지출처 : https://unsplash.com/photos/l0j2SGtHe4w?utm_source=unsplash&utm_medium=referral&utm_content=creditShareLink)!
선언형을 상징...


요즘 가장 큰 관심사가 RxSwift / Combine 그리고 SwiftUI 입니다. 관심 있는 이유는 여러가지가 있겠지만, 프로젝트가 커질수록 위 라이브러리가 정말 큰 도움이 되더라구요. (코드 가독성 짱장 + 뭔가 신기술을 배울 때 희열)
그리고 SwiftUI 는 프레임워크죠. SwiftUI로 UI를 짜다보면, UIKit에서 문제해결하는 방식이랑 조금 다른 방식으로 사고하게 됩니다. 그 방식자체가 즐겁더라구요^^

앞으로 조금씩 공식문서를 이해하면서 전체적인 시스템을 잡고, 구체적인 구현방법으로 넘어갈까합니다.




SwiftUI에 대하여

공식문서 링크 : Apple Developer Documentation

Declare the user interface and behavior for your app on every platform.
-> 모든 플랫폼에서 앱의 사용자 인터페이스와 동작을 선언합니다.


음..

동작을 선언 한다.?

그리고 모든 플랫폼 …??


뭔가 생소하기도하고 익숙하기도 하죠. SwiftUI는 그 유명한 선언형 프로그래밍 프레임워크 입니다. 그리고 SwiftUI에서 UI 개발의 대통합을 이뤄냈죠. ~~마치 아인슈타인이 대통합이론을 만들려고 한 것처럼..~~

그렇다고 한 번 만들면 모든 플랫폼에서 완벽하게 대응하진 않습니다. 조금씩 손을 봐주긴 해야하지만, 이전보다 편한건 사실이죠. 머지않아 SwiftUI만 공부한 iOS 개발자들이 나타날 날이 머지않았습니다.
나 때는 말이야 UIKit으로 한땀한땀 만들었어…


공식문서를 좀 더 보겠습니다.

UI 프레임워크에서 제공하는 기본적인 것들은 생략하고 특징위주로 설명할게요!

앱의 구조를 App protocol 을 이용해서 정의합니다. 그리고 사용자가 볼 UI인 View를 포함한 Scene을 생성합니다.

Scene은 UIKit을 공부해보신 분이라면 이미 아실 겁니다. Xcode 프로젝트를 생성하면 SceneDelegate 있죠? 관련 글은 Scene 생명주기에 관한 글을 보시면 도움이 되실 겁니다.

UIKit 생명주기에서는 AppDelegate가 Class로 구성되어있고, 그곳에서 생명주기나 관련한 UIApplication 객체에 관한 컨트롤을 했다면, SwiftUI에선 변경되었습니다. 아래처럼요.

@main
struct MyApp: App {
    var body: some Scene {
        WindowGroup {
            Text("Hello, world!")
        }
    }
}

위 예제는 App protocol 에 있는 예제입니다. 말 나온 김에 App 프로토콜이 무엇인지 조금 알아보죠.


App 프로토콜

공식문서 링크 : Apple Developer Documentation

A type that represents the structure and behavior of an app.
-> 앱의 구조와 동작을 나타내기 위한 타입

말 그대로 “앱” 을 구성하고 동작시키기 위해 있는 타입(프로토콜) 입니다.
사용할 땐, 구조체에 해당 프로토콜을 채택하면 됩니다.(위에 예시처럼요.) 그리고 body는 반드시 있어야 하는 속성입니다.

그리고 @main 을 표시합니다.



Q. @main 은 뭔가요???
짧게 답변드리면, 실행파일을 만든다고 보면 됩니다.
(약간 퉁쳐서 이해하자면 C언어의 main 함수다. 라고 이해하시면 됩니다.)

@main 을 표시하면, “Top-level-code” 에 위치하게 됩니다. Top-level-code는 모든 소스파일의 코드에 접근할 수 있게 됩니다. Top-level-code 에 속한 모듈들은 다음과 같습니다.

  • main 관련된 속성
  • NSApplicationMain 속성
  • UIApplicationMain 속성
  • main.swift 속성
  • 기타 등등… (?)

공식문서 링크 : Attributes — The Swift Programming Language (Swift 5.5)




본론으로 돌아와서,

SwiftUI로 프로젝트를 구성하게 되면, “앱의 시작점” 을 나타내야겠죠. 그래서 “@main” 을 구조체 선언 앞에 붙이는 겁니다. 그러면 사용자들이 이렇게 생각하겠죠?

아! 여기가 앱이 시작하는 시작점이구나!?
(앱의 시점은 앱의 파일들 중에서 단 1개 만 가질 수 있습니다.) 너무 당연한가요?

그리고 프로토콜 “App” 을 채택함으로써, main() 에 대한 기본 메소드들을 제공받을 수 있겠죠.



그리고 App프로토콜을 채택한 구조체 안에는 Scene 을 채택한 프로퍼티를 구성합니다.
아래 코드처럼요!

@main
struct Mail: App {
    var body: some Scene {
        WindowGroup {
            MailViewer()
        }
        Settings {
            SettingsView()
        }
    }
}



Scene을 왜만들어야해요?
Scene이 있어야 사용자에게 보여줄 화면을 구성할 수 있습니다. (왜냐구요? 애플이 그렇게 만들었어요.)

UIKit과 동일하게 Scene은 각각 구성할 수 있구요. 각각의 생명주기가 있습니다. 그에 따라 생성되고 소멸되고 하죠.
(코드를 보시면, Scene을 채택한 body 프로퍼티 안에 두 개의 객체가 있죠?)

SwiftUI에서는 일반적인 UI를 위한 Scene 혹은 Setting을 위한 Scene 등 이미 구성해놓은 Scene들이 있습니다. 물론 우리 마음대로 만들 수 있는 Scene을 생성할 수도 있겠죠.

그리고 앱 프로젝트의 시작점인만큼, 가장 넓은 범위에 속하죠. 그래서 앱 내에서 사용되는 데이터나 모델에 관해서 이곳에서 주고받을 수도 있습니다. 아래 코드처럼요
(이 부분은 추후에 @State, @binding, @publish 쪽 공부하면서 다시 다룰 예정입니다.)

@main
struct Mail: App {
    @StateObject private var model = MailModel()


    var body: some Scene {
        WindowGroup {
            MailViewer()
                .environmentObject(model) // Passed through the environment.
        }
        Settings {
            SettingsView(model: model) // Passed as an observed object.
        }
    }
}



글을 쓰다보니 SwiftUI에대해서 작성하지 않고 App 프로토콜에 대해서 작성했네요.
사실 SwiftUI에 자체에 대한 글은 많이 있기도하고, 읽는다고 프로그래밍할 때, 생긴 궁금증을 해결해주진 못하더라구요^^ 변명변명

이번 글은 여기까지 작성하겠습니다.





추후에 글은
App Structure and Behavior 에 대해서 작성해볼게요!
공식문서 링크 : Apple Developer Documentation

profile
iOS & Flutter

1개의 댓글

comment-user-thumbnail
2022년 10월 6일

SwiftUI에 관한 글 감사합니다.
잘 읽히는 글이라 도움이 많이 됩니다.

답글 달기