Mokymosi naudotis Flash MX programa

1033 0

Flash MX TUTORIAL

In this tutorial I take you step-by-step through the process of creating this Flash MX movie. You will learn how to create graphics, work with layers, and add motion, sound, and text to your movie.

Getting Started

To begin, open Flash MX. You will be presented with the screen shown here.

The upper left corner of the screen displays the Tool palette, which contains tools you can use to create or modify graphics and text. You select a tool by clicking onn it. Tool modifiers for the selected tool display below the Tool palette. You use modifiers to set tool options.

The Timeline appears in the upper portion of the screen. You use the Timeline line to lay out the sequence of the movie.

The Stage displays in the center of the screen. You create your movie on the Stage.

Movie Properties

You start creating your movie by setting the Frame Rate, Dimensions, Background Color, and Ruler Units.

Frame Rate The speed of the movie

Dimension TThe size of the Stage.

Background Color The color of the Stage.

Ruler Units The unit of measure the ruler displays.

You set these properties in the Movie Properties dialog box.

To set the properties for the movie you are going to

o create:

1. Choose Modify > Document from the menu. The Movie Properties dialog box will open.

2. Type 5 in the Frame Rate field.

3. Type 400 px in the Width field.

4. Type 400 px in the Height field.

5. Click on the Background color box and set the Background color to white.

6. Select Pixels from the drop-down menu in the Ruler Units field.

7. Click on OK.

The Grid

In the exercises that follow, you will be creating graphics. When creating graphics, the grid is often helpful. To turn on the Grid:

1. Choose View > Grid > Edit Grid from the menu. The Grid dialog box will display.

2. Click on the Color box and select gray to have the gridlines display in gray.

3. Select Show Grid to cause the grrid to display.

4. Select Snap to Grid to cause the edges of your graphic to align with the grid lines.

5. Set the Horizontal field to 20 px to separate horizontal lines by 20 pixels.

6. Set the Vertical field to 20 px to separate vertical lines by 20 pixels.

7. Set the Snap Accuracy to Normal.

8. Click on OK.

The Oval Tool

In the exercise that follows you will use the Oval tool to draw an ellipse. You will then turn the ellipse into a symbol. Symbols ar

re reusable graphics you store in the Library. Later in the tutorial you will turn the ellipse into the button movie viewers press to start the movie.

To draw the ellipse:

1. Choose View > Antialias from the menu. Choosing Antialias will smooth the edges of your drawing.

2. Select the Oval tool. Two color boxes will appear on the Modifier panel. These color boxes are used to set the stroke and fill colors. The stroke color outlines your drawing. The fill color fills the center of your drawing.

You set the thickness of the Stroke line in the Stroke panel.

To set the thickness of the Stroke line:

1. Choose Window > Panels > Stroke from the menu. The Stroke panel will open.

2. Choose Solid from the drop down menu to select the type of line that will outline your drawing.

3. Type 3 in the Vertical field to set the line thickness.

4. Click on the Stroke color box and select black as your stoke color.

5. Click on the Fill color box and select navy blue as your fill color.

6. Click on the Stage and drag diagonally to draw an ellipse.

Creating a Symbol

You are now ready to turn the graphic (the ellipse) you created into a sy

ymbol and store the graphic in the Library. Items stored in the Library can be used later.

1. Select the Arrow tool.

2. Double-click on the ellipse.

3. Choose Insert > Convert to Symbol from the menu. The Symbol Properties dialog box will open.

4. Type Start Button in the Name field.

5. Select Button as the type of behavior.

6. Click on OK.

7. Choose Window > Library from the menu. The Library panel will open. You should see Start Button in the Library window.

8. Press the Delete key to delete the ellipse from the Stage. Don’t worry. You have a copy of the Start Button in the Library.

Note: When a panel is open (for example, the Library or Stroke panel) you can leave it open for future use. If a panel gets in your way, use the Tab key to toggle the panel display on and off.

1. Press the Tab key. The Library panel (and the Stroke panel if it is open) should disappear.

2. Press the Tab key again. The Library panel (and the Stroke panel if it is open) should reappear.

Gradients

