Vectorials
Flash Perfection
3D Lessons
Tutorialkit
Markup Tutorials
Learn PHP
network
adv banner
Flash & Swish  Home Flash & Swish Flash Tutorials Creating a Sliding Volume Control
rss

Creating a Sliding Volume Control

Author: Bluegelmedia.com More by this author


Creating a Sliding Volume ControlCreate a MC (we'll call it "ambience2") In our MC's timeline we will do the following:

Layer1: this is the layer we will place our frame scripts in..
— first frame we leave blank,
— second frame : (place a lablel on this frame, we will call it "on")

stop ();
s = new Sound(_root.ambience2);


// this code sets the variable s to the be a sound object
// leaving a blank space between parentheses will control all the sounds in the movie rather than just the sound in the MC "ambience2". // (_root.ambience2) tells our variable to be specific only to our MC which is where we are holding our sound

layer 2:
— first frame blank,
— second frame

place the music or sound you wish to control (you will want to loop this sound many times. I suggest using 999),

Now place the MC "ambience2" onto the main timeline and be sure to name it in the MC properties box. "ambinece2"

// placing the sound in a movie clip allows us to control only that one sound,
// you may wonder why frame 1 is just sitting there empty. This will allow us to create an on and off button which we can place beside the volume slide. If we don't care about on and off buttons we can just use frame 2 only (both layers).

if you want the on off buttons: (if not then skip to "create volume control" below)

label frame two of the sound MC "on" .

now place two buttons on the main timeline:

put the following script on the "on" button:

on (release) {
with (_root.ambience2) {
gotoAndPlay ("on");
}
}

place the following script on the "off" button:

on (release) {
stopAllSounds ();
}

Create volume control

— create a button to use on the volume slider
— place that button into a MC (just click on the button and press f 8) We will refer to this MC as "slider button"
— apply the following code to the button within the this MC

This code will define the drag.

on (press) {
startDrag ("", false, left, top, right, bottom);
dragging = true;
}
on (release, releaseOutside) {
stopDrag ();
dragging = false;
}

the "false, left, etc." are variables which we define in the step below. This allows us
to define the rectangular area of drag without using specific coordinates. The button can
then be moved around to wherever without redefining the coordinates.

— apply the following code to the "slider button" MC which holds our button slider (the one we made in the previous step)
the first part of this code defines the variables for the drag constraint mentioned above,
the second sets the volume and defines by how it changes when the button moves.

onClipEvent (load) {
top = _y;
left = _x;
right = _x+100;
bottom = _y;
}
onClipEvent (enterFrame) {
if (dragging==true) {
_root.ambience2.s.setVolume(100-(_x-left));
}
}

Now all you have to do is draw a line and place your "slider button" on it. Bingo, a sliding volume control.

Notes:

"left" is determined when the movie loads and is then the same throughout the movie
unless changed. (which in this case it won't be)

_root.ambience2.s.setVolume(100-(_x-left));

this is where we start the volume at 100 then subtract (the current _x value - left)

so if at the movie's start the MC was at _x=100 (thus left = 100), and we move the slider
to _x = 175, we have 100 - (175-100) I'm believe that it doesn't recognize neg. numbers and
so we have 25 for our volume.

To create a slider which starts in the middle and has volume at 50 and goes both ways

onClipEvent (load) {
top = _y;
left = _x-50;
right = _x+50;
bottom = _y;
}
onClipEvent (enterFrame) {
if (dragging==true) {
_root.ambience2.s.setVolume(100-(_x-left));
}
}

if you do this you need to set the volume (inside the MC "ambience2" using setVolume method)
to 50 so that the sound starts in the middle rather than at 100 which is flash default.

Here are some examples of how different numbers will effect the outcome of your slider.



Rate this Material: Bad 1 2 3 4 5 Excellent
print this page tell a friend subscribe to newsletter subscribe to rss

Add comments to "Creating a Sliding Volume Control"