Hello everyone, we are media have come up with a new tutorial, where we'll show you how to manipulate the sound volume using a slider in Flash ActionScript as 3.0. So let's go to the ActionScript 3.0 for a new file. Before creating the slider, we will see how to call the sound on the stage using ActionScript. First things first, so, let's import the sound we will be playing into the library File menu. Import to library and pick the sound file you have. Press Ctrl plus L to get library and here you can see the imported sound file in the library, create one sound folder and shift that sound file inside the folder.

We are not going to drag that sound directly on the stage to get played. But we want to play the sound using ActionScript. For that, we have changed some properties of that sound file in the library, right click on the sound file and click on linkage. Here, we get one linkage Properties window. In this, check for the option, export for ActionScript. With that, export in the first frame will be default checked.

Keep it so don't even change anything in the base class option. Above that, you can rename the sound class, whatever you want. We right here, my sound. Click ok. You will face one more ActionScript class warning dialog box. Click OK for that too. So finally That's our sound to be played.

Named the layer as action where we need to write the script for the sound, press f9 to get the action panel and the variable SMD and put the name you use for class that is my sound dented take another variable to set the sound channel. Variables are simple data containers, which allow you to store values that you use in your program. Here to this channel variable, the about snd variables value has to be assigned. So our sound file in the library that is my sound is called our variable s nd and we have created a new channel named sound channel where the SMD variable will be played. Let's face the movie, and that sound file should play it plain. That means sound from the library is attached successfully, so this part is done.

Moving ahead with the next part, we need one slider to control the volume of the same sound file. So let's start. Add a New Layer named volume underscore slider. And with the line tool, draw a track as seen in the video. From the Properties panel, change its width to 100. Press f8 to convert it to a movie clip.

Name ID volume. Also keep its registration point at center left. Step inside name that layer has line and converted into a movie clip named line and keep the registration point where it is. That is on center left on another layer. Let's draw a knob Remove the outline and keep the knob size to perfect 20 by 20 pixels converted in a movie clip named knob and keep the registration point at center left for this to let's align the knob to the extreme left of the track. Then now let's give each movie clip its instance name to use it in action script.

Instance name for the knob will be knob underscore MC, and for the line will be line underscore MC. Step outside and give the instance name as volume underscore MC for the single movie clip of the volume controller play and notice that we need to add an action script so that the knob can be tracked on this slider. So in the action panel, let's define the function to drag the knob on mouse event. Here we need to mention the line width so that the norm will be dragged till that length. Remember, the knob has its own word. So at the same time we need to minus the knobs with from the lines with too.

Now, let's call the above function on the mouse down event of the knob movie clip. Done. That's the movie itself happening. We need to add the action so that the knob drug should stop at a given point whenever the mouse is up or rolled out of the knob. Firstly, let's write a function to stop the drug. No, I didn't eventlistener listener to call this stop drag function when the mouse is up from the knob.

Add one more similar event listener for the same function to happen when the mouse is moved out from the knob. Test the movie, start stop dragging of the knob is successfully done. Know, the sound volume should go low and high according to the knob slide. So, we need to add the action on the knobs enter frame event, such in a way that the volume transform connects to the knobs exposition. So, let's start with the knobs enter frame function. As it's an enter frame function, it will be only event We need to connect the volume Transform to the knobs exposition.

So, create a variable, its type will be number in which only numerical values can be stored. Save the knobs exposition Now, according to the track line length, the knobs exposition will vary in between zero to hundred. And the sound transformer is always set in between zero to one. So, the knobs exposition will have to be divided by hundred. Similarly, to get one more variable sound transform in which the volume variables value can be set. That means, in the volume variable, we stored the knobs exposition divided by 100 that is numerical value And then we assigned it to the sound transform variable.

Now this sound transform has to be applied to our, my channel where our actual sound is playing. So, we said that sound transform to my channel. Now, we need to add an event listener for the knob, enter frame interframe will be in caps. That's the format for the The current position of our knob is zero. By default, if we need to keep it as hundred, then by this calculation, hundred divided by 100, that is, one will be its maximum slide position to get the sound play that the loudest. So let's set the knobs position now.

