❕ 챌린지를 진행하며 블로그 내용을 업데이트 하는 중입니다.
챌린지에서 필요한 live activity를 구현하며 그 과정에서 참고한 자료 배운 점을 간단히 기록한 글입니다.
목록
- live activity attributes 설정하기
- live activity 버튼으로 동작 구현하기
- live activity View 구현하기
- live activity에 이미지 나타내기
- live activity의 요소 크기 조절하기
- live activity에 progresesbar 나타내기
- live activity에 진행상황 업데이트 하기
1. live activity attributes 설정하기
ActivityKit 간단 예시
https://www.youtube.com/watch?v=AUOoalBwxos&t=327s
공식 문서로는 금방 구현하기가 어려워서 다른 예시 동영상을 보면서 하나씩 표현했다.
2. live activity 버튼으로 동작 구현하기
마찬가지로 위 동영상을 보면서 ContentView에서 live activity를 시작하고 종료하는 버튼을 만들었다.
 |  |
|---|
영상에서는 현재 deprecated인 request와 end를 사용한다. 그래서 이를 현재 버전에 맞는 형태인 content로 변경하여 적용시키는 과정을 추가로 진행했다.
test용 예시
https://github.com/treesofgroo/LiveActivityStudy/commit/987192e5585ea2d8ea1582853710b7588f0588ec
이때 만나는 에러가 하나 더 있었다.
build 할 때마다 아래 SendProcessControlEvent:toPid: encountered an error: Error... 에러가 뜨는데, 시뮬레이터는 잘 작동했다.
 |  |
|---|
이는 오른쪽 사진 속의 WidgetExtension이 자동으로 선택된 채로 build해서 생겼다. extension이 아닌 해당 앱을 선택한 후 build하면 해결된다.
4. live activity에 이미지 나타내기
live activity에 다른 뷰에서 그렇듯 Image()를 보이면 미리보기에 안 나탈 수 있다. 이유는 용량이 커서 live activity에 표현되지 않았을 확률이 높다.
Important: Static and dynamic data for a Live Activity, including data for ActivityKit updates and ActivityKit push notifications, can’t exceed a combined size of 4 KB
https://developer.apple.com/documentation/activitykit/displaying-live-data-with-live-activities
live activity는 업데이트 되는 내용이 총 4KB를 넘으면 안된다고 한다. 그러므로 이미지를 나타내고 싶어도 원본이 아닌 용량 압축 혹은 사이즈를 줄여 4KB 이하의 이미지를 Assets에 추가하고 활용해야 한다.
5. live activity의 요소 크기 조절하기
참고로 live activity에 나타나는 대부분의 요소는 크기를 별도로 지정하지 않아 화면에 따라 적절히 표현되게 하는 것이 좋다고 한다. 그래서 이미지를 HStack으로 혼자 열의 오른쪽에 배치하여 크기를 할당하거나 아래 속성을 적용해서 화면에 나타냈다.
Image("...")
.resizable()
.scaledToFit()6. live activity에 progresesbar 나타내기
이번 챌린지에서 live activity에 들어가야 하는 것들이 제한 시간, 지정한 알람 시간과 비교하여 시간이 남았는지/지났는지 이 두 가지 정보가 필수였다. 시간이 지나면 이를 위급하게 알려주고자 기존의 초록색으로 표현되던 정보를 빨강색으로 변경했다. 그리고 제한 시간은 n시간 n분 n초로 나타냈다. 텍스트뿐만 아니라 사용자의 시각적으로 변하는 요소로 분명히 활용할 수 있도록 ProgressView를 사용했다.
ProgressView 예시
https://seons-dev.tistory.com/entry/SwiftUI-ProgressView-%EC%9E%91%EC%97%85-%EC%A7%84%ED%96%89%EB%A5%A0
위 글과 공식 문서를 참고하여 total을 제한시간(예: 30분이면 60*30)으로, 1초에 value 1씩 채워지는 ProgressView를 설정했다.
❕ live activity의 minimal은 공간이 매우 협소해서 텍스트도 3글자 정도 보여주기 때문에 제한 시간을 채워지는 ProgressView로 표현하면 좋다.
7. live activity에 진행상황 업데이트 하기
timer가 작동함에 따라 지정한 알람시간에 비해 남은/지난 시간을 계산하고, 이에 따라 달라진 값(남은/지난 시간, ProgressView의 value, 이에 따른 단계)을 새로운 ContentState와 Content로 만들어 생성했던 activity를 update했다.
update 공식 문서
https://developer.apple.com/documentation/activitykit/activity/update(_:)
