안녕하세요!
날씨의 i를 출시하고, 벌써 7번째 업데이트를 했는데요,
2.1버전 업데이트 과정을 공유하려 합니다.
최근에 아이폰 15 플러스로 폰을 바꾸고 대 만족하며 즐겁게 사용하고 있었는데요!
한 가지 스트레스 받는 일이 발생했습니다!
즐겁게 폰을 세팅하면서
날씨의 i를 다운받고, 위젯을 설치했는데요!
음..?
이상하게 양쪽 사진이 잘리는 현상을 발견해서
부랴부랴 핫픽스를 하게 되었습니다!
알고보니 iOS17로 업데이트되면서
위젯API가 변경이 되었었고, 기존 코드를 수정하게 되었습니다!
역시 iOS16을 쓰던 아이폰 11에서 폰을 바꿔서 다행이지
영영 모를 뻔 했는데 다행입니다ㅎㅎ
처음에는 위젯 API가 변경된 지 모르고 단순히 패딩이나 프레임 문제일거라고 생각했습니다.
그런데 기존 코드에서 GeometryReader를 활용해서
사이즈가 다른 기기마다 잘 맞는 배경화면을 구현했었는데
코드는 괜찮은 것 같은데 어디가 문제인지 잘 모르겠더라구요
그래서 frame에 maxWidth, maxHeight를 .infinity로 줘보기도 하고,
ZStack을 .overlay로 바꿔보기도 하고
.ignoresSafeArea(),
.aspectRatio(contentMode: .fill)도 여기저기 줘보고,
이것 저것 다 해봤지만, 생각보다 저 공백이 없어지지 않았습니다..!
이것저것 수정해보다가 백그라운드 이미지에 패딩을 -18로 줘보니
사진이 가득 차긴 했지만,
내부에 구현한 패딩까지 영향을 받아서
레이아웃이 망가지는 문제가 있었습니다!
그래서 어찌어찌 내부 패딩을 수정하고
앱스토어에 업데이트를 하려고 아카이빙을 하고 있었는데
응..?
Please adopt containerBackground API 라는 처음 보는 위젯 에러가 나와서
이걸로 해결될 문제가 아니구나 하고 조금 더 자세히 찾아보게 되었습니다!
찾아보니 WWDC23에서 이미 위젯에 대한 API 발표를 했더라구요!
1분 44초 즈음부터 Transition to content margins라는 제목으로 관련 내용이 나옵니다!
WWDC영상도 아직 안 본 부분이 많은데 시간이 걸리더라도 놓치지 않고 다 찾아봐야 될거같아요!
만들면서 위젯이 safeArea가 필요있겠어..? 했는데 이렇게 보니 워치 위젯에는 확실히 필요해보이네요ㅎㅎ
https://developer.apple.com/videos/play/wwdc2023/10027/?time=180
Bring widgets to new places - WWDC23 - Videos - Apple Developer
The widget ecosystem is expanding: Discover how you can use the latest WidgetKit APIs to make your widget look great everywhere. We'll...
developer.apple.com
수정된 API를 적용해서 코드를 다시 작성했습니다.
우선 Widget의 WidgetConfiguration에서
.contentMarginsDisabled()를 적용하면
위에서 하던 고생 없이 깔끔하게 마진이 지워지게 됩니다..😅
그리고 위젯의 뷰 부분에서
이렇게 하니 기존의 ZStack과 GeomatryReader와 프레임설정 없이도 같은 화면을 구현할 수 있어서
더 편리해지고 직관적으로 바뀐 것 같습니다.
containerBackground API는 iOS17부터 적용되므로
버전 분기처리된 widgetBackground라는 함수를 extension으로 생성합니다.
이렇게 적용하면..!
플러스 화면과 기본 화면에서도 같은 레이아웃으로 예쁘게 위젯이 나오게 됩니다!
핫픽스가 생각보다 오래 걸렸지만
업데이트 하는 김에 앱스토어 이미지도 새로 예쁘게 단장해서 올렸는데 마음에 듭니다ㅎㅎ
앞으로도 꾸준히 업데이트 할 예정이니
날씨의 i 많은 사랑과 피드백 부탁드려요!
감사합니다~!
