Music progress bar?

Get help using Construct 2

Post » Mon Sep 16, 2013 9:49 am

Hi,

How would I go about making a working audio progress bar? It would need to work the same way as in any random music player, i.e. correspond to the current music position and be clickable/draggable to change the position?

I'm not sure if this is at all possible, could you point me in the right direction?
B
16
S
7
G
1
Posts: 154
Reputation: 3,117

Post » Mon Sep 16, 2013 11:01 am

Everything you asked is possible but care this are advanced functions so it will be not so easy. Manual This should help you enough ;)
B
15
S
6
G
6
Posts: 512
Reputation: 5,555

Post » Mon Sep 16, 2013 12:12 pm

Quoted from manual:
Seek to
Seek a currently playing sound to a different location in the audio file. The time to seek to is given in seconds.

PlaybackTime(Tag)
Get the current playback time in seconds of a sound with a tag. This starts at 0 and counts up to the duration, except for looping sounds which keep counting up past the duration.

These should be the ones your looking for spacificly
B
9
Posts: 12
Reputation: 464

Post » Mon Sep 16, 2013 7:14 pm

it's actually quite simple. You just need two objects, a background bar, with a static width, and a progress bar, displayed on top of it, which width varies between 0 and the background bar width.
You just need to update the progress bar width on every tick, by a simple ratio calculation. the background width represents the total sample duration, so you just need to set the progress bar width like this:

backgroundBar.Width*Audio.PlaybackTime(tag)/Duration(tag)

where tag corespond to the one you gave to the sample you're playing.

Then for a seek function when you click the progress/background bar, it's the reverse ratio, you must convert an X position on your background to a position in the sample duration.

Audio Seek to (Mouse.X - progressBar.BBoxLeft)*Duration(tag)/progressBar.Width

Then, making it draggable should not be too hard, just add another sprite for the knob, update its position at the same time you update the progress width, with the same value. Give it a drag and drop behavior, constrained to the horizontal axis only. This makes it draggable. When you release the drag, just use the same expression as above for seeking, except replace Mouse.X with knob.X
B
12
S
5
G
2
Posts: 132
Reputation: 2,627

Post » Tue Sep 17, 2013 7:17 am

Thanks! The Seek To seems to be exacly the kind of thing I needed. As soon as R44 is fixed I'll try it out ;)
B
16
S
7
G
1
Posts: 154
Reputation: 3,117

Post » Sat Sep 21, 2013 3:48 pm

Thanks. U helped me a lot as well. Noticed little mistake in string, so wanna post to help other ppl:
[QUOTE=OlivierC]
Audio Seek to (Mouse.X - progressBar.BBoxLeft)*Duration(tag)/progressBar.Width
[/QUOTE]

Right is put BackgroundBar instead of Progess:
Audio Seek to (Mouse.X - BackgroundBar.BBoxLeft)*Duration(tag)/BackgroundBar.Width
B
5
S
1
Posts: 12
Reputation: 477


Return to How do I....?

Who is online

Users browsing this forum: apalm1341, blissfulwizard and 17 guests