SwiftUI | 動画ファイルを再生する方法

音声・動画

2024.11.102024.10.15

SwiftUIで動画ファイルを再生する方法を説明する。

結論

動画ファイルのURLを取得する。動画ファイルのURLの取得方法は、動画ファイルがApp同梱のものか、ユーザーが保存したものか、Web上のものかで異なる。
1を引数にAVPlayerのインスタンスを生成する。
2を引数にVideoPlayerという動画用ビューを配置する。

具体例

earth.mp4という動画ファイルを再生するAppを作成する。

App同梱の動画ファイルを再生する場合

iOSファイルシステムのディレクトリ構成は以下のようになっている。App同梱のデータはBundle Containerに保存されている。

出典 https://developer.apple.com/library/archive/documentation/FileManagement/Conceptual/FileSystemProgrammingGuide/FileSystemOverview/FileSystemOverview.html

動画ファイルをAppに同梱するには、XcodeでTARGETS -> Build Phases -> Copy Bundle Resources を開き動画ファイルをドラッグ&ドロップする。

Copy items if needed、Create groupsをチェックしてfinish。

この動画ファイルを再生するには以下のコードを記述する。

App同梱の動画ファイルのURLを取得する。
1を引数にAVPlayerのインスタンスを生成する。
2を引数にVideoPlayerという動画用ビューを配置する。

import SwiftUI
import AVKit

struct ContentView: View {
    var body: some View {
        let ファイルURL = Bundle.main.url(forResource: "earth",
                                         withExtension: "mp4")!   // ? 1
        let avPlayer = AVPlayer(url: ファイルURL)                   // ? 2
        VideoPlayer(player: avPlayer)                              // ? 3
    }
}

ユーザーが保存した動画ファイルを再生する場合

iOSファイルシステムのディレクトリ構成において、ユーザーが保存したファイルはData Container内のDocumentsディレクトリに保存される。

Documentsディレクトリに保存された動画ファイルを再生するには、前述のコードからファイルURLを取得する部分をDocumentsディレクトリに変更すればよい。

DocumentsディレクトリのURLを取得する。
1の後ろに動画ファイル名を追加する。

import SwiftUI
import AVKit

struct ContentView: View {
    var body: some View {
        let ファイルディレクトリ = FileManager.default.urls(for: .documentDirectory,
                                                 in: .userDomainMask)[0]       // ? 1
        let ファイルURL = ファイルディレクトリ.appendingPathComponent("/earth.mp4")  // ? 2
        let avPlayer = AVPlayer(url: ファイルURL)
        VideoPlayer(player: avPlayer)
    }
}

テストのためにDocumentsディレクトリにファイルを保存したい場合は、例えばApp同梱のファイルを保存しておき、それをDocumentsディレクトリにコピーすればよい。以下はコードの一例である。このAppを起動すればDocumentsディレクトリにファイルが保存される。iPhoneからAppを削除しない限り保存したファイルは残り続けるので、1回実行したらこのコードは消してもよい。

import SwiftUI

struct ContentView: View {
    var body: some View {
        Spacer()
            .onAppear{
                let ファイルディレクトリ = FileManager.default.urls(for: .documentDirectory,
                                                            in: .userDomainMask)[0]
                let コピー先 = ファイルディレクトリ.appendingPathComponent("earth.mp4")
                let コピー元 = Bundle.main.url(forResource: "earth", withExtension: "mp4")!
                do {
                    try FileManager.default.copyItem(at: コピー元, to: コピー先)
                } catch {
                    print("error")
                }
            }
    }
}

Web上の動画ファイルを再生する場合

Web上の動画ファイルを再生するには、前述のコードからファイルURLを取得する部分をWebのURLに変更すればよい。

import SwiftUI
import AVKit

struct ContentView: View {
    var body: some View {
        let ファイルURL = URL(string: "https://なんとかかんとか/earth.mp4")!  // ? ここ
        let avPlayer = AVPlayer(url: ファイルURL)
        VideoPlayer(player: avPlayer)
    }
}