Swift TCA로 위젯 예제 개발하기

안녕하세요! 이번 블로그에서는 Swift TCA (The Composable Architecture)를 활용하여 위젯 예제를 개발하는 방법을 소개하겠습니다. 위젯은 iOS 14 이상에서 지원되는 강력한 기능으로, 사용자의 홈 화면에 앱의 정보를 간편하게 표시할 수 있게 해줍니다.

1. 프로젝트 설정 및 위젯 활성화 먼저 Xcode에서 새로운 iOS 프로젝트를 생성합니다. iOS 14 이상에서만 동작하는 위젯을 만들기 위해 프로젝트 설정에서 iOS 14 이상을 대상으로 설정합니다. 또한 위젯을 활성화하기 위해 App Groups을 설정합니다.
2. Swift TCA 설치 Swift TCA는 Swift Package Manager를 통해 쉽게 추가할 수 있습니다. Xcode에서 프로젝트를 열고, Swift TCA 패키지를 추가합니다.
3. 위젯 상태(State) 정의 Swift TCA를 사용하여 위젯의 상태를 정의합니다. 위젯은 사용자의 홈 화면에 표시되므로, 상태에는 위젯에 표시될 정보를 포함합니다.

import SwiftUI
import WidgetKit
import ComposableArchitecture

struct WidgetState: Equatable {
    var widgetData: String
}

 

 

1. 위젯 컨텐츠 뷰(View) 정의 위젯의 외관과 정보를 표시할 위젯 컨텐츠 뷰를 정의합니다. 이 예제에서는 간단히 텍스트로 상태 정보를 표시하는 위젯을 구현합니다

struct WidgetContentView: View {
    let widgetData: String
    
    var body: some View {
        Text(widgetData)
            .widgetURL(URL(string: "widget-example://open-app"))
    }
}

 

 

위젯 엔트리(Entry) 정의 위젯의 상태 정보를 업데이트하는 엔트리를 정의합니다. 위젯의 상태는 엔트리를 통해 갱신됩니다.

struct WidgetEntry: TimelineEntry {
    let date: Date
    let widgetData: String
}

 

 

리듀서(Reducer) 구현 액션과 상태를 처리하는 리듀서를 구현합니다. 리듀서는 이전 상태와 액션을 기반으로 새로운 상태를 반환하는 함수입니다.

let widgetReducer = Reducer<WidgetState, WidgetAction, Void> { state, action, _ in
    switch action {
    case let .setData(data):
        state.widgetData = data
        return .none
    }
}

 

728x90

 

 

미들웨어(Middleware) 추가 Swift TCA는 미들웨어를 통해 비동기 작업을 처리합니다. 위젯의 상태를 갱신하는 비동기 작업을 미들웨어로 처리합니다.

let widgetMiddleware: Middleware<WidgetState, WidgetAction, Void> = .init { _, action, _ in
    switch action {
    case let .setData(data):
        // 비동기적으로 위젯 상태 갱신 로직
        return .none
    }
}

 

 

위젯 프로바이더(Provider) 설정 위젯 프로바이더를 설정하여 위젯 컨텐츠와 상태를 연결합니다.

struct WidgetProvider: IntentTimelineProvider {
    func placeholder(in context: Context) -> WidgetEntry {
        WidgetEntry(date: Date(), widgetData: "Loading...")
    }

    func getSnapshot(for configuration: ConfigurationIntent, in context: Context, completion: @escaping (WidgetEntry) -> Void) {
        let entry = WidgetEntry(date: Date(), widgetData: "Snapshot")
        completion(entry)
    }

    func getTimeline(for configuration: ConfigurationIntent, in context: Context, completion: @escaping (Timeline<WidgetEntry>) -> Void) {
        // 위젯의 상태를 업데이트하고 타임라인에 반영하는 로직
        let entry = WidgetEntry(date: Date(), widgetData: "Updated Data")
        let timeline = Timeline(entries: [entry], policy: .atEnd)
        completion(timeline)
    }
}

 

 

위젯 프리뷰(Preview) 표시 위젯의 프리뷰를 표시하여 개발 중인 위젯을 미리 확인합니다.

@main
struct WidgetEntryView: Widget {
    let kind: String = "WidgetExample"

    var body: some WidgetConfiguration {
        IntentConfiguration(kind: kind, intent: ConfigurationIntent.self, provider: WidgetProvider()) { entry in
            WidgetContentView(widgetData: entry.widgetData)
        }
        .configurationDisplayName("Widget Example")
        .description("This is an example widget.")
    }
}

struct Widget_Previews: PreviewProvider {
    static var previews: some View {
        WidgetContentView(widgetData: "Preview Data")
            .previewContext(WidgetPreviewContext(family: .systemSmall))
    }
}

 

 

이상으로 Swift TCA를 활용하여 위젯 예제를 개발하는 방법을 소개했습니다. Swift TCA를 사용하면 위젯의 상태 관리와 비동기 작업 처리가 편리해집니다. 위젯을 통해 사용자의 홈 화면에 유용한 정보를 표시해보세요! 감사합니다.