Audio_service: How to setup SeekBar with Audio_Service & AudioPlayer

[hpuriamanesh]

Hi,

i want add a "Slider" to your example (https://github.com/ryanheise/audio_service/blob/master/example/lib/main.dart) which will continue to work as the program closes and re-runs.

But i can not setup this feature
Please guide me and send me the relevant codes.

Thank you very much for your support

[ryanheise]

Hi,

Writing a fully-fledged media player with a seek bar is not really a simple task and is outside the scope of the included demo app, but you should have all the APIs that you need (more or less). Here are some pointers:

• Yes, you'll need to hook into lifecycle events in Flutter so that you can reconnect and update your UI when the screen is turned back on and your UI is resumed.
• While the screen is turned on, your UI seek bar needs to track the playback state in real time. Here, you just need to understand that audio_service does not flood you with state change events by the millisecond as the playback position changes. You need to calculate your own projection using information in the PlaybackState using something like currentPosition = state.position + (current system time - state.updateTime). This calculation gives you the seek bar position to display and you'll want to update the seek bar periodically using something like a Timer. If a seek happens, you'll get notified of a state change, so you'll have a new state.position and new state.updateTime to base your projection calculations on.

[hpuriamanesh]

Thank you for your answer
I'm new to the Flutter, so I did not get exactly that.
This page is example of seek bar without using the Audio_Service, but if I want to combine this code with the Audio_Service, the program does not work.
Could you explain me in an example?

[ryanheise]

Hi,

From the above, I understand that you are quite new to Flutter. I understand it can be quite a steep learning curve at first, although there really is no short cut other than learning concept after concept.

I think the community will be more inclined to help if you demonstrate curiosity about how the necessary concepts work (in this case, life cycle events, and projecting the playback position from the last state snapshot). If all goes well, you'll be able to write the code yourself.

I'm really quite happy to explain any audio_service concepts further (e.g. if you can ask me more specifically about what you didn't understand in my previous answer).

If you have questions about more general Flutter concepts like the life cycle events which you should understand before using this plugin, you use one of several community resources where you can get guidance to learn the ropes:

https://gitter.im/flutter/flutter
https://stackoverflow.com/tags/flutter
https://groups.google.com/forum/#!forum/flutter-dev
More: https://flutter.io/community

P.S. Just to be explicit, I unfortunately do not have the time to write a media player, but I do know that other users of the plugin are writing media players using this plugin, so another option is to wait for an open source media player to be published by someone else, otherwise YOU might just be the first ;-)

[hpuriamanesh]

Excuse me, but I do not want to make a very professional program for playing music.
I just want to make a program like your example that running a music in background

The only thing that differs from your example is a seek bar that can display the current time of music playback and can be changed, such as regular music players in mobiles

In the example below, this is done, but the problem is that because it's not used in an Audio_Service library, it does not work properly after turning off the screen or closing the application and re-running the program.

https://github.com/rxlabz/audioplayer/blob/master/example/lib/main.dart

When I want to combine these two programs (Audio_Service & AudipPlayer), I can not
I do not have enough explanations about onSeekTo and etc ...

Thanks for the time you give me

[ryanheise]

Hi,

Everything about the flow of the seek action is the same as the flow of the play and pause actions which you can find in the example, except for the fact that you will also want to do the projection calculations to make the seek bar move in your UI. It is therefore really important that you understand how the play and pause actions in the example work first.

Basically all user-initiated actions (such as seeking) are commanded from the UI via the AudioService class which is the client API (for your main isolate). Each method on that class such as seekTo passes through to a corresponding method in the background task (in the background isolate) through a sort of inter-isolate communication, in this case eventually ending up in your background task's onSeekTo method. This method is where you want to write whatever code is necessary to make the music jump to the requested position, AND register a state change in the background task via setState. When you call setState, it will notify all connected clients of the state change so that they can update their UI (if necessary).

[hpuriamanesh]

Hi, thanks.

I'm trying to do this section in this section.
I just do not know why these commands do not work?
(These codes are used in your program example, but they are not working.)

1: print(_state.position);
2: print(_audioPlayer.duration);
3: _audioPlayer.seek(10.0);
4: AudioService.seekTo(10000)
5: print(AudioServiceBackground.state.position);

Please explain how to use these codes.

[ryanheise]

I am closing this issue as it does not contain any actionable items.

You are welcome to open new issues in the future with a goal to improve either the documentation or the code/features, however please do try to state your issue clearly in the future. If it relates to the documentation (available at https://pub.dartlang.org/documentation/audio_service/latest/audio_service/audio_service-library.html), please quote which part of the documentation you're referring to and your suggestion for how it could be improved. If you have a question that does not fit into either of these two categories (e.g. "I need help writing code"), I instead refer you to the various community resources mentioned above.