iOS Widget - 위젯 파일 구조 파악(1) - Widget

위젯 생성되는 파일중에 Widget에 들어가면

struct widgetWidget: Widget {
    let kind: String = "widgetWidget"

    var body: some WidgetConfiguration {
        StaticConfiguration(kind: kind, provider: Provider()) { entry in
            widgetWidgetEntryView(entry: entry)
        }
        .configurationDisplayName("My Widget")
        .description("This is an example widget.")
        .supportedFamilies([.systemSmall,.systemMedium,.systemLarge,.accessoryCircular,.accessoryInline,.accessoryRectangular])
    }
}

와 같이 생기는 구조체가 있을겁니다. 이 구조체를 분석해보겠습니다.

전형적인 SwiftUI 구조를 따라가고 있습니다.

Widget 의 내부에 들어가보면

public protocol Widget {

    /// The type of configuration representing the content of the widget.
    ///
    /// When you create a custom widget, Swift infers this type from your
    /// implementation of the required ``Widget/body-swift.property`` property.
    associatedtype Body : WidgetConfiguration

    /// Creates a widget using `body` as its content.
    init()

    /// The content and behavior of the widget.
    ///
    /// For any widgets that you create, provide a computed `body` property that
    /// defines the widget as a composition of SwiftUI views.
    ///
    /// Swift infers the widget's ``SwiftUI/Scene/Body-swift.associatedtype``
    /// associated type based on the contents of the `body` property.
    var body: Self.Body { get }
}

라는 프로토콜을 채택하고 있습니다.

WidgetConfiguration의 내부도 들어가보면

/// A type that describes a widget's content.
@available(iOS 14.0, macOS 11.0, watchOS 9.0, *)
@available(tvOS, unavailable)
public protocol WidgetConfiguration {

    /// The type of widget configuration representing the body of
    /// this configuration.
    ///
    /// When you create a custom widget, Swift infers this type from your
    /// implementation of the required `body` property.
    associatedtype Body : WidgetConfiguration

    /// The content and behavior of this widget.
    var body: Self.Body { get }
}

로 되어있네요.. 더이상 코드로는 추적이 불가능해보입니다.

다시 코드로 돌아와보면 StaticConfiguration의 구조체를 body에서 생성하는데

내부로 들어가보면

public struct StaticConfiguration<Content> : WidgetConfiguration where Content : View {

    /// The content and behavior of this widget.
    public var body: some WidgetConfiguration { get }

    /// The type of widget configuration representing the body of
    /// this configuration.
    ///
    /// When you create a custom widget, Swift infers this type from your
    /// implementation of the required `body` property.
    public typealias Body = some WidgetConfiguration
}

여기서 WidgetConfiguration 프로토콜을 채택하네요.

그 밑에 init 이 나오는데

extension StaticConfiguration {

    /// Creates a configuration for a widget, with no user-configurable
    /// options.
    /// - Parameters:
    ///   - kind: A unique string that you choose.
    ///   - provider: An object that determines the timing of updates
    ///     to the widget's views.
    ///   - content: A view that renders the widget.
    public init<Provider>(kind: String, provider: Provider, content: @escaping (Provider.Entry) -> Content) where Provider : TimelineProvider
}

위의 방식을 이용해서 init 을 해준것이였네요.

파라미터를 해석해보면 kind는 위젯 고유의 id 라고 생각하면 될것같습니다.

provider는 어떠한 시간과 정책을 가지고 공급할지에 대한 규칙을 정한 구조체라고 보시면 됩니다.

content는 시간과 정책을 가지고 그릴 뷰 입니다.

그 외로 WidgetConfiguration에 추가적인 함수들이 있는데

대표적으로 쓰이는것에 대해 설명해보겠습니다.

.configurationDisplayName("청취 활동") // 위젯 추가시에 상단 제목
.description("현재 재생 중인 노래를 확인하고 최근 들은 음악에 빠르게 접근할 수 있습니다.") // 부연 설명
.supportedFamilies([.systemSmall,.systemMedium,.systemLarge,.accessoryCircular,.accessoryInline,.accessoryRectangular]) // 추가할 위젯 종류

위와 같이 표현이 가능합니다.

supportedFamilies는 버전, os별로 구별이 가능하게 할수 있습니다.

static var supportedFamilies: [WidgetFamily] {
        var families: [WidgetFamily] = []

        #if os(iOS) || os(watchOS)
        // Common families between iOS and watchOS
        families += [.accessoryRectangular, .accessoryCircular, .accessoryInline]
        #endif

        #if os(iOS)
        // Families specific to iOS
        families += [.systemSmall]
        #endif

        return families
    }

이런 식으로 변수로 선언해서

.supportedFamilies(supportedFamilies)

이렇게 사용도 가능합니다.