When you click on the Fill color box, the Fill dialog box shown here will open.

Gradients display on the bottom row and show gradations of

f color. You will use a gradient to create the movie’s sky. First, you must create the gradient you will use.

To create the gradient:

1. Choose Window > Panels > Fill from the menu. The Fill panel will appear.

2. Select Linear Gradient from the drop-down menu.

3. Click on the first Edit Gradient Range icon. A color box will appear.

4. Click on the color box and select blue.

5. Click on the second Fill Gradient Range icon. Click on the color box and select white.

6. Move the second Fill Gradient Range icon to the three-quarter point on the Gradient Range slider.

7. Click on the Save icon.

The Rectangle Tool

You use the Rectangle Tool to draw rectangles and squares. In this exercise you will create a rectangle and fill it with the gradient you just created. You will then turn the resulting graphic into a symbol and use it later to create the sky.

1. Select the Rectangle tool.

2. Move to the Stroke panel. If the Stroke Panel is not open, choose Window > Panels > Stroke from the menu to open it.

3. In the Stroke Panel, select Hairline from the drop-down menu.

4. In the Stroke color box, select black.

5. In the Fill color box, select the gradient you created.

6. Click on the Stage and drag diagonally to create a rectangle.

Later you will use the graphic you just created. For now, turn it into a symbol.

1. Select the Arrow tool.

2. Double-click on the graphic.

3. Choose Insert > Convert to Symbol from the menu. The Symbol Properties dialog box will open.

4. Type Sky in the Name field.

5. Select Graphic as the Behavior.

6. Click on OK to store the graphic in the Library.

7. Press the Delete key to remove the graphic from the Stage.

The Pencil Tool

You use the Pencil tool to draw freehand shapes. You need to draw a tree trunk and a treetop to create a tree.

Create the Tree Trunk

1. Choose View > Grid from the menu. Deselect Snap to Grid.

2. Select the Pencil tool.

3. Click on the Stroke color box and select brown as the stroke color.

4. Click on the Fill color box and select brown as the fill color.

5. On the Modifier panel, select the Smooth option. This option rounds the corners of your drawing.

6. Draw the tree trunk.

7. Select the Paint Bucket tool. You use the Paint Bucket tool to fill enclosed areas with color.

8. Click inside the trunk to fill the trunk with color.

Note: If your tree trunk does not fill with color, you might have gaps. To close the gaps, click on the Gap Size modifier and choose Close Large Gaps.

Create the Tree Top

1. Select the Pencil tool.

2. Click on the Stroke color box and select green as the stroke color.

3. Click on the Fill color box and select green as the fill color.

4. Draw a treetop like the one shown here.

5. Select the Paint Bucket tool.

6. Click inside the treetop to fill the treetop with color.

Create the Tree

1. Select the Arrow tool.

2. Double-click on the treetop.

3. Drag the treetop over the tree trunk.

Grouping

Flash MX views the tree as two objects, the treetop and the tree trunk. In the next exercise you will group the treetop and the tree trunk to cause Flash MX to view the tree as a single object. Then you will turn the tree into a symbol.

1. Select the Arrow tool.

2. Use the Arrow tool to create a rectangle around the tree. This selects the tree.

3. Choose Modify > Group from the menu to make the treetop and the tree trunk a single object.

4. Choose Insert > Convert to Symbol from the menu. The Symbol Properties box will open.

5. Type Tree in the Name field.

6. Select Graphic as the Behavior type.

7. Click on OK. The tree should appear in the Library.

8. Press the Delete key to remove the tree from the Stage.

Drawing a Car

In this exercise you will create a car. You will use the car later.

Draw a Hubcap

Start your car by drawing a hubcap.

1. Choose View > Grid > Snap to Grid from the menu.

2. Select the Oval tool.

3. Click on the Stroke color box and select gray as the stroke color.

4. Click on the Fill color box and select gray as the fill color.

5. Click in the upper corner of a square and drag diagonally to draw a circle.

Convert the Hubcap to a Symbol

Converting the hubcap to a symbol places the hubcap in the Library. Later you will take 2 copies of the hubcap out of the library and place one copy on each tire.

1. Select the Arrow tool.

