[iOS] Swift UI 시작하기

SwiftUI는 Swift의 힘으로 모든 Apple 플랫폼에서 사용자 인터페이스(UI)를 구축 할 수 있는 혁신적이고 특별한(exceptionally) 방법입니다. 

 

읽기 쉽고 작성하기 쉬운 선언적 Swift구문을 사용합니다. 

 

SwiftUI는 새로운 Xcode디자인 도구와 원활하게 작동하여, 코드와 디자인을 완벽하게 동기화합니다.

 

Dynamic Type, Dark Mode, Localization 및 Accessibility에 대한 자동 지원은 SwiftUI 코드의 첫 번째 라인이 이미 작성한 가장 강력한 UI 코드임을 의미합니다.

 

SwiftUI는 선언적 구문(declarative syntax)을 사용하므로, UI에서 수행해야 할 작업을 간단하게 지정 할 수 있습니다.

예를들어, 텍스트필드로 구성된 list를 작성한 다음, 각 필드의 정렬, 글꼴 및 색상을 설명 할 수 있습니다. 코드는 그 어느때보다 간단하고 읽기 쉬워, 시간과 유지보수를 줄일 수 있습니다. 

 

XCode Version 13.1

기존에 프로젝트를 생성하면 보이던 AppDelegate 와 SceneDelegate 도 보이지 않습니다.

 

ContentView 는 Simulator 를 실행하면 출력되는 View입니다.

 

import SwiftUI

struct ContentView: View {
    
    var body: some View {
        Text("Hello Swift!")
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

 

ContentView 파일을 확인하면 맨 상단 import SwiftUI를 선언하여 프레임워크를 가져오고 View를 상속받는 ContentView 구조체가 선언되어있습니다.

ContentView 내부를보면 body가 View 타입으로 선언되어있지만 some 이라는 키워드가 보입니다.  간단히 특정한 조건을 만족하는 제네릭 타입의 View라고 넘어가겠습니다.

 

Canvas

하단 ContentView_Preview는 실제 앱에는 적용되지 않지만 Xcode의 Canvas 기능을 위한 Preview Layout입니다.

상단 [Resume]버튼을 누르면 내가 만든 View를 실시간으로 확인할 수 있습니다. 이외에도 canvas에 렌더링된 view에 GUI 인터페이스를 이용해서 view를 추가할수도 있습니다.

 

 

기본 화면은 뭔가 밋밋하죠? 

여기서 변화를 주기 위해서는 스위프트는 모토대로 아주 간단한 방식을 제공합니다.

 

Text("Hello, swift!")
 .font(.largeTitle)
 .foregroundColor(.blue)
 .fontWeight(.heavy)

 

그럼 이제 본격적으로 SwiftUI를 시작해 볼까요?