Youtube動画をFlutterアプリ内で表示させたいケースがあり、ライブラリから調査したので、簡単にまとめたいと思います！
結論
今回は、youtube_player_iframeを採用しました。
このライブラリであれば、動画再生に関する基本的な機能は提供してくれていると思います。
前提として
今回のケースでは以下の仕様を満たす必要がありました。
- Youtube上にアップロードされている動画が表示される
- 動画はWidgetに埋め込む形で表示できる(さらにいうとモーダル上に表示できる)
- 動画再生、一時停止、音声オンオフの切り替え、全画面表示、Youtubeへの遷移、を行うことができる
候補ライブラリたち
大きく分けて、
- ローカルファイル含め動画再生できるライブラリ
- Youtube再生に特化したライブラリ
の2つの方向性から調査し、いくつかのライブラリが候補にあがりました。
候補1:video_player
ローカルファイル含め動画再生できるライブラリ。
Flutter 公式が出しており、パッケージ内ではスター数から、動画再生系では一番メジャーなライブラリなのではないかと考え、
このライブラリを使用することを最初に検討しました。
候補2:chewie
ローカルファイル含め動画再生できるライブラリ。
video_player よりよしなにUIを実装してくれそうだが、その分カスタマイズ性は低めに感じました。
調査時点で、ライブラリの最終更新が8ヶ月前なので将来的にサポートされるか不安がありました。
候補3:better_player
ローカルファイル含め動画再生できるライブラリ。
video_player とchewie をもとに作られている？よう。
バージョンアップデートも活発な印象を受けました。スター数を比較した場合、それほど多くない。
候補4:youtube_player_flutter
Youtube再生に特化したライブラリで、特化系のなかではスター数が一番多い。
候補5:youtube_player_iframe
Youtube再生に特化したライブラリ。
youtube_player_flutterとの違いとしては以下記載されていた。
Note: This package only provides default youtube web player's skin. If you need Youtube Android player like player with gesture support, use youtube_player_flutter instead. youtube_player_flutter also uses this package as dependency. (Migration Pending)
video_player の使用を試みる!
スター数も一番多く、デファクトスタンダード感があったのでまずはこのライブラリを使用できないか調査しましたが、
Youtube上の動画表示は正式にサポートしていないようでした・・
mp4など、動画の拡張子であればインターネット上の動画は表示できるみたいです。
別途APIを組み合わせればYoutube表示は可能だったのですが、ライブラリのみで手軽に表示できる手段がないか、
調査を継続することにしました。
※今回のケースではYoutube上の動画を表示するという目的があったため、こちらのライブラリは使用しないようにしたのですが、
動画ファイルの再生、ということであればこのライブラリで実現できると考えます。
参考:
https://stackoverflow.com/questions/65038430/youtube-video-in-video-player-package
youtube_player_flutterの使用を試みる!
次に調査したのは、Youtube表示に特化したライブラリでスターが多かった、youtube_player_flutterです。
こちらを使用してYoutubeの表示は成功したのですが、調査時点でiOSで動画のフルスクリーン表示ができない仕様でした....
最終的に上述したyoutube_player_iframe を採用することで動画表示を行うようにしました。
最後に
ライブラリを使用することでシンプルに動画再生機能を実装できたので、今後も色々と使っていきたいと思います！