PDA

View Full Version : Animated volume control


gorbatchow
04-23-2010, 02:00 PM
Hi, I'm working with Flash from time to time, more as a designer than a programmer, so the AS skills are a bit limited :-)

Anyway, what I would like some help with is to create an animated volume control. Not to be confused with an ordinary slide volume control. Here's the scope, I divided it into 3 parts:

Part 1 - The interactive animation:
The movie contains of a movie clip with a can with an open lid (can_mc). can_mc contains of 39 frames where the lid goes from open to closed.
I would like the user to be able to drag the lid from open to closed and from closed to open with the mouse, and that the lid stays at the position where the user releases the mouse button, whether is fully closed, half closed, one third closed etc.

Part 2 - The volume control:
In the very same movie, at the main timeline I have another movieclip (looped) playing some sounds (sounds_mc), and I want the volume of these sounds to be controlled by the lid of the can so when the lid is closed the volume is 0, fully open the volume is full, and everything between.

Part 3 - The cookie:
Now, if the user have chosen to close the lid to turn off the sound, the sound shall be off and the lid closed even the next time the user visit the site. So some sort of cookie must be used I suppose.

Any help on any of the 3 parts is highly appreciated =)

TomMalufe
04-28-2010, 01:19 PM
This shouldn't be too hard. If you are using AS3 at least. I'm not sure how to do this in AS2 because it's been a while since I worked with AS2.

Anyways, in AS3 you would just have to watch for a MOUSE_DOWN event on your volume control which will then add to the stage MOUSE_UP and MOUSE_MOVE event listeners (maybe a MOUSE_LEAVE or MOUSE_OUT as well... up to you). You will need to store the mouse position and the change in position since last frame (or since MOUSE_DOWN, again up to you).
If the mouse has moved left or right you will need to add or subtract from the can_mc.currentFrame
when you change the can_mc.currentFrame you will also check which frame that is and decide calculate what % that is (21/39 = 54%) Use that to set the volume of your sound.

Store this volume level with a SharedObject. It's very easy to use and you can learn a bit more about it here:
http://help.adobe.com/en_US/AS3LCR/Flash_10.0/flash/net/SharedObject.html

gorbatchow
05-02-2010, 10:37 AM
Thanks Tom,
I took an a bit easier approach and skipped the volume part, so that you just have to click the lid to turn sound on and off, and a sharedObject to keep track of it. The result can be seen here: http://tonfiskburk.se