http://xtutorials.net

In this tutorial I will explain how to imitate a window in flash using simple Action Script.

In this tutorial I will show you how to make a very simple “window” in flash that you drag anywhere on the stage.

Let us start. Create a new document (or open the project in witch you want the window to be). Create a new MovieClip and name it “window”. Here let us draw the shape of our window without the title bar. Make it a rectangle and you can also ad some rounded corners. Chose the color that suits best for your project.

Using the Selection Tool select the top part of your window. This will be the title bar. Now right click on it and chose Convert to Symbol and chose Button. Name it titleBar.

Now from the Library double click the button. This should allow you to edit the appearance of the button. Edit the colors and you can also ad a simple gradient to it. Ad some text if you like to.

Back to our window MC. Select the titleBar (the button) and go to Actions. Here we will ad the action script.

Ad this AS to the button:

on(press){

this.startDrag();

}

on(release){

this.stopDrag();

}

on(releaseOutside){

this.stopDrag();

}

What does this do? Well…when we press the button everything that is in the window MovieClip will begin to drag…to follow the mouse. When we release it, everything stops in that place. For security reasons we also ad the on(releaseOutsite).

In the window if you want you can ad content like text, images or anything you like. I suggest create a new layer for this.

Now you should have something like this:

Just one more little problem to adjust. As you can see from the image, the mouse cursor changes into a hand when we are over the titleBar. A very simple thing will resolve this problem. Select the titleBar and ad an Instance Name to it…let’s say…b1. Now click on the frame where the button is and ad the following AS:

b1.useHandCursor = false;

This will make the button to leave the cursor as it is and doesn’t change it into a hand.

Test it and you will se the result.

Hope you enjoyed our small tutorial and hope to see you back soon.