[iOS] iOS16, 잠금화면 위젯 추가

2022년 9월 27일에 작성됨

 

오늘은 iOS16에서 지원하는 잠금화면 위젯 추가에 대해 정리하려 합니다.

[iOS] WWDC22 - Complications and widgets: Reloaded - 잠금화면 위젯에 대한 WWDC22 영상 정리내용이니 꼭 한 번씩 보고 오세요!

if iOS16 { supportedFamilies }

 

제 프로젝트에서 사용하던 위젯입니다. 이제 잠금화면 위젯을 추가해 볼까요? 기존 위젯기능을 사용하고 계셨으면 생각보다 별로 어렵지 않습니다. 저는 .accessoryInline을 제외한 .accessoryCircular, .accessoryRectangular 두 위젯을 추가해 보겠습니다.
.accessoryCircular, .accessoryRectangular은 잠금화면 위젯, iOS16에서만 지원하는 WidgetFamily입니다. 따라서 iOS16 이상 이용자와 그보다 버전이 낮은 이용자를 구분을 해야 합니다.

if #available(iOSApplicationExtension 16.0, *) {
    ...
    // iOS 16, 높은 버전 이용자
} else {
    ...
    // iOS 16, 낮은 버전 이용자
}

 

우리는 이 if, else 문장을 가지고 WidgetFamily를 다르게 설정해줘야 합니다.

...

@main
struct coupleDayWidget: Widget {
    ...

    private let supportedFamilies:[WidgetFamily] = {
        if #available(iOSApplicationExtension 16.0, *) {
            return [.systemSmall, .systemMedium, .accessoryCircular, .accessoryRectangular]
        } else {
            return [.systemSmall, .systemMedium]
        }
    }()

    var body: some WidgetConfiguration {
        ...
    }
}

...

 

iOS16 보다 낮은 버전의 이용자는 기존에 사용하던 WidgetFamily인 .systemSmall, .systemMedium만 사용하고, iOS16 보다 높은 버전의 이용자에게는 기존에 사용하던 WidgetFamily + .accessoryCircular, .accessoryRectangular 까지 사용하게 하는 겁니다. 여기까지 하면 준비는 끝났습니다.

Draw View

자 iOS16을 기준으로 WidgetFamily 세팅이 끝났으니 뷰를 그려줘야 되겠죠?? 뷰를 그리는 작업도 위와 동일하게 if, else 문장을 통해 View를 따로 그려주면 됩니다.

var body: some View {
    if #available(iOSApplicationExtension 16.0, *) {
        switch widgetFamily {
            case .accessoryCircular:
            // accessoryCircular View 코드
            ...

            case .accessoryRectangular:
            // accessoryRectangular View 코드
            ...
        }
    }
    else {
        switch widgetFamily {
            ...
        }
    }
}

 

case .accessoryCircular:, case .accessoryRectangular: 부분에 자신이 원하는 View를 작성해 주시면 됩니다. 이러면 모든 작업이 끝났습니다. 생각보다 정말 별거 없죠??

결과

 

나날이 갈수록 신기하면서 놀라운 기능들이 나오네요.. 다음 버전에는 또 어떤 기능들이 추가될지 무서우면서도 또 기대가 됩니다. 제가 틀렸거나 궁금하신 부분이 있으시면 댓글 남겨주세요 :)