How to play an audio file in flutter?

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



<p>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.</p> <p>** <em>How to play an audio file in flutter?</em> </p> <p> * * </p> <p> * * **</p> <p>For this tutorial, we will use two packages.</p> <h2 id="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">- **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.</h2> <p>**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.</p> <p><strong>STEPS TO FOLLOW:</strong></p> <ul> <li><p>Add both the package dependencies as shown here</p> </li> <li></li> </ul> <p><strong>(Optional)</strong> 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</p> <ul> <li>Finally, paste this entire code in your main.dart file to achieve the same results as shown in the video above.</li> </ul> <p>color: #dcdcaa;](runApp(color: #4ec9b0;](MyApp());</p> <p>color: #569cd6;](class color: #4ec9b0;](MyApp color: #569cd6;](extends color: #4ec9b0;](StatelessWidget { color: #6a9955;](// This widget is the root of your application.</p> <p>color: #569cd6;](@override</p> <p>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'), ); } }</p> <p>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</p> <p>color: #4ec9b0;](_MyHomePageState color: #dcdcaa;](createState() => color: #4ec9b0;](_MyHomePageState(); }</p> <p>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</p> <p id="4ec9b0;](AudioPlayer();" color:="" audioPlayer="color:">color: #569cd6;](void color: #dcdcaa;](initState() 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</p> <pre>} color: #c586c0;](else { color: #dcdcaa;](print(color: #ce9178;]('Some error occured in playing from storage!'); } </pre> <p>} 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</p> <pre>} color: #c586c0;](else { color: #dcdcaa;](print(color: #ce9178;]('Some error occured in pausing'); } </pre> <p>} 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</p> <pre>} color: #c586c0;](else { color: #dcdcaa;](print(color: #ce9178;]('Some error occured in stopping'); } </pre> <p>} 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</p> <pre>} color: #c586c0;](else { color: #dcdcaa;](print(color: #ce9178;]('Some error occured in resuming'); } </pre> <p>} color: #569cd6;](@override</p> <p id="569cd6;](true;" _isPlaying="color:">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(() ); } color: #c586c0;](else { color: #dcdcaa;](resumeAudio(); color: #dcdcaa;](setState(() ); } }, 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(() ); }, 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(() ); 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, ), ], ), ], ), ), ); } } `</p> <p>Hope you enjoyed :) If you have any questions, drop a comment below. Keep Fluttering!</p>


Tags: audio file in flutter








0 Comments
Login to comment.
Recent Comments