[iOS][SwiftUI] WidgetKit 알아보기 - 2. 위젯 사이즈

안녕하세요. iOSangBong입니다.

오늘은 위젯의 사이즈에 대해서 알아보겠습니다.

 

위젯을 사용하다보면 여러가지 사이즈를 볼 수 있습니다.

아이폰을 사용하면서 흔히 볼 수 있는 사이즈는

small, medium, large 사이즈가 있습니다.

 

그러나 추가적으로 패드에서 사용되는 ExtraLarge 사이즈도 있으며

잠금화면에서 사용되는 accessory 관련 사이즈도 있습니다. 

한번 천천히 알아가보도록 하겟습니다.

 

1.  supportedFamilies 선언

여러가지 사이즈를 사용하기 위해서는

supportedFamilies를 선언해줘야 합니다.

WidgetConfiguation 부분에다가 supportedFamilies를 추가해주면 됩니다.

 

여기서 WidgetFamily를 Array의 형태로 넣어줘야하는데

WigetFamily에 대해서 알아보기 위해 공식 사이트에 들어보면

https://developer.apple.com/documentation/widgetkit/widgetfamily

WidgetFamily | Apple Developer Documentation

크게 두가지로 나뉘게 되는데

첫번째 system families는 바탕화면에서 흔히 볼 수 있는 위젯의 크기로

systemSmall, systemMedium, systemLarge, systemExtraLarge가 있습니다.

 

기본 아이폰의 경우는 systemSmall, systemMedium, systemLarge

이 세가지만 사용이 가능하며 iOS 14 이상버전에서 사용가능합니다.

 

systemExtraLarge는 패드전용으로 ios 15이상에서만 사용가능합니다.

 

두번째 accessory families는 바탕화면 보다는 잠금화면, 워치에서 볼 수 있는 위젯으로

accessoryCircular, accessoryRectangular, accessoryInline

이렇게 3개가 있으며

 

전부 iOS 16이상에서 사용가능하며

accessoryCircular와 accessoryRectangular는 잠금화면에서 볼 수 있고

accessoryInline는 워치에서 볼 수 있습니다.

 

다시 본론으로 돌아와서

이런식으로 원하는 크기의 WidgetFamily를 추가해주면 됩니다.

 

2. 크기별 View 구현

supportedFamilies를 선언해주었으니 이제는 사이즈에 맞는 View를 구현해야겠죠?

 

위젯의 크기별 구현을 위해 widgetFamily environment를 View에 선언해줍니다.

그런다음 body 부분에 Switch문을 이용해서

크기별로 원하시는 View를 만들어주면 됩니다.

그 결과는 아까 보신 패드화면 처럼

사이즈 별로 크기가 달라지게 되고

위젯 안에 각각 다른 View를 넣을 수 있습니다.

 

정말 쉽게 만들 수 있는 것 같아서 매우 좋네요.

다음 편에는 위젯을 추가할때 디스플레이되는 타이틀과 설명해 대해서 연구해 오겠습니다.

 

다들 즐코딩하세요. 그럼 이만~