SwiftUI에서 비디오 플레이어 사용하기: AVKit 연동

SwiftUI는 iOS와 macOS 앱을 개발하는 데 사용되는 강력한 프레임워크입니다. 비디오 플레이어를 SwiftUI에 추가하는 것은 다양한 미디어 콘텐츠를 제공하는 애플리케이션을 개발할 때 중요한 기능 중 하나입니다. 이 글에서는 AVKit을 사용하여 SwiftUI에서 비디오 플레이어를 구현하는 방법을 단계별로 설명합니다.

AVKit 소개

AVKit은 Apple이 제공하는 프레임워크로, 비디오 및 오디오 콘텐츠를 쉽게 재생하고 제어할 수 있는 기능을 제공합니다. AVKit은 SwiftUI와의 통합을 통해 사용자에게 부드럽고 일관된 미디어 재생 경험을 제공합니다. 이 프레임워크를 사용하면 개발자가 복잡한 비디오 플레이어의 기능을 직접 구현할 필요 없이 기본 제공되는 기능을 사용할 수 있습니다.

기본 설정

프로젝트 설정

먼저, 새로운 SwiftUI 프로젝트를 생성합니다. AVKit을 사용하기 위해서는 AVKit 및 AVFoundation 프레임워크를 임포트해야 합니다. 이를 위해 ContentView 파일 상단에 다음 코드를 추가합니다:

swift
import SwiftUI
import AVKit
import AVFoundation

비디오 URL 설정

비디오를 재생하려면 로컬 파일이나 원격 URL 경로를 통해 비디오의 위치를 알아야 합니다. 예제에서는 URL로 비디오를 불러오는 방법을 사용하겠습니다.

swift
let videoURL = URL(string: "https://www.example.com/video.mp4")!

비디오 플레이어 구현

이제 SwiftUI에서 비디오 플레이어를 구현하는 방법을 알아보겠습니다. 기본적으로 AVKit에서 제공하는 AVPlayer와 AVPlayerViewController를 사용합니다.

AVPlayer 생성

먼저 AVPlayer를 초기화하고 비디오 URL을 설정합니다:

swift
let player = AVPlayer(url: videoURL)

AVPlayerViewController 설정

그 다음, AVPlayerViewController를 설정하여 비디오 플레이어의 UI를 제공합니다. UIViewControllerRepresentable을 사용하여 SwiftUI에서 UIKit 요소를 활용할 수 있습니다.

swift
struct VideoPlayerView: UIViewControllerRepresentable {
    let player: AVPlayer
    
    func makeUIViewController(context: Context) -> AVPlayerViewController {
        let controller = AVPlayerViewController()
        controller.player = player
        return controller
    }

    func updateUIViewController(_ uiViewController: AVPlayerViewController, context: Context) {}
}

SwiftUI에서 사용

마지막으로, VideoPlayerView를 SwiftUI 뷰 계층 구조에 추가합니다:

swift
struct ContentView: View {
    var body: some View {
        VideoPlayerView(player: AVPlayer(url: videoURL))
            .frame(height: 300)
            .onAppear {
                player.play()
            }
    }
}

이제 ContentView가 로드될 때 비디오가 자동으로 재생됩니다. player.play() 메소드는 비디오 재생을 시작합니다.

추가 기능

재생 제어 추가

사용자가 비디오를 제어할 수 있도록 버튼과 같은 추가 UI 요소를 통합할 수 있습니다. 예를 들어, 재생 및 일시 정지 버튼을 추가하려면 다음과 같은 코드를 사용합니다:

swift
struct ControlView: View {
    @State private var isPlaying = false
    let player: AVPlayer

    var body: some View {
        HStack {
            Button(action: {
                if isPlaying {
                    player.pause()
                } else {
                    player.play()
                }
                isPlaying.toggle()
            }) {
                Image(systemName: isPlaying ? "pause" : "play")
                    .resizable()
                    .frame(width: 25, height: 25)
            }
        }
    }
}

ControlView를 ContentView에 포함시키면 재생 및 일시 정지 기능을 사용할 수 있습니다. 이렇게 하면 사용자에게 더 나은 경험을 제공할 수 있습니다.

swift
struct ContentView: View {
    let player = AVPlayer(url: videoURL)

    var body: some View {
        VStack {
            VideoPlayerView(player: player)
                .frame(height: 300)
                .onAppear {
                    player.play()
                }

            ControlView(player: player)
        }
    }
}

요약

SwiftUI와 AVKit을 사용하여 비디오 플레이어를 구현하는 방법을 설명했습니다. AVKit은 강력한 비디오 및 오디오 재생 기능을 제공하며, SwiftUI와의 통합을 통해 사용자가 쉽게 사용할 수 있습니다. 기본적인 비디오 플레이어 설정부터 재생 제어 기능까지, 이 글에서 소개한 내용을 바탕으로 더 복잡한 미디어 앱을 개발할 수 있을 것입니다.