iOS 17에서의 위젯 대응

 

iOS 17에서 기존과 같이 위젯을 만들었을 때, 크게 2가지 문제점이 있다.

• 위젯 위아래의 마진으로 레이아웃 깨짐
• 디버그 모드에서 설치 안됨

 

1. 위젯 위아래의 마진으로 레이아웃 깨짐

대응을 하지 않은 경우, iOS 17에서의 위젯은 위아래로 마진이 생긴다. 그래서 기존에 설정해둔 레이아웃이 깨지게 된다.

다행히 iOS 17 이상에서 이 마진을 무시할 수 있다. Widget의 body, WidgetConfiguration에서 다음과 같이 .contentMarginDisabled()를 적용해주면 마진을 무시하게 된다.

var body: some WidgetConfiguration {
        let configuration = StaticConfiguration(kind: kind, provider: Provider()) { entry in
            RecentWidgetView(entry: entry)
        }
        .configurationDisplayName("Display Name")
        .description("Description")
        if #available(iOS 15.0, *) {
            return configuration.contentMarginsDisabled()
        }
        return configuration
    }

 

2. 디버그 모드에서 설치 안됨

디버그 모드 앱에서 위젯을 설치하려고 하면 다음과 같은 메시지가 나타나면서 위젯이 제대로 보이지 않는 이슈가 있다.

Please adopt containerBackground API

iOS 17 업데이트와 더불어 이제는 아이패드와 macOS Sonoma에도 위젯을 설치할 수 있게 됐다. 이처럼 여러 플랫폼을 지원하게 되면서 위젯의 어떤 부분이 백그라운드고 어떤 부분이 포어그라운드인지 잘 식별하고 표현하기 위해 Container background를 도입했다는 것이 애플 쪽 설명이다.

해결법은 간단하다. iOS 17 이상에서 containerBackground를 사용하는 extension 메소드를 추가해준다. .widgetBackground 안에는 배경으로 어떤 뷰가 들어갈지를 설정해주면 된다.

extension View {
    func widgetBackground(_ backgroundView: some View) -> some View {
        if #available(iOSApplicationExtension 17.0, *) {
            return containerBackground(for: .widget) {
                backgroundView
            }
        } else {
            return background(backgroundView)
        }
    }
}

사용할 때는 Modifier를 붙여서 사용할 수 있다.

 

 

References

• Hotfixing widgets for iOS 17: containerBackground + padding
• Adjusting Your App's Widgets to Use .containerBackground(for:)
• Widget on iOS 17 Beta device - Adopt containerBackground API