Upcoming SlideShare
×

# Flash

862 views

Published on

Published in: Technology, Education
1 Like
Statistics
Notes
• Full Name
Comment goes here.

Are you sure you want to Yes No
• Be the first to comment

Views
Total views
862
On SlideShare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
13
0
Likes
1
Embeds 0
No embeds

No notes for slide

### Flash

1. 1. Flash + Actionscript Workshop 7 February 2009 By CHIN Su Yuen (suyuen@gmail.com)   Getting Started Hi! In this workshop we will be going through the basics of Flash, Actionscript and also Flash + PHP communication. Part 1: Drawing basic shapes & curves In this section we will go through how to draw basic shapes and curves using the vector tools provided. A square 1. Before we begin, let us perform some basic setups. Create a new Flash Actionscript 3.0 document. 2. In the properties panel, you will be able to see the details of your stage. The size should be 550 x 400px. If it is not so, click on the “Edit” button beside the size and change its values. 3. In your timeline panel, you can see that “Layer 1” has already been added for you. To create new layers, you can click on the “New Layer” icon ( ) located on the bottom left of the timeline panel. You can also drag and drop layers to switch their positions. An object in an upper layer will appear on top of an object in the lower layer. Now double click on “Layer 1” and rename it “Square”.
2. 2. 4. Select the “Rectangle Tool” icon ( ) from the tools panel. Note that if you click on the “Rectangle Tool” again, you will see a list of other possible shapes like ovals and circles. After you’ve selected the “Rectangle Tool”, the properties panel will change to show the properties of the rectangle you are about to draw. 5. Under “Fill And Stroke”, you should be able to see this: The left, white-coloured box represents the outline colour (also known as stroke colour) of the rectangle. The box on the right represents the fill colour of the rectangle. Double click on the stroke colour box and change it to black. 6. Click and drag the cursor on the stage to draw your box. You should be able to see a rectangle of the colours you picked. Notice that the stroke/outline of the rectangle is a bit thin. Lets make it thicker. 7. Select the “Selection Tool” icon ( ) from the Tools panel. Bring your cursor close to the rectangle until you see a curved line close to your cursor. Click on the line. You will see that only one side of the rectangle’s outline has been selected. (Note that you can use the “Selection Tool” to remove / move parts of the rectangle away from the main shape). Double click on the line and all 4 lines of the rectangle will be selected. In the properties panel, you can move the “Stroke” slider to alter the thickness of the outline. Lets bring it to 2. Curves 1. Ok, now let us move to something more fun (hopefully)…. Drawing curves using the pen tool. Clear your stage by deleting the rectangle. Click on the “Pen tool” icon ( ) from your tools panel. 2. Draw one dot anywhere on the stage. For your second dot, click anywhere but this time, hold down the left mouse button and drag your
3. 3. cursor. You should be able to see a curve forming according to the tangent line as below. Continue doing this for the 3rd, 4th and XXXXth dots to create as many curves as you want. 3. What if you don’t like a curve you have created? No worries. It is adjustable. Select the Subselection Tool ( ) from the tools panel and click on the curve. You will be able to see small hollow squares representing the points you drew. Click on any one point and the tangent like before will appear at the selected point. Click and drag any of the ends of the tangent point and you will see the curve change. There you have it, the basics of shape and curve drawings in Flash! Part 2: Animations Now we are going to learn how animations work in Flash by creating a simple animation. 1. Assuming we are all lazy people and have images we already want to use, let us import the images we will be using into our Flash library. To do this, click File > Import > Import To Library. Note: If you import a file to a library, in the future when you want to use multiple instances of the file, all you have to do is drag and drop from the library onto the stage. This saves a lot of memory usage as Flash will only load the object once from the library instead of multiple times.