[iOS] WidgetKit[1] - 개념 및 기본, WidgetConfiguration

2022년 7월 18일에 작성됨

 

애플을 사용하면 widget은 정말 유용하게 사용합니다. 그래서 프로젝트에 한번 추가해서 사용해 보며 공부해보려 합니다.

아마 widget 관련해서 짧으면 2개 많으면 3~4개 정도에 나누어서 글을 작성할 예정입니다.

WidgetKit

SwiftUI용 Widget API 및 WidgetKit 프레임워크를 사용하여 손쉽게 위젯을 빌드하고 iOS, iPadOS 및 macOS 어디에서나 사용할 수 있습니다.

 

widget은 app extension을 사용해서 만듭니다. App Extension Programming Guide 에는 app과 app extension 사이의 관계에 대해 자세하게 설명하는데 그림을 보면 알 수 있듯, 기본적으로 app과 app extension는 각각 따로 container를 가지고 있습니다.

따라서 둘 사이의 데이터 공유는 기본적으로 이루어지지 않습니다.

만약 데이터를 공유하려고 하면 그림 가운데에 보이는 shared container를 사용해야 합니다. 그 내용은 뒤에서 예시와 함께 설명할 예정입니다.

Widget 만들기

이제 기본 개념을 알았으니 간단한 widget을 한번 만들어 보겠습니다.

 

File - Target - Widget Extension으로 추가해 주세요.

 

Product Name을 작성해 주시고 Include Configuration Intent 부분을 체크하면 IntentConfiguration을 사용한다는 뜻이고 체크하지 않으면 StaticConfiguration을 사용하게 됩니다.

 

IntentConfiguration

공식문서를 보면 사용자 지정 의도 정의를 사용하여 사용자 구성 가능한 옵션을 제공하는 위젯이다.라고 적혀있습니다.

간단히 설명하면 사용자가 구성할 수 있는 프로퍼티가 존재하는 위젯입니다. 예를 들면 날씨 위젯이나, 미리 알림 위젯 요런 게 존재합니다.

 

StaticConfiguration

공식문서를 보면 사용자가 구성할 수 있는 옵션이 없는 위젯이다.라고 적혀있습니다. IntentConfiguration 랑은 정반대입니다.

사용자가 따로 위젯에 어떤 행동을 할 수 없고 단지 보는 것 밖에 못하는 위젯입니다. 예를 들면 뉴스, 주식, 활동 위젯이 있습니다.

 

캘린더는 위젯 편집을 통해 어떤 행동을 할 수 있지만, 헤드라인은 어떤 행동을 할 수 없습니다.

따라서 캘린더는 IntentConfiguration, 헤드라인은 StaticConfiguration 입니다.

 

저는 체크를 해제하고 StaticConfiguration 위젯으로 만들겠습니다.

 

그럼 SwiftUI로 구성된 위젯파일이 만들어집니다.

빌드를 해보면 요렇게 현재 시간이 들어가 있는 위젯이 보이면 성공입니다.

구성요소

 

StaticConfiguration는 3가지를 넘겨주는데 하나씩 살펴보겠습니다.

 

kind

위젯을 식별하는 문자열입니다. 애플 문서는 "com.mygame.game-status"으로 Bundle Identifier를 쓰는 거 같습니다. Bundle Identifier이 아니더라도 본인만의 고유한 문자열을 사용해 주세요.

 

provider

위젯을 새로고침할 타임라인을 결정하고 생성하는 객체입니다. 위젯 업데이트를 위한 시간을 지정해 주면 알아서 그 시간에 맞춰서 업데이트를 시켜준다고 합니다.

 

content closure

이 클로저에는 widget을 렌더링 하는 SwiftUI View 코드가 포함되어 있습니다. 그리고 TimelineEntry 매개변수를 전달하는데 예제에서는 SimpleEntry를 전달하게 됩니다. 그리고 넘어온 데이터를 이용해서 View를 구성하면 됩니다.

 

configurationDisplayName

위젯을 추가/편집할 때 위젯에 표시되는 이름을 세팅하는 메서드입니다.

description

위젯을 추가/편집할 때 위젯에 표시되는 설명 부분을 세팅하는 메서드입니다.

 

"My Widget" - configurationDisplayName
"This is an example widget." - description

 

supportedFamilies

위젯이 지원하는 크기를 설정할 수 있는 메서드입니다. 만약 .systemSmall 하나만 등록하면

요렇게 선택할 수 있는 게 제일 작은 위젯밖에 없는 위젯이 만들어집니다.

 

이번엔 간단하게 위젯을 만들고 기본적은 메서드들을 한번 정리해 봤습니다. 다음에는 더 자세한 내용들을 다뤄볼게요!