That will be 80 because the knobs with that is 20 will minus from the tracks total width that is hundred. So 80 will be the position when the knob will be at its highest point. Test the movie. The sound is playing at maximum by default, and slowing down when the knob is moved to the lower side. That's not all Let's add one volume button or say mute button, which can switch on and have the sound on one click and add it on a new layer named button. Get the mute button from components video and place it on the stage closer to the volume slider.

We will need this in the ActionScript so give it an instance name, mute underscore MC. Step inside its movie clip, you will see two layers containing mute on and mute of icons. By default, we want to display mute on icon first. So move the mute off to the second frame. Test the movie, the mute on and off icons are playing continuously. To stop that, open the action panel again and add the action tested animation is stopping on the first frame.

Now, on one click, the mute on icon should change to the mute of icon and vice versa. For that, we need to add a table. We take the variable I go down and write a function to change the mute icon on click. That means on all clicks, it should change to mute off, and on even clicks it should show mute on icon. For that, we will use conditional statements. conditional statements are logical loops, which are of different types like if else Loop do while loop and four in loop.

Here we will use the if else conditional statement. The if else conditional statement allows you to test the condition you can taste for more than one condition using the if else conditional statement. The curly brackets are also used for looping statements. Here we mean if I is divided by two and remains zero. Then the next instruction is to be added below that is, the mute icon should go to ensure frame number two, on which the mute of icon is placed. Similarly, else condition is to be added.

Done. So this conditional statement completely means, if I variable is divided by two and result zero, then it should go and stop at frame number two inside mute underscore MC movie clip. Else means if the if condition doesn't apply, that is, if zero is not the result, after dividing it by two, then it should go and stop at frame number one inside the same mute underscore MC movie clip. hope this is clear. Now, this function is to be called on the mute buttons click event. Done.

Let's say it's the movie now. After the click, the mute on icon is changing to the mute of icon bar. It's not happening vice versa. Let's see the reason. Here we have given the AI variable a zero value. So as per the if condition, if the AI is divided by two, and results, zero means zero divided by two results in zero.

That is why it moves to frame number two, and choose the mute of icon. But every time I is going to be zero, that means the else condition will never get applied. Because every time for mouse click, it is an even click. In this situation, what we need to do is increase the I variables value after the if else condition. So we are adding as i plus plus. That means the number of clicks will keep on increasing the I value.

In short, before any click, I will be zero The first click, I will get value of one. On the second click, I will be two. On the third click, I will be three, and so on it will continue. On this basis, even or clicks should be calculated properly. Let's face the movie after this change this word you can see now on each click, the mute icon is changing. Now the lung spot, the sound should also go on enough on the mute icon clicks.

Remember, the volume already varies according to the knobs exposition. So, by simple logic, even if we connect the knobs, exposition on the mute icon clicks, then also the end result is possible. Press f9 for action panel. Now, in if condition, let's set the knobs, exposition to zero. That means when the mute button will show the mute off icon. Same time, the knob will move to lowest side and the sound will go off.

And in else condition, let's set the knobs exposition to 80. That is the track length minus the knob worth. This means when the mute button will show the mute on icon. At the same time, the knob will move to the peak point, and the sound will play at its loudest. Let's face the movie now, individually, the knob slider movement is affecting the sound volume, but not the knob icons. But when clicked on the mute button, the icon changes to the mute of icon and also the sound goes off.

And on the second click on the mute button, the icon changes to the mute on icon and then the sound goes on. So what we want now is the mute icon also change Just it's on and off icons on the sliders exposition is going to be the last scripting part. With the knobs exposition is zero, the icon should change to the mute of icon and on x equal to 80 position, the icon should change to the mute on I can open the action panel in the volume underscore set function. Add a conditional statement that if the nonce value goes to zero or less than zero, then it should show frame number two of mute underscore MC movie clip. That is the mute of icon as it should display framed Number one of the mute underscore MC movie clip. That is the mute on icon.

Let's take the movie for the last time now. Yes, when we move the slider to the lowest side, the mute icon is changing to mute off and when it is moved towards the higher side, the mute icon is changing to mute on. Even the clicks on the mute icons are working very well. Most importantly, save your file and enjoy the output. So this is it. Be creative hear a sound slider along with a volume controller I can hope you guys liked it and learned it very well out of the media we'll see you with next flash ActionScript 3.0 tutorial.

Thank you for watching