로고

SwiftUI 멀티플랫폼 지원: iOS와 macOS 앱 개발

작성일 :

SwiftUI 멀티플랫폼 지원: iOS와 macOS 앱 개발

SwiftUI는 애플이 나온 최신 사용자 인터페이스 프레임워크로, 하나의 코드베이스로 iOS와 macOS 애플리케이션을 동시에 개발할 수 있는 강력한 도구입니다. iOS와 macOS는 많은 공통점을 가지지만, 디자인, 사용자 경험, 기능 요구사항 등에서 차이가 있습니다. SwiftUI의 멀티플랫폼 지원 기능은 이러한 차이를 처리하면서 통일된 코드를 작성할 수 있게 해줍니다. 이 글에서는 SwiftUI를 사용하여 멀티플랫폼 앱을 개발하기 위한 주요 개념과 단계를 알아보겠습니다.

SwiftUI의 개념

SwiftUI는 선언형 프로그래밍 패러다임을 따릅니다. 덕분에 개발자는 뷰(View)를 직접 관리할 필요 없이 상태(State)를 변화시켜 앱의 UI를 갱신할 수 있습니다. @State, @Binding, @ObservedObject와 같은 속성 래퍼(Property Wrapper)를 사용해 상태를 관리할 수 있습니다. 모든 상태 변화는 자동으로 UI에 반영되므로 코드가 간결하고 직관적입니다.

선언형 프로그래밍의 장점

  • 유지보수 용이성: UI와 상태 관리가 명확하게 구분되므로 코드를 이해하고 수정하기가 쉽습니다.
  • 반응형 인터페이스: 사용자 상호작용이나 데이터 변경에 따른 UI 갱신이 자동으로 이루어집니다.
  • 재사용성: 다양한 구성 요소를 독립적으로 설계하고 이를 재사용할 수 있습니다.

iOS와 macOS 간의 차이

iOS와 macOS는 서로 다른 사용자 경험과 인터랙션 방식을 가지므로 디자인과 구현에서 몇 가지 중요한 차이점을 고려해야 합니다. 특히, 입력 장치 (터치스크린 vs 마우스/키보드), 화면 크기 및 비율, 시스템 기능 (iOS의 다중 터치 제스처와 macOS의 메뉴바 등)의 차이가 있습니다.

iOS와 macOS에서 고려해야 할 요소

  • 터치 및 클릭 이벤트: iOS는 터치 기반, macOS는 마우스/트랙패드 기반입니다.
  • 뷰 구성 및 레이아웃: iOS는 주로 전체 화면 앱을 사용하지만, macOS는 창 기반 앱을 선호합니다.
  • 키보드 자동화 지원: macOS는 키보드 단축키와 앱 메뉴를 잘 활용합니다.

SwiftUI로 멀티플랫폼 앱 개발하기

프로젝트 설정

멀티플랫폼 지원을 위해서는 Xcode에서 'New Project'를 만들 때 'Multiplatform' 템플릿을 선택합니다. 이렇게 하면 하나의 코드베이스에서 iOS와 macOS 타겟을 동시에 관리할 수 있습니다.

  1. Xcode를 실행하고 File > New > Project를 선택합니다.
  2. 템플릿 선택 화면에서 'Multiplatform'을 선택한 후 'App'을 선택합니다.
  3. 프로젝트 이름과 기타 설정을 완료하고 'Next' 버튼을 누릅니다.
  4. 프로젝트 생성 후 기본적으로 제공되는 코드에서 iOS와 macOS용 타겟을 확인할 수 있습니다.
swift
import SwiftUI

@main
struct MultiplatformApp: App {
    var body: some Scene {
        WindowGroup {
            #if os(macOS)
            ContentView().frame(minWidth: 400, minHeight: 300)
            #else
            ContentView()
            #endif
        }
    }
}

플랫폼별 UI 분기

SwiftUI에서는 #if os(iOS), #if os(macOS) 지시어를 사용해 각 플랫폼 별로 다른 UI를 구현할 수 있습니다. 예를 들어, NavigationView는 iOS에서는 기본적으로 사용되지만, macOS에서는 NavigationView 대신 다른 UI 구성 요소를 사용할 수 있습니다.

swift
struct ContentView: View {
    var body: some View {
        #if os(iOS)
        NavigationView {
            VStack {
                Text("iOS에서 실행 중").padding()
            }
        }
        #else
        VStack {
            Text("macOS에서 실행 중").padding()
        }
        #endif
    }
}

공통 구성 요소 만들기

iOS와 macOS 모두에서 사용되는 공통 구성 요소를 만들면 코드의 중복을 줄이고 유지보수성을 높일 수 있습니다.

swift
struct SharedView: View {
    var body: some View {
        VStack {
            Text("공통 컴포넌트").padding()
            Image(systemName: "globe").resizable().frame(width: 100, height: 100)
        }
    }
}

이를 ContentView에서 호출하여 iOS와 macOS 모두에서 사용할 수 있습니다.

swift
struct ContentView: View {
    var body: some View {
        SharedView()
        #if os(iOS)
        Text("iOS 추가 구성 요소").padding()
        #else
        Text("macOS 추가 구성 요소").padding()
        #endif
    }
}

Mac 기능의 활용

일부 기능은 macOS에서만 사용 가능하므로, 이를 분기하여 구현할 필요가 있습니다. 예를 들어, 마우스 오버 이벤트와 같은 기능은 macOS 전용입니다.

swift
struct MacOnlyFeatureView: View {
    var body: some View {
        #if os(macOS)
        Text("마우스를 올려보세요").onHover { hovering in
            if hovering {
                print("마우스가 위에 있습니다")
            } else {
                print("마우스가 사라졌습니다")
            }
        }
        #else
        Text("이 기능은 macOS에서만 작동합니다")
        #endif
    }
}

마무리

SwiftUI의 멀티플랫폼 지원 기능을 통해 하나의 코드베이스로 iOS와 macOS 애플리케이션을 동시에 개발할 수 있습니다. 이 글에서는 프로젝트 설정, 플랫폼별 UI 분기, 공통 구성 요소 만들기, 그리고 macOS 전용 기능 활용 방법에 대해 다루었습니다. 이러한 개념을 바탕으로 더 나아가 각 플랫폼의 특성에 맞는 고유한 사용자 경험을 제공하는 애플리케이션을 개발할 수 있을 것입니다.