動画や音声の再生は、エンタメ系アプリや教育系アプリなどで頻出するニーズです。しかし、Flutterでメディア再生をしようとすると、いくつかの課題があります。
- 使い方が難しい / 冗長な実装が必要
- AndroidとiOSで挙動が違う
- ライフサイクルやストリーミング対応が煩雑
こうした悩みをシンプルに解決できるのが、今回紹介する「av_media_player」です。
av_media_playerとは?
av_media_player
は、Flutterでシンプルかつ柔軟に動画・音声を再生できるメディアプレイヤーパッケージです。
主な特徴:
- 動画・音声両方に対応(
AVPlayerController
ベース) - ネットワーク / ローカル / アセット再生に対応
- 再生・一時停止・シークなど基本操作を簡単に
- iOSとAndroidのネイティブAPIを活用した安定した再生処理
- シンプルなコントローラ設計で使いやすいUI統合も可能
Flutterで「ちょうどいい」メディア再生をしたいときに最適な選択肢です。
インストール方法
まずは pubspec.yaml
に依存関係を追加します。
dependencies:
av_media_player: ^0.0.4 # 最新版は pub.dev を確認
基本の使い方
1. プレイヤーコントローラーの作成
import 'package:av_media_player/av_media_player.dart';
final playerController = AVPlayerController.network(
'https://example.com/video.mp4',
);
ネットワーク・アセット・ローカルファイルもサポート:
AVPlayerController.asset('assets/videos/sample.mp4');
AVPlayerController.file(File('path/to/local/video.mp4'));
2. プレイヤーウィジェットで表示
AVPlayer(
controller: playerController,
autoPlay: true,
looping: false,
);
これだけで動画再生が即座に可能になります。
3. 再生・一時停止・シーク制御
playerController.play();
playerController.pause();
playerController.seekTo(Duration(seconds: 30));
状態取得もできます:
playerController.value.isPlaying;
playerController.value.duration;
カスタムUIと組み合わせる
例えば、簡易的なプレイヤーコントロールUIを作ることも可能です。
Column(
children: [
AVPlayer(controller: playerController),
Row(
children: [
IconButton(
icon: Icon(Icons.play_arrow),
onPressed: () => playerController.play(),
),
IconButton(
icon: Icon(Icons.pause),
onPressed: () => playerController.pause(),
),
],
),
],
);
UI部分は自由にカスタマイズできるので、デザインに合わせたプレイヤーUIの構築も簡単です。
音声再生にも使える
音声ファイルの再生にも対応しており、autoPlay: true
にするだけでBGMやポッドキャストアプリのような機能が実現できます。
final audioController = AVPlayerController.network('https://example.com/audio.mp3');
注意点と補足
- iOSではInfo.plistの設定が必要になることがあります(ストリーミング許可など)
- Androidでのローカルファイル再生は
permission_handler
等と併用推奨 - バージョンがまだ若いため、機能の拡充やバグ修正も随時チェックが必要です
まとめ
av_media_player
は、Flutterでの動画・音声再生を最小限のコードでシンプルに実現できるパッケージです。
特に以下のようなケースに向いています:
- ネットワーク動画のストリーミング再生が必要なアプリ
- 動画・音声の再生機能だけを手早く組み込みたい
- UIや状態制御は自分で設計したいが、再生エンジン部分はお任せしたい
Flutterでメディア機能を手軽に実装したいなら、ぜひav_media_player
を一度試してみてください。
ご希望があれば、「再生位置に応じてUIを動的に変えるTips」や「動画終了後に自動で次の動画を再生するプレイリスト実装」などもご紹介できます。お気軽にご相談ください。