🎹
Youtube API, AVFoundation, SharePlay 사용
July 07, 2024
개요
지난 AVFoundation-시작하기 포스트에 이어, 직접 앱을 개발해보기로 했다.
내가 개발하기로 한 앱의 초기 요구사항은 다음과 같다.
- 앱 초기 디자인은 Youtube Music App 을 클론
- 미디어 콘텐츠는 Youtube Search API 를 사용
- AVFoundation, AVKit 등을 사용하여 미디어 플레이어 앱 개발하기
- [추가] WWDC 2023에 공개된 Share Play의 기능 추가해보기
문제 해결 과정
Draggable Sheet View 구현 과정
How to create Draggable Sheet View?
Youtube Music App 의 경우, Draggable Sheet View 가 존재한다. 그래서 처음에는 일반적인 sheet 모디파이어로는 구현할 수 없을 것이라 생각하고 DragGesture 를 추가하는 쪽으로 생각했다.
그러나 더욱 간단한 방법으로 시도해보았다.
presentationDetants 값에서 sheet view의 최소 높이와 최대 높이를 설정하는 것이다!
struct MainView: View {
@State private var showSheet: Bool = true
//...
.sheet(isPresented: $showSheet, content: {
PlayerView()
})
}
How to prevent resizing background?
여기서 하나 문제가 생겼는데, 바로 시트뷰가 올라올 때, 뒤에있는 배경이 resizing 이 되는 문제였다.
구글링 후 스택오버플로우에서 답을 찾을 수 있었다.
아마 presentation Detents 에는 임계값이 있으며, 그 임계값을 넘으면 background view 가 resizing 되는 것이 있는 것 같다.
.fraction(0.999)로 최대 높이를 설정하니 문제가 해결되었다!
How to add complex transition view?
그리고 이번에는 Youtube Music App 처럼 텍스트와 이미지에 자연스러운 transition 을 적용할 때 한 번 더 막혔다.