Flutter Audio Player (from URL, File, Assets)
Vložit
- čas přidán 28. 07. 2024
- Create a simple Audio Player in Flutter that plays audio from url, assets or file. This Flutter Music Player App can play audio, pause audio and stop audio and has an Audio Player progress bar and seekbar.
Click here to Subscribe to Johannes Milke: czcams.com/users/JohannesMilke...
👉 12 Week Flutter Training | heyflutter.com
👉 Flutter Masterclass Courses | heyflutter.com/masterclass
Source Code | github.com/JohannesMilke/audi...
My Courses | heyflutter.com
Follow Newsletter | johannesmilke.com/#/newsletter
SUBSCRIBE HERE
bit.ly/JohannesMilke
SUPPORT & SPONSOR ME
github.com/sponsors/JohannesM...
TIMELINE
0:00 Audio Player / Music Player
2:07 Load Audio From URL
2:11 Load Audio From File or Path
2:23 Load Audio From Assets
SOCIAL MEDIA: Follow Us :-)
Twitter | / heyflutter_
Linkedin | / heyflutter
#Flutter #Tutorial #JohannesMilke
LIKE & SHARE & ACTIVATE THE BELL
Thanks For Watching :-) - Věda a technologie
![We Built an App in 24 Hours [No Code]](http://i.ytimg.com/vi/tB18tcMgnP4/mqdefault.jpg)
👉Join 12 Week Flutter Training: heyflutter.com
👉Join the WhatsApp Channel to get the latest news about Flutter & HeyFlutter: whatsapp.com/channel/0029VaDNCZtC1Fu8nL2vmw3f
Source Code: github.com/JohannesMilke/audio_player
Audio Recorder Tutorial: czcams.com/video/j4mX0jtxWpA/video.html
Neumorphism Tutorial: czcams.com/video/A2Bbhr3DGd0/video.html
Nested ListViews and Columns Tutorial: czcams.com/video/ZpHuAbYWL3w/video.html
ChatApp UI Design Tutorial: czcams.com/video/eGhvL082-Pc/video.html
Flexible Widget Tutorial: czcams.com/video/5TwBXLZdVvk/video.html
Expanded Widget Tutorial: czcams.com/video/N1FMX4rDn6Y/video.html
Spacer Widget Tutorial: czcams.com/video/n4dJVUdj4ik/video.html
FittedBox Widget Tutorial: czcams.com/video/WpTMNArnXdc/video.html
Flutter Layout Basics Tutorial: czcams.com/video/yYxueTNIDlA/video.html
Row Layout Basics Tutorial: czcams.com/video/lY5GtNkvyhM/video.html
Column Layout Basics Tutorial: czcams.com/video/nW9pAyDs-wE/video.html
Expansion Tile Tutorial: czcams.com/video/vRWY-IQAin0/video.html
Expansion Panel Tutorial: czcams.com/video/r7L146d9YA8/video.html
Bottom Sheet Tutorial: czcams.com/video/TXYuaiukw7E/video.html
Popup Dialog Tutorial: czcams.com/video/4pn-_md5Ol4/video.html
Dropdown Menu Tutorial: czcams.com/video/z0ihUbwlSHs/video.html
PageView Tutorial: czcams.com/video/sFXg-phkbQU/video.html
Page Transition Animation Tutorial: czcams.com/video/_R3E_aof69c/video.html
Horizontal ListView Tutorial: czcams.com/video/baA_J5tUtEU/video.html
Hi.
in a ListView.builder() with many audios, when i launch one every audio read the same file. how can i solve this please
Your channel is a treasure for the flutter domain you are doing an amazing work thank you very much
Once again, thanks a lot!. Needed this for one of my projects.
Thank-you🙏🏻
This is what I was looking for 😀.
It will help me a lot in one of my project😄
OMG it's just what i need right now. Thanks.
Such incredible quality! It is rare for a video to be so concise, using as little time as necessary and yet being very clear. The red outlining to show what the code represents, and you show for everything (URL, file, & assets!). The website explanations I found before only showed examples for URL
Glad you liked it, @marcodrochner7166 😀
thank you so much, I spent a lot of time searching for this topic
You are a great person You always saved me thanks 😊
Thanks man !! for sharing this . Your content and explanation is really good and helpful for flutter community . Cheers !!
You are welcome, @abhisheksinghal4470 😊
Doing great, thanks for this video
Wow, it's so easy! Thanks
Thanks to your efforts as a high professional contributor.
If you try to make a video on Audio player which works in background, it would be beneficial alot.
Thanks
Great lesson with great teacher thanks
Great tutorial Johannes, quick question - how can i continue playing the song as i navigate away to other screens in the same app?
Hi, Can you put a video on full audio player app with list of songs to select
Thank you so much Milke 👍
Very awesome mr, thanks a lot
Thank you so much my brother
Great tutorial, Great teacher, thanks, and with videos (network, file)?
You saved my life! Thanks A Lot!
Glad to hear that, You are most welcome @hayahesham2980
Thank you so much sir. your channel is the best channel I have ever subscribed. you are the boss of Flutter engine.
Glad to hear that, Thank you Maliky! 😊
You r awesome bro❤️
Hey Johannes, thanks for the tutorial again.
I'm using audio player but loop does not work for iPhone when app is in background or screen is locked.
Do you know any solutions for that? Thanks
Thank your for quick response :) There is no error message, when the audio finished audioplayer.state turns to COMPLETED. It is a known issue, mentioned here github.com/bluefireteam/audioplayers/issues/1038.
Hi. Thnks for the great tutorial. (formatTime(position)) gives me an error. Could you tell me why is that?
formatTime is a custom method he has shown it in the upper part of the screen when he write them.
awesome !!
Can you make a Background mp3 also. Great thanks
Yes bro You are the best
Great video
Thanks pro ... what if I want it to start automatically when the app start instead of using play btn ??
Thank You Tarek Refaei! Follow this link: stackoverflow.com/questions/60921992/play-audio-file-from-where-i-pause-not-from-the-beginning-in-audioplayers-flutt
I hope you will get your answer 🙂
Nice video, thanks.
Glad you liked it, @anchorrealtynm7897 😀
Awesome video.. You could add the play in background and next audio option and control from notification bar …. the way you explain no one else do it on CZcams.. Thank you Milke ….
And also playing audio from a playlist. Thanks Mike
@@HeyFlutter Welcome Dear ..
Wonderful tutorial thanks a lot Sir, just a quick question, when I click on play button am able to play my audio from url and if I go over and click on the other file it also start playing. but I want a situation where if there is already one playing and I click on the other file to play, I want the one which was playing to automatically stop and play the current selected.
How can I achieve that?
Thanks,
Thank You Hit-Boyy! Follow this link: stackoverflow.com/questions/70606438/flutter-how-to-play-and-stop-audio-at-specific-time
I hope you will get your answer 🙂
@@HeyFlutter thanks 🙏
hello ddear.....why audioPlayer.onAudioPositionChanged method auto starts after some seconds...and resets the position to zero...
Hey 😊, @naturalandforests8012! Check out this solution: stackoverflow.com/a/65173226 I hope this may help you
Actually I am having a hard time playing from assets folder. The UI is staying the same. Anyone else having this problem? The setURL method for audio_players package is no longer available.
Thank You J Hancock! Follow this link: stackoverflow.com/questions/71274141/playing-audio-from-assets-flutter
I hope you will get your answer 🙂
hi, thanks for tutorial, i have a problem. the play method is not accepting a String, but a source. and i dont understand how to make it functioning.
Thank you, Sepehr Amini! 🙂. Try to paste the error message with your question whenever you face any issue or error.
is it possible that we are able to build the flutter app for video to audio converter ???
Thank You Film in Tamil! Follow this link: stackoverflow.com/questions/73729251/to-convert-wav-audio-file-to-mp3-in-flutter
I hope you will get your answer 🙂
hello sir, how can I create a playlist and enable the next and back button for this audio player?
Thank You SHAKIR ALI! Follow this link: suragch.medium.com/managing-playlists-in-flutter-with-just-audio-c4b8f2af12eb
I hope you will get your answer 🙂
Next level ...
thanks for your efforts, BUT WHY do you not use the same package "flutter_sound" to play audio also, WHY you used different package to record and play, Thanks
Thank you, Botan Muhamad! 🙂. There is no specific reason for that you can use any of them.
could you please show us how to add loop function?
Thanks for the idea @MrIMacro 😀, i have added it in my list of future videos
Thank you so much bro.Can you please teach how to rewind a audio by long pressing a button?
Thanks for the idea, Farid Ahmadov! 🙂 I have added it to my list of ideas for future videos!
How can i fast-foward and rewind-back the audio? I'm unable to do so usibg the audioPlayer package
Thanks for the idea Hira Sharif 😀, i have added it in my list of future videos
awesome work, how about going to next or back song
Excuse me I want to play audio come from APIs and I created class model and use dio for making http request every time I request it gives me timeout exception and future not completed and cookies null how I can solve this problem
Thank You @salmakhaled8024! Follow this link: stackoverflow.com/questions/64214710/how-to-fetch-audio-from-my-api-with-protected-urls-using-just-audio-flutter
I hope you will get your answer 🙂
Hello Sir,
How to set Media player with local notification? have you any code or suggestion please share me. Thank You For Giveing Me Your Important Time.
Thank You Jayswal Viraj! Follow this link: medium.com/flutter-community/local-notifications-in-flutter-746eb1d606c6
I hope you will get your answer 🙂
Thanks for video! where do i get the urls to test in my app? can you make it available?
Hey, @adrielsilva8685 🙂 there are many open source audios you can use
When I upload my application to Galaxy Store they reject the application because of a message "Blocked by Play Protect" knowing that I built the application in your way, Is the reason that the application is not on Google Play?
Thank You Abdullah Khaled! Follow this link: stackoverflow.com/questions/51080755/installation-app-blocked-by-play-protect
I hope you will get your answer 🙂
How can you play a youtube audio just the audio because this did not work for me
Hey, @fresshsh8197 🙂 CZcams urls are encoded so cannot be directly accessed. Please try this solution: czcams.com/video/GQyWIur03aw/video.html
Thanks for sharing ❤️💕💕💕💕💕💕💕💕💕💕💕💕💕💕💕💕💕💕💕💕💕💕💕💕💕💕💕💕💕💕💕💕💕💕💕💕💕💕💕
You are welcome, @S-Lomar!
Hello, how can I prevent audio from overlapping when multiple audios are played? Like pause the audio which was playing and play the audio which was recently clicked...
Hey, Mohit Marfatia 🙂 This has to be handled by the platform itself
@@HeyFlutter Thank you for the reply. By platform, do you mean the audioplayers package?
Amazing content 👍🏽 Will this work for radio streaming link? Thanks
Thank You Bosun Olaniyan! Follow this link: pub.dev/packages/flutter_radio_player
I hope you will get your answer 🙂
Hello,
when I enter a url as a String, it shows me
The argument type 'String' can't be assigned to the parameter type 'Source'.
Why does this happen?
And which URL sources can I use, youtube?
BR :)
Thank You Alex! Follow this link: stackoverflow.com/questions/55995791/how-can-i-resolve-the-argument-type-string-cant-be-assigned-to-the-parameter
I hope you will get your answer 🙂
Search data from local database in implement staggered grid view
Hey nice video, I am facing an issue 0:48 where you create the URL , the error is showing that The argument type 'String' can't be assigned to the parameter type 'Source'. Please help
Wrap your url with UrlSource widget
Thank You Priyanshu Dutta! Follow this link: www.kindacode.com/snippet/flutter-error-the-argument-type-string-cant-be-assigned-to-the-parameter-type-uri/
I hope you will get your answer 🙂
Hey Johannes i wanna ask about
formatTime
when i use
final formatTime = new DateFormat(' hh:mm');
with init the code error in anthor thing like
Directionality(
textDirection: TextDirection.ltr,)
any help to do formatTime without any problems
Thank You Aly Bauomy! Follow this link: stackoverflow.com/questions/50758072/date-time-format-in-flutter-dd-mm-yyyy-hhmm
I hope you will get your answer 🙂
@@HeyFlutter i already use all code datatime in this wep
i just want your small datatime method that you use in this vedio
💯 Thanks you are always my life savior
You are welcome, @amrsamy9007 😊
It is working fine for Android but for iOS when i Play song list through url application is crashed after first song. Giving ' nil value fetal error'
No Worries vikas kumar Gupta, make sure to follow the tutorial step by step 🙂
can you tell me, how i will get audio duration.. i already try your way but not working
Thank You harsh gupta! Follow this link: stackoverflow.com/questions/58999064/how-to-get-length-of-audio-file-without-playing-it-in-flutter-dart
I hope you will get your answer 🙂
I don't know when i pick the file but it can't use in setUrl and there is no and attribute in setUrl even setUrl is not working nowday
Thank You @user-tr9yb2cl4j! Follow this link: stackoverflow.com/questions/62872496/no-audio-sound-after-importing-audioplayers-package-in-flutter
I hope you will get your answer 🙂
Hi! How to make it work in FlutterFlow and in the background?
Thank You Manuel Salero! Follow this link: docs.flutterflow.io/widgets-and-components/widgets-ui-elements/base-elements/audioplayer
I hope you will get your answer 🙂
How to make custom check box in list view and selection of check box
Thank You Sunil Gohel! Follow this link: stackoverflow.com/questions/63788530/how-to-add-checkbox-in-listview-in-flutter
I hope you will get your answer 🙂
Hi, can you make a tutorial for creating an audio playlist with rootbundle assets/audio. Please
Thanks for the idea @DoremiMali 😀, i have added it in my list of future videos
How to play the audio when the app is in background?
Thank You @amandwivedi7413! Follow this link: stackoverflow.com/questions/61688915/playing-audio-in-the-background-using-flutter
I hope you will get your answer 🙂
how to play with background service ? can u explain with video ?
@@HeyFlutter ok, nice
i will waiting , thanks
the formatTime(position) is throwing red line. who knows why please?
Thank you, abel ayinde! 🙂. Try to paste the error message with your question whenever you face any issue or error.
Next, make a video about firebase remote config. Make a video on how to save the API key in the remote config, and how to change the behavior of the app using remote config. For example how to send a pop-up message to update an app using firebase remote config 🔥
Great❤
Thanks, @mohammedzaheerf4126! 🙂
hey through your prev video i build a voice recorder , and i tried to play that audio file from url , no error and slider also not moving
when i press the play button this exception occur
Exception has occurred.
PlatformException (PlatformException(Unexpected error!, uriString, java.lang.NullPointerException: uriString
at android.net.Uri$StringUri.(Uri.java:490)
at android.net.Uri$StringUri.(Uri.java:480)
at android.net.Uri.parse(Uri.java:452)
at android.media.MediaPlayer.setDataSource(MediaPlayer.java:1170)
at android.media.MediaPlayer.setDataSource(MediaPlayer.java:1164)
at android.media.MediaPlayer.setDataSource(MediaPlayer.java:1131)
at xyz.luan.audioplayers.WrappedMediaPlayer.actuallyPlay(WrappedMediaPlayer.kt:219)
at xyz.luan.audioplayers.WrappedMediaPlayer.play(WrappedMediaPlayer.kt:205)
at xyz.luan.audioplayers.AudioplayersPlugin.handleMethodCall(AudioplayersPlugin.kt:79)
at xyz.luan.audioplayers.AudioplayersPlugin.onMethodCall(AudioplayersPlugin.kt:33)
at io.flutter.plugin.common.MethodChannel$IncomingMethodCallHandler.onMessage(MethodChannel.java:262)
at io.flutter.embedding.engine.dart.DartMessenger.invokeHandler(DartMessenger.java:296)
at io.flutter.embedding.engine.dart.DartMessenger.lambda$dispatchMessageToQueue$0$DartMessenger(DartMessenger.java:320)
at io.flutter.embedding.engine.dart.-$$Lambda$DartMessenger$TsixYUB5E6FpKhMtCSQVHKE89gQ.run(Unknown Source:12)
at android.os.Handler.handleCallback(Handler.java:873)
at android.os.Handler.dispatchMessage(Handler.java:99)
at android.os.Looper.loop(Looper.java:193)
at android.app.ActivityThread.main(ActivityThread.java:6669)
at java.lang.reflect.Method.invoke(Native Method)
at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:493)
at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:858)
, null))
@@HeyFlutter thanks for your beloved time, i got it right, it was due to setAudio() function, i placed those code to stop() function where recorder stops.
am using getx, so i think onInit calls only once right, is becasue of this the slider is not moving? please reply
Sir What if the audios are stored in firebase and the link is there but in last there is no .wav how to play that URL from firebase?
Hey, @amandwivedi7413 🙂 If your URL does not end with a typical audio format extension like .wav or .mp3, the package might still be able to play the audio if it supports the format that the URL is pointing to.
@@HeyFlutter Thank you so much
thank you
i have error after i add audioplayers: ^0.20.1
Because toku depends on audioplayers >=0.13.7 which requires Flutter SDK version >=1.10.0, version solving failed.
pub get failed (1; Because toku depends on audioplayers >=0.13.7 which requires Flutter SDK version >=1.10.0, version solving failed.)
and im searching alot to solve this error ,but i cant
Hello, heyam awad! Follow this link: stackoverflow.com/questions/51474647/flutter-packages-get-failed-depends-on-flutter-test-any-from-sdk-which-requires,
I hope it will solve your problem. Thank You 🙂
hello @Johannes milke
I am not able to pass String parameter inside play method.
The argument type 'String' can't be assigned to the parameter type 'Source
Please help me
Thank You Surendra Vishwakarma! Follow this link: stackoverflow.com/questions/55995791/how-can-i-resolve-the-argument-type-string-cant-be-assigned-to-the-parameter
I hope you will get your answer 🙂
@@HeyFlutter thanks for response my question.i resolved this issue just change version of the audioplayers
Can't find this package
Thank You Code Pie! Follow this link: pub.dev/packages/audioplayers
I hope you will get your answer 🙂
NotSupportedError: The element has no supported sources. getting this error when trying to play audio from assets
Hello, CombatCraz! Follow this link: stackoverflow.com/questions/37674223/domexception-failed-to-load-because-no-supported-source-was-found, I hope it will solve your problem. Thank You 🙂
Hi. the package is not working on iOS 16. Do you have any update?
Thanks for updating, 투자해서 행복해요! 🙂 will try to bring updated tutorial
@@HeyFlutter hi. It was a bug in the simulator of VSCODE. Thank you for your attention.
you're too much. Amazing videos. It's a shame I have not been able to watch your videos lately
Using Assets getting Exoplayer error
How to play audio saved in cache memory?
Hey, Prasad Dhend! 🙂 check out this package : pub.dev/packages/just_audio_cache
Can you send link in github to this mobile app? I want to see code
Thank You Елназ Алмасулы!. I showed the main functionality, which is important for this package. Learn more about it here: github.com/JohannesMilke/sponsorware
this is so great...what about having a playlist?
Thanks for suggestion, @ManuMarea! 🙂
I cannot get the confirmation email for access
Thanks, Prasanna Khebade! 🙂 Learn more about it here: github.com/JohannesMilke/sponsorware#2-why-didnt-i-get-an-email-even-if-i-have-sent-already-a-request-on-your-website
i cant access to your git hub code
Thank You DANISH ALI!. I showed the main functionality, which is important for this package. Learn more about it here: github.com/JohannesMilke/sponsorware
Hey NEED LIST BUILDER WITH LIST BUILDING ITEMS AND CLCIK OF LIST ITEMS SHOWS DATA IN DIFFERENT SCREEN......ALL DATA WILL BE FETCH FROM FIRESTORE 🥰🌹👍😇
i can listen to music but seeker is not working, i used same package version as your and its working in IOS simulator but not in android phones.
Thank you, akhil Anand! 🙂. Kindly update to the latest version and see if it works or not.
@@HeyFlutter i updated to newer version,problem still exit. its working on IOS simulator but not in android device
@@HeyFlutter is there any additional setting we need to do in android
does the url work with youtube link ?
No
thanks for the exerted effort , I face an issue children: [
Text(formatTime(position)),
Text(formaTime(duration)),
]
it doesn't recognize formatTime
Hey, @yousefabdelnaby3555 🙂 please make sure to check:
1. formatTime() is defined with in scope (i.e., in same class on global level)
2. formatTime() is returning a string value
The method ‘setUrl’ isn’t defined for the type ‘AudioPlayer’. Try correcting the name of an existing method, or defining a method named ‘setUrl’
Thank You Almighty KODaDon! Follow this link: stackoverflow.com/questions/72654603/the-method-play-isnt-defined-for-the-type-audiocache
I hope you will get your answer 🙂
@@HeyFlutter I will check this out
How to play the audio from the asset
@@HeyFlutter thank you very much 🤗
😍😍😍
What is format time ?
Thank You Thanveer Pm! Follow this link: stackoverflow.com/questions/50758072/date-time-format-in-flutter-dd-mm-yyyy-hhmm
I hope you will get your answer 🙂
How to fetch metadata from the url stream? Like Now playing: artist Name song Title
Thank You @alek4001! Follow this link: stackoverflow.com/questions/64100094/how-can-i-fetch-the-metadata-of-audio-files-in-flutter
I hope you will get your answer 🙂
@@HeyFlutter Thank you very much. I havr already solved this problem using just audio package. It can retrieve Icymetadata
Doesn't work on audioplayers 3.0.1. Half of the methods are gone.
Thank you, D GK! 🙂. Try to provide enough details with yours question whenever you face any issue.
can i use html.File?
what i meant is, i need to play audio using base64 supplied from the backend, from the tutorial i see that we can play audio using File (from dart.io), what i ask, can i play the audio using File(from dart.html) since im currently on Web
Source code not available on github
Thank You Santosh kumar!. I showed the main functionality, which is important for this package. Learn more about it here: github.com/JohannesMilke/sponsorware
seturl method not working
Thank you, Sumant R Kurse! 🙂. Try to provide enough details with your question whenever you face any issue.
Hi I had a question as always great tutorial how would we make this work with multiple audio files if you can make a tutorial on that
Thank you
Thanks for the idea, Kirubel Berhanu! 🙂 I have added it to my list of ideas for future videos!
@@HeyFlutter Thanks 😁
my duration variable is 0 when i playing audio local path
Thank You @truonguc886! Follow this link: stackoverflow.com/questions/58999064/how-to-get-length-of-audio-file-without-playing-it-in-flutter-dart
I hope you will get your answer 🙂
can you send me the code, please?
Hey, Osama 🥀 Omran 🙂 you can access it by subscribing on github
How to recover audio files automatically without using FilePicker?
@@HeyFlutter I want to create a local music player and I don't know how to get all the audio files from the device's storage automatically
❤️
Salam dari Indonesia sobat
@@HeyFlutter siap pak bos