🎥

【Swift】SwiftUI で動画が表示できない時の対処法

2023/11/07に公開

初めに

SwiftUI で動画を再生するためのビューを作成しようとする際、動画が読み込まれず再生できないという問題が発生したため、解決方法を共有します。

記事の対象者

  • Swift 学習者
  • SwiftUI で動画のプレイヤーを実装したい方

再現

コード

今回実装したのは以下のコードです。

MovieView
import SwiftUI
import AVKit

struct MovieView: View {
    private let player: AVPlayer
    @State var isPlaying: Bool = false

    init() {
        if let url = Bundle.main.url(forResource: "Sample", withExtension: "mp4") {
            player = AVPlayer(url: url)
        } else {
            player = AVPlayer(url: URL(fileURLWithPath: ""))
            print("file does not found")
        }
    }
    
    var body: some View {
        VStack {
           VideoPlayer(player: player)
           Button {
               isPlaying ? player.pause() : player.play()
               isPlaying.toggle()
               player.seek(to: .zero)
           } label: {
               Image(systemName: isPlaying ? "stop" : "play")
                   .padding()
           }
        }
        .onDisappear(perform: {
            player.pause()
        })
    }
}

まずは Sample.mp4 という動画ファイルをルートに追加します。
次に MovieViewplayer 変数に AVPlayer を指定し、init() で動画のファイル名と拡張子を設定することで動画のプレイヤーを作成しています。

課題

上記のコードを実行するとエラーは起きずビルドは成功するものの、以下の画像のように動画が再生できない状態になってしまいます。
fail_img

原因

表示させたい動画を選択し、右側のサイドバーを見ると、赤く囲んだ部分の Target Membership > VisionMyGallery (プロジェクト名) にチェックが入っていないことがわかります。動画が読み込まれない原因がこの部分です。
※本筋とは関係のない部分はグレーに塗りつぶしています。
cause_img

解決

上記の「Target Membership」にチェックを入れてビルドすることで正常に表示されるようになるかと思います。

まとめ

今回の問題はそもそもターゲットに入っていないために読み込むことができないという非常にシンプルなものでした。しかし、普段は右側のサイドバーは非表示にして開発しているため気づくのに時間がかかってしまいました。同じ問題に悩んだ方の助けになれば幸いです。

Discussion