SwiftUI를 시작하며 가장 처음 만나고 가장 많이 만나는 요소 중 하나로 ContentView를 꼽을 수 있을 것 같다.
ContentView의 경우 SwiftUI 파일을 생성하자마자 등장한다.
위의 사진에서 Statistic_Temp의 경우 내가 SwiftUI 프로젝트를 생성할때 정한 이름이고 ContentView는 자동으로 생기는 SwiftUI 파일이다.
그렇다면 ContentView는 뭘까?
애플 공식 홈페이지에 나와 있는 설명은 '내가 커스텀한 컨텐트를 더한 메인 화면'이라고 볼 수 있다.
즉 아래와 같이 뜨는 내가 만든, 만들고 싶은 화면을 전부 ContentView라고 볼 수 있다.
위의 첫 프로젝트 네비게이터에서 '_____App'으로 생성된 파일을 눌러보면 아래와 같은 코드가 적혀있다.
이는 자동으로 생성되는 코드로 첫 화면이 부팅되었을 때 뜨는 화면을 나타내주기 위한 코드이다.
- import SwfitUI 는 SwiftUI 프레임워크를 적용시키겠다는 뜻이고
- @main은 @main이 적혀있는 이 지점이 앱의 entry point라는 뜻으로 쓰인다
- struct는 여러가지 속성 및 특성을 하나의 변수에 저장하여 편하게 사용할 수 있도록 하는 구조체(매개체)라고 볼 수 있다.
- 위에서는 'Statistic_Temp'App으로 명명된 앱의 시작 지점의 화면을 ContentView()에서 불러오겠다고 자동으로 선언되어있는 상황인 것이다.
- var body: some Scene에서 Scene의 경우 프로토콜(추가적으로 숙지가 필요한 개념이다. 나도 아직 완전히 이해하지 못한 부분이므로 추후 다루어 보려고한다.)을 구현하겠다고 선언한다는 뜻이다.
- 추가적으로 위에 쓰인 some의 경우 some View, some Scene 등으로 자주 쓰이는데, 이 부분도 불특정 View 프로토콜 혹은 불특정 Scene을 불러오고자 함이라는 것이다.(이 부분도 당장은 딥하게 알 필요 없을 것 같다.)
위 코드는 ContentView 파일에 HomeView라는 struct를 만들어 준 것이다.
App파일과는 다르게 위 코드에서는 ContentView struct에서 View라는 프로토콜을 호출한다.
그리고 그 뷰는 HomeView()라는 struct를 호출하게 되는데 이는 미리 적어둔 VStack과 NavigationLink가 적용된 NavigationView 화면을 띄우게 된다.
- NavigationView의 경우 애플 문서에서의 정의와 같이, 가시성있는 네비게이션 경로를 제공하는 화면들이 스택으로 구성되어 보여지는 화면을 말한다. 처음엔 좀 어렵게 느껴지는데 결국 화면과 화면사이에 연결을 시켜줄 수 있는 화면으로 지정한다고 보면 된다.
- 그리고 그 연결에 detail을 추가하는 것이 NavigationLink이다.
- 위 코드에서는 네비게이션 링크와 텍스트를 VStack으로 감싼뒤 Text를 눌렀을 경우 StatisticTabView()라는 화면으로 이동할 수 있도록 코딩한 사례이다.
- navigationBarBackButtonHidden은 '첫 화면'에서 지정한 화면의 명칭을 '다음 화면'에서 Back이라는 버튼으로 대신하느냐 대신하지 않느냐의 차이를 나타낸다고 보면 된다.
결국 아래와 같이 '통계 보러가기'라는 Text를 클릭시 StatisticTabView로 넘어가게 되고 그 전에 정의해놓은 StatistivTabView가 화면에 뜨게된다. 이 화면에 쓰인 디테일한 부분들을 나중에 다루고자 한다.
간단하게 마무리를 짓자면, iOS 초보자 입장에서 ContentView는 내가 만들 앱 화면이라고 생각하면 편하다. 그리고 그 앱 화면에는
- 화면과 화면을 연결해주는 NavigationView & NavigationLink가 있고
- struct 구조를 이용하여 화면을 불러오거나
- stack 구조를 이용하여 화면의 요소들을 구성한다
- barBackButton이 히든되면 첫 화면의 화면명 대신 Back이라는 명칭이 뒤로가기 버튼에 고정적으로 네이밍된다.
이러한 기본적인 특징들을 알고 있으면 편할 것 같다.