2. Double-click on the circle.

3. Choose Insert > Convert to Symbol from the menu. The Symbol Properties dialog box will open.

4. Type Cap in the Name field.

5. Select Graphic as the Behavior type.

6. Click on OK.

7. Press the Delete key to remove the cap from the Stage.

Draw the Tires

Draw two tires. Look at the in the graphic below and place the tires on the grid exactly as shown.

1. Select the Oval tool.

2. Click on the Stroke color box and select black as the stroke color.

3. Click on the Fill color box and select black as the fill color.

4. Draw the two tires as show in the graphic.

Draw the Chassis

You use the Line tool to draw straight lines. Use the Line tool to draw the car chassis. But first, you need to set the stroke line size.

1. Select the Line tool.

2. Move to the Stroke panel. If the Stroke panel is not open, choose Window > Panels > Stroke from the menu to open it.

3. Select Solid from the drop-down menu.

4. Type 3 in the Vertical field to set the line thickness.

5. In the Modifier panel, click on the Pencil Mode icon. Select Straighten. This will help you draw straight lines.

6. Draw the chassis as shown in this graphic.

Fill the Car with the Color Red

1. Select the Paint Bucket tool.

2. Click on the Fill color box and select red as the fill color.

3. Click on the car to apply the fill color.

Fill the Headlights with the Color White

1. Select the Paint Bucket tool.

2. Click on the Fill color box and select white as the fill color.

3. Click inside the headlight area.

Add the Hubcaps

1. Select the Arrow tool.

2. Move to the Library panel. Choose Window > Library from the menu if the Library is not open.

3. Click on the icon next to Cap and drag a copy of Cap to the center of one tire.

4. Click in the icon next to Cap again and drag another copy of Cap to the center of the other tire.

5. Use the arrow keys to adjust the location of the hubcaps. Your car should look like the one shown here.

Group the Car

You want Flash to view the car as a single object. You need to group the car.

1. Select the Arrow tool.

2. Create a rectangle around the car to select to car.

3. Choose Modify > Group from the menu.

Convert the Car to a Symbol

1. Choose Insert > Convert to Symbol from the menu. The Symbol Properties dialog box will open.

2. Type Car in the Name field

3. Select Graphic as the Behavior.

4. Click on OK. Flash MX will store the graphic in the Library.

5. Press Delete to remove the car from the Stage.

Creating Your Movie

You have created all of your graphics and have stored them as symbols. You are now ready to create your movie. Start by drawing buildings.

Draw the Buildings

1. Select the Line tool.

2. Move to the Stage and draw buildings as shown in the illustration.

Add Color to the Buildings

Fill the first building with color:

1. Select the Paint Bucket tool.

2. Select tan as the fill color.

3. Click in the first building to fill the building with color.

Fill the next building with color:

1. Select green as the fill color.

2. Click in the second building to fill the building with color.

Fill the last building with color:

1. Select pink as the fill color.

2. Click in the last building to fill the building with color.

Layers

Think of a layer as a transparent sheet on which you paint. You can see through each layer to the layers under it until you add color. You can add layers, delete layers, and change the position of layers. Each layer is independent of all other layers. The layer you are currently working on is called the active layer. You can view layer information on the Timeline.

Renaming a Layer

Change the name of the current layer:

1. Double-click in the layer name area of the Timeline.

2. Type Building to change the layer name.

Adding New Layers

Create a new layer for the sky.

1. Choose Insert > Layer from the menu to create a new layer above the active layer.

2. Double-click in the layer name area of the Timeline.

3. Type Sky to name the layer.

Create the Sky

1. Make sure Sky is the active layer. When a layer is active, it is highlighted. You click on the layer name to make a layer active.

2. Move to the Library panel. If the Library panel is not open, choose Window > Library from the menu to open the Library.

3. Click on the icon next to Sky and drag a copy of Sky onto the Stage.

Rotate and Scale

You use the Arrow tool to resize (scale) and rotate an object. You need to resize and rotate the Sky symbol to create the sky.

1. Select the Arrow tool.

2. Select the Rotate modifier.

3. Grab a corner handle and drag t

. . .

Join the Conversation

×
×