Flutter Assets Audio Player

Flutter Assets Audio Player

๐ŸŽง assets_audio_player ๐Ÿ”Š

pub package

Play music/audio stored in assets files (simultaneously) directly from Flutter (android / ios / web).

You can also use play audio files from network using their url, radios/livestream and local files

Notification can be displayed on Android & iOS, and bluetooth actions are handled

flutter:
  assets:
    - assets/audios/
AssetsAudioPlayer.newPlayer().open(
    Audio("assets/audios/song1.mp3"),
    autoPlay: true,
    showNotification: true,
);

Flutter Assets Audio Player Flutter Assets Audio Player

๐Ÿ“ฅ Import

dependencies:
  assets_audio_player: ^1.6.0

Works with flutter: ">=1.12.13+hotfix.6 <2.0.0", be sure to upgrade your sdk

๐ŸŒ Web support

And if you wan [web support, enable web](https://flutter.dev/web) then add
“`yaml
dependencies:
assets_audio_player_web: ^1.6.0
“`

You like the package ? buy me a kofi ๐Ÿ™‚

Buy Me a Coffee at ko-fi.com

Audio Source Android iOS Web
๐Ÿ—„๏ธ Asset file (asset path) โœ… โœ… โœ…
๐ŸŒ Network file (url) โœ… โœ… โœ…
๐Ÿ“ Local file (path) โœ… โœ… โœ…
๐Ÿ“ป Network LiveStream / radio (url) โœ… โœ… โœ…
Feature Android iOS Web
๐ŸŽถ Multiple players โœ… โœ… โœ…
๐Ÿ’ฝ Open Playlist โœ… โœ… โœ…
๐Ÿ’ฌSystem notification โœ… โœ… ๐Ÿšซ
๐ŸŽง Bluetooth actions โœ… โœ… ๐Ÿšซ
๐Ÿ”• Respect System silent mode โœ… โœ… ๐Ÿšซ
๐Ÿ“ž Pause on phone call โœ… โœ… ๐Ÿšซ
Commands Android iOS Web
โ–ถ Play โœ… โœ… โœ…
โธ Pause โœ… โœ… โœ…
โน Stop โœ… โœ… โœ…
โฉ Seek(position) โœ… โœ… โœ…
โชโฉ SeekBy(position) โœ… โœ… โœ…
โฉ Forward(speed) โœ… โœ… โœ…
โช Rewind(speed) โœ… โœ… โœ…
โญ Next โœ… โœ… โœ…
โฎ Prev โœ… โœ… โœ…
Widgets Android iOS Web
๐Ÿฆ Audio Widget โœ… โœ… โœ…
๐Ÿฆ Widget Builders โœ… โœ… โœ…
๐Ÿฆ AudioPlayer Builders Extension โœ… โœ… โœ…
Properties Android iOS Web
๐Ÿ” Loop โœ… โœ… โœ…
๐Ÿ”Š get/set Volume โœ… โœ… โœ…
โฉ get/set Play Speed โœ… โœ… โœ…
Listeners Android iOS Web
๐Ÿฆป Listener onReady(completeDuration) โœ… โœ… โœ…
๐Ÿฆป Listener currentPosition โœ… โœ… โœ…
๐Ÿฆป Listener finished โœ… โœ… โœ…
๐Ÿฆป Listener buffering โœ… โœ… โœ…
๐Ÿฆป Listener volume โœ… โœ… โœ…
๐ŸฆปListener Play Speed โœ… โœ… โœ…

๐Ÿ“ Import assets files

No needed to copy songs to a media cache, with assets_audio_player you can open them directly from the assets.

  1. Create an audio directory in your assets (not necessary named "audios")
  2. Declare it inside your pubspec.yaml
flutter:
  assets:
    - assets/audios/

๐Ÿ› ๏ธ Getting Started

final assetsAudioPlayer = AssetsAudioPlayer();

assetsAudioPlayer.open(
    Audio("assets/audios/song1.mp3"),
);

You can also play network songs from url

final assetsAudioPlayer = AssetsAudioPlayer();

try {
    await assetsAudioPlayer.open(
        Audio.network("http://www.mysite.com/myMp3file.mp3"),
    );
} catch (t) {
    //mp3 unreachable
}

LiveStream / Radio from url

The main difference with network, if you pause/play, on livestream it will resume to present duration

final assetsAudioPlayer = AssetsAudioPlayer();

try {
    await assetsAudioPlayer.open(
        Audio.liveStream(MY_LIVESTREAM_URL),
    );
} catch (t) {
    //stream unreachable
}

And play songs from file

//create a new player
final assetsAudioPlayer = AssetsAudioPlayer();

assetsAudioPlayer.open(
    Audio.file(FILE_URI),
);

for file uri, please look at https://pub.dev/packages/path_provider

assetsAudioPlayer.playOrPause();
assetsAudioPlayer.play();
assetsAudioPlayer.pause();
assetsAudioPlayer.seek(Duration to);
assetsAudioPlayer.seekBy(Duration by);
assetsAudioPlayer.forwardRewind(double speed);
//if positive, forward, if negative, rewind
assetsAudioPlayer.stop();

Notifications

Flutter Assets Audio Player

Flutter Assets Audio Player

on iOS, it will use MPNowPlayingInfoCenter

  1. Add metas inside your audio
final audio = Audio("/assets/audio/country.mp3", 
    metas: Metas(
            title:  "Country",
            artist: "Florent Champigny",
            album: "CountryAlbum",
            image: MetasImage.asset("assets/images/country.jpg"), //can be MetasImage.network
          ),
   );
  1. open with showNotification: true
_player.open(audio, showNotification: true)

Bluetooth Actions

You have to enable notification to make them work

Available remote commands :

  • Play / Pause
  • Next
  • Prev
  • Stop

โ›“ Play in parallel / simultaneously

You can create new AssetsAudioPlayer using AssetsAudioPlayer.newPlayer(),
which will play songs in a different native Media Player

This will enable to play two songs simultaneously

You can have as many player as you want !

///play 3 songs in parallel
AssetsAudioPlayer.newPlayer().open(
    Audio("assets/audios/song1.mp3")
);
AssetsAudioPlayer.newPlayer().open(
    Audio("assets/audios/song2.mp3")
);

//another way, with create, open, play & dispose the player on finish
AssetsAudioPlayer.playAndForget(
    Audio("assets/audios/song3.mp3")
);

Each player has an unique generated id, you can retrieve or create them manually using

final player = AssetsAudioPlayer.withId(id: "MY_UNIQUE_ID");

๐Ÿ—„๏ธ Playlist

assetsAudioPlayer.open(
  Playlist(
    assetAudioPaths: [
      "assets/audios/song1.mp3",
      "assets/audios/song2.mp3"
    ]
  )
);

assetsAudioPlayer.next();
assetsAudioPlayer.prev();
assetsAudioPlayer.playAtIndex(1);

Audio Widget

If you want a more flutter way to play audio, try the AudioWidget !

Flutter Assets Audio Player

//inside a stateful widget

bool _play = false;

@override
Widget build(BuildContext context) {
  return Audio.assets(
     path: "assets/audios/country.mp3",
     play: _play,
     child: RaisedButton(
           child: Text(
               _play ? "pause" : "play",
           ),
           onPressed: () {
               setState(() {
                 _play = !_play;
               });
           }
      ),
      onReadyToPlay: (duration) {
          //onReadyToPlay
      },
      onPositionChanged: (current, duration) {
          //onReadyToPlay
      },
  );
}

How to ๐Ÿ›‘ stop ๐Ÿ›‘ the AudioWidget ?

Just remove the Audio from the tree !
Or simply keep play: false

๐ŸŽง Listeners

All listeners exposes Streams
Using RxDart, AssetsAudioPlayer exposes some listeners as ValueObservable (Observable that provides synchronous access to the last emitted item);

๐ŸŽต Current song

//The current playing audio, filled with the total song duration
assetsAudioPlayer.current //ValueObservable<PlayingAudio>

//Retrieve directly the current played asset
final PlayingAudio playing = assetsAudioPlayer.current.value;

//Listen to the current playing song
assetsAudioPlayer.current.listen((playingAudio){
    final asset = playingAudio.assetAudio;
    final songDuration = playingAudio.duration;
})

โŒ› Current song duration

//Listen to the current playing song
final duration = assetsAudioPlayer.current.value.duration;

โณ Current position (in seconds)

assetsAudioPlayer.currentPosition //ValueObservable<Duration>

//retrieve directly the current song position
final Duration position = assetsAudioPlayer.currentPosition.value;

return StreamBuilder(
    stream: assetsAudioPlayer.currentPosition,
    builder: (context, asyncSnapshot) {
        final Duration duration = asyncSnapshot.data;
        return Text(duration.toString());  
    }),

or use a PlayerBuilder !

PlayerBuilder.currentPosition(
     player: _assetsAudioPlayer,
     builder: (context, duration) {
       return Text(duration.toString());  
     }
)

or Player Builder Extension

_assetsAudioPlayer.builderCurrentPosition(
     builder: (context, duration) {
       return Text(duration.toString());  
     }
)

โ–ถ IsPlaying

boolean observable representing the current mediaplayer playing state

assetsAudioPlayer.isPlaying // ValueObservable<bool>

//retrieve directly the current player state
final bool playing = assetsAudioPlayer.isPlaying.value;

//will follow the AssetsAudioPlayer playing state
return StreamBuilder(
    stream: assetsAudioPlayer.isPlaying,
    builder: (context, asyncSnapshot) {
        final bool isPlaying = asyncSnapshot.data;
        return Text(isPlaying ? "Pause" : "Play");  
    }),

or use a PlayerBuilder !

PlayerBuilder.isPlaying(
     player: _assetsAudioPlayer,
     builder: (context, isPlaying) {
       return Text(isPlaying ? "Pause" : "Play");  
     }
)

or Player Builder Extension

_assetsAudioPlayer.builderIsPlaying(
     builder: (context, isPlaying) {
       return Text(isPlaying ? "Pause" : "Play");  
     }
)

๐Ÿ”Š Volume

Change the volume (between 0.0 & 1.0)

assetsAudioPlayer.setVolume(0.5);

The media player can follow the system "volume mode" (vibrate, muted, normal)
Simply set the respectSilentMode optional parameter as true

_player.open(PLAYABLE, respectSilentMode: true);

https://developer.android.com/reference/android/media/AudioManager.html?hl=fr#getRingerMode()

https://developer.apple.com/documentation/avfoundation/avaudiosessioncategorysoloambient

Listen the volume

return StreamBuilder(
    stream: assetsAudioPlayer.volume,
    builder: (context, asyncSnapshot) {
        final double volume = asyncSnapshot.data;
        return Text("volume : $volume");  
    }),

or use a PlayerBuilder !

PlayerBuilder.volume(
     player: _assetsAudioPlayer,
     builder: (context, volume) {
       return Text("volume : $volume");
     }
)

โœ‹ Finished

Called when the current song has finished to play,

it gives the Playing audio that just finished

assetsAudioPlayer.playlistAudioFinished //ValueObservable<Playing>

assetsAudioPlayer.playlistAudioFinished.listen((Playing playing){

})

Called when the complete playlist has finished to play

assetsAudioPlayer.playlistFinished //ValueObservable<bool>

assetsAudioPlayer.playlistFinished.listen((finished){

})

๐Ÿ” Looping

final bool isLooping = assetsAudioPlayer.loop; //true / false

assetsAudioPlayer.loop = true; //set loop as true

assetsAudioPlayer.isLooping.listen((loop){
    //listen to loop
})

assetsAudioPlayer.toggleLoop(); //toggle the value of looping

Network Policies (android/iOS)

Android only allow HTTPS calls, you will have an error if you’re using HTTP,
don’t forget to add INTERNET permission and seet usesCleartextTraffic="true" in your AndroidManifest.xml

<?xml version="1.0" encoding="utf-8"?>
<manifest ...>
    <uses-permission android:name="android.permission.INTERNET" />
    <application
        ...
        android:usesCleartextTraffic="true"
        ...>
        ...
    </application>
</manifest>

iOS only allow HTTPS calls, you will have an error if you’re using HTTP,
don’t forget to edit your info.plist and set NSAppTransportSecurity to NSAllowsArbitraryLoads

<key>NSAppTransportSecurity</key>
<dict>
    <key>NSAllowsArbitraryLoads</key>
    <true/>
</dict>

๐ŸŒ Web Support

Web support is using import_js_library to import the Howler.js library

The flutter wrapper of Howler has been exported in another package : https://github.com/florent37/flutter_web_howl

๐ŸŽถ Musics

All musics used in the samples came from https://www.freemusicarchive.org/

Source Code

Please Visit Flutter Assets Audio Player Source Code at GitHub