본문 바로가기

iOS/학습정리

SwiftUI) Widget - (2) How Widget Works

이번 글은 iOS 14부터 추가된 Widget과 관련된 시리즈 글 중 두 번째 글입니다. 앞의 SwiftUI) Widget - (1) Meet Widget도 읽어보시길 추천드립니다. 글에 오류가 있거나 궁금한 점이 있으시면 언제든 댓글 남겨주세요. 감사합니다:)

SwiftUI와 Widget

위젯의 목표 중 하나는 멀티플랫폼 지원을 하면서, 개발자들이 쉽게 iOS, iPadOS, macOS의 여러 플랫폼을 쉽게 다룰 수 있도록 하는 것 입니다. 이를 위해 위젯의 유저 인터페이스와 WidgetKit은 SiwftUI에 내장되어있습니다.

SwiftUI의 엄청난 강점 중 하나는 Dynamic TypeDark Mode와 같은 기능을 거의 자동으로 지원해준다는 것입니다.

Home Screen과 Widget

위젯을 메인 홈 스크린에 두는 것은 강력한 영향력을 가집니다.

사람들은 홈 스크린을 스쳐 지나가듯 보지만 하루에 평균 90번 이상 홈 스크린을 봅니다. 따라서 위젯을 봤을 때 그 즉시 glaceable해야 합니다. 유저가 보고있는 순간에 로딩 스피너가 돌고 있으면 안된다는 말입니다.

loading

Complications

Complications는 애플 워치의 화면 중 사용자가 배치한 작은 인터페이스 요소를 말합니다. ClockKit 프레임워크에서 다뤄지는 개념으로 watchOS 관련 개발을 할 때 사용합니다.

Complication은 사용자가 손목을 들 때 마다 볼 수 있도록 시각적으로 관련있는 정보를 표시합니다. 중요한 정보를 제공해주면서 탭 한 번으로 앱의 원하는 뷰를 이용할 수 있도록 합니다.

모든 워치는 적어도 하나 이상의 complications를 표시할 수 있고, 4개 이상을 표시하기도 합니다.

watchOS-complications

watchOS의 Complications도 비슷한 목표로 디자인되었으므로, complications의 내장 방식에서 영감을 얻었습니다. 즉, WidgetKit extensions는 타임라인에 있는 일련의 뷰 hierarchies를 반환하는 background extensions라는 것입니다.

Timeline

SwiftUI의 선언적 특성을 이용하여 타임라인에 여러 뷰를 패키징한 다음 홈 스크린으로 보낼 수 있습니다. 그러면 타임라인에 따라 적절한 시간에 원하는 뷰가 보여질 수 있습니다. 이렇게 하면 전체를 런치하지 않고 타임라인에 따라 로드한 다음에 보여줍니다. 이로서 위젯은 즉시 glanceable합니다.

Timeline 참고

뷰가 미리 준비되어 있다는 것은 시스템의 다른 영역에서도 재사용할 수 있음을 의미합니다.
예를 들어, 위젯 갤러리에서 위젯을 추가할 때 위젯 갤러리에서는 위젯이 홈스크린에서 어떻게 보여질지 그대로 프리뷰로 볼 수 있습니다.

widget_gallery 2

타임라인은 메인 앱에서 갱신할 수 있습니다. 메인 앱이라 하면, 위젯을 눌렀을 때 실행되는 앱을 말합니다. 예를 들어, 앱에서 무언가 변경되면 위젯도 최신 상태로 갱신될 수 있습니다. 또는 extension을 통해 갱신을 요청할 수도 있습니다. 따라서 캘린더 위젯이 그날의 모든 이벤트와 해당 이벤트가 언제 일어날지를 알 수 있습니다. extension은 이러한 정보를 통해 언제 다음 미팅이 예정되어 있는지 등에 대한 알맞은 뷰를 렌더할 수 있습니다.

캘린더 앱을 예로 들어보면 위의 과정 이후에 API를 통해 새로운 타임라인을 다시 로드할 수 있습니다. 이러한 과정은 extension을 활성화하여 새로 업데이트 된 타임라인을 반환하도록 합니다.

참고

'iOS > 학습정리' 카테고리의 다른 글

SwiftUI) Widget - (3) Timeline  (0) 2021.02.28
iOS) Intents  (0) 2021.02.28
SwiftUI) Widget - (1) Meet Widget  (0) 2021.02.28
iOS) UIResponder와 Responder Chain  (0) 2021.02.10
iOS) Core Data  (2) 2021.02.02