How to play an audio file in flutter?

This Article is posted by abbas.devcode at 3/19/2020 12:34:50 PM

By the end of this tutorial, you will be able to add a music player as shown in the video in your own flutter app. ** *How to play an audio file in flutter?* ** ** * * ** ** * * ** For this tutorial, we will use two packages. - **audioplayers **package - This package actually does most of the part of our tutorial. It will allow us to play audio, pause, stop & resume. You can also seek through the duration. However, for the sake of keeping the tutorial short & simple, I have excluded it. - **file_picker **package - This package will allow us to pick audio (it works for other file types too) from our local storage and generate its path. **STEPS TO FOLLOW:** - Add both the package dependencies as shown here - **(Optional)** However, it worked fine on my android device without adding any permissions but just in case you see errors piling up, try adding permissions for android and/or iOS for the file_picker plugin. You can find the permissions to be added on the package's official docs on pub.dev - Finally, paste this entire code in your main.dart file to achieve the same results as shown in the video above. color: #dcdcaa;](runApp(color: #4ec9b0;](MyApp()); color: #569cd6;](class color: #4ec9b0;](MyApp color: #569cd6;](extends color: #4ec9b0;](StatelessWidget { color: #6a9955;](// This widget is the root of your application. color: #569cd6;](@override color: #4ec9b0;](Widget color: #dcdcaa;](build(color: #4ec9b0;](BuildContext context) { color: #c586c0;](return color: #4ec9b0;](MaterialApp( title: color: #ce9178;]('AudioPlayer', theme: color: #4ec9b0;](ThemeData( primarySwatch: color: #4ec9b0;](Colors.blue, ), home: color: #4ec9b0;](MyHomePage(title: color: #ce9178;]('Audio Player'), ); } } color: #569cd6;](class color: #4ec9b0;](MyHomePage color: #569cd6;](extends color: #4ec9b0;](StatefulWidget { color: #4ec9b0;](MyHomePage({color: #4ec9b0;](Key key, color: #569cd6;](this.title}) : color: #569cd6;](super(key: key); color: #569cd6;](final color: #4ec9b0;](String title; color: #569cd6;](@override color: #4ec9b0;](_MyHomePageState color: #dcdcaa;](createState() => color: #4ec9b0;](_MyHomePageState(); } color: #569cd6;](class color: #4ec9b0;](_MyHomePageState color: #569cd6;](extends color: #4ec9b0;](State { color: #4ec9b0;](bool _isPlaying = color: #569cd6;](false; color: #4ec9b0;](AudioPlayer audioPlayer; color: #569cd6;](@override color: #569cd6;](void color: #dcdcaa;](initState() { color: #569cd6;](super.color: #dcdcaa;](initState(); audioPlayer = color: #4ec9b0;](AudioPlayer(); } color: #dcdcaa;](playAudioFromLocalStorage(path) color: #c586c0;](async { color: #4ec9b0;](int response = color: #c586c0;](await audioPlayer.color: #dcdcaa;](play(path, isLocal: color: #569cd6;](true); color: #c586c0;](if (response == color: #b5cea8;](1) { color: #6a9955;](// success } color: #c586c0;](else { color: #dcdcaa;](print(color: #ce9178;]('Some error occured in playing from storage!'); } } color: #dcdcaa;](pauseAudio() color: #c586c0;](async { color: #4ec9b0;](int response = color: #c586c0;](await audioPlayer.color: #dcdcaa;](pause(); color: #c586c0;](if (response == color: #b5cea8;](1) { color: #6a9955;](// success } color: #c586c0;](else { color: #dcdcaa;](print(color: #ce9178;]('Some error occured in pausing'); } } color: #dcdcaa;](stopAudio() color: #c586c0;](async { color: #4ec9b0;](int response = color: #c586c0;](await audioPlayer.color: #dcdcaa;](stop(); color: #c586c0;](if (response == color: #b5cea8;](1) { color: #6a9955;](// success } color: #c586c0;](else { color: #dcdcaa;](print(color: #ce9178;]('Some error occured in stopping'); } } color: #dcdcaa;](resumeAudio() color: #c586c0;](async { color: #4ec9b0;](int response = color: #c586c0;](await audioPlayer.color: #dcdcaa;](resume(); color: #c586c0;](if (response == color: #b5cea8;](1) { color: #6a9955;](// success } color: #c586c0;](else { color: #dcdcaa;](print(color: #ce9178;]('Some error occured in resuming'); } } color: #569cd6;](@override color: #4ec9b0;](Widget color: #dcdcaa;](build(color: #4ec9b0;](BuildContext context) { color: #c586c0;](return color: #4ec9b0;](Scaffold( appBar: color: #4ec9b0;](AppBar( title: color: #4ec9b0;](Text(widget.title), ), body: color: #4ec9b0;](Center( child: color: #4ec9b0;](Column( mainAxisAlignment: color: #4ec9b0;](MainAxisAlignment.spaceEvenly, children: [ color: #4ec9b0;](Container( child: color: #4ec9b0;](Column( children: [ color: #4ec9b0;](Row( mainAxisAlignment: color: #4ec9b0;](MainAxisAlignment.spaceEvenly, children: [ color: #4ec9b0;](RaisedButton( onPressed: () { color: #c586c0;](if (_isPlaying == color: #569cd6;](true) { color: #dcdcaa;](pauseAudio(); color: #dcdcaa;](setState(() { _isPlaying = color: #569cd6;](false; }); } color: #c586c0;](else { color: #dcdcaa;](resumeAudio(); color: #dcdcaa;](setState(() { _isPlaying = color: #569cd6;](true; }); } }, child: color: #4ec9b0;](Icon(_isPlaying ? color: #4ec9b0;](Icons.pause : color: #4ec9b0;](Icons.play_arrow), color: color: #4ec9b0;](Colors.blue, ), color: #4ec9b0;](RaisedButton( onPressed: () { color: #dcdcaa;](stopAudio(); color: #dcdcaa;](setState(() { _isPlaying = color: #569cd6;](false; }); }, child: color: #4ec9b0;](Icon(color: #4ec9b0;](Icons.stop), color: color: #4ec9b0;](Colors.blue, ), ], ), ], ), ), color: #4ec9b0;](Row( mainAxisAlignment: color: #4ec9b0;](MainAxisAlignment.spaceAround, children: [ color: #4ec9b0;](RaisedButton( onPressed: () color: #c586c0;](async { color: #569cd6;](var path = color: #c586c0;](await color: #4ec9b0;](FilePicker.color: #dcdcaa;](getFilePath(type: color: #4ec9b0;](FileType.audio); color: #dcdcaa;](setState(() { _isPlaying = color: #569cd6;](true; }); color: #dcdcaa;](playAudioFromLocalStorage(path); }, child: color: #4ec9b0;](Text( color: #ce9178;]('Load Audio File', style: color: #4ec9b0;](TextStyle(color: color: #4ec9b0;](Colors.white), ), color: color: #4ec9b0;](Colors.blueAccent, ), ], ), ], ), ), ); } } ` Hope you enjoyed :) If you have any questions, drop a comment below. Keep Fluttering!

Tags: audio file in flutter



0 Comments
Login to comment.
Recent Comments

Be the first to Comment. You can ask a Query or Share your toughts or Just say thanks.




© 2018 - Fluttercentral | Email to me - Seven.srikanth@gmail.com