Actionscript 3.0 for adobe flash professional cs5 classroom in a book pdf free –

  • Home
  • dlms
  • Actionscript 3.0 for adobe flash professional cs5 classroom in a book pdf free –

Looking for:

Actionscript 3.0 for adobe flash professional cs5 classroom in a book pdf free –

Click here to Download

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
X begins at 0 and increases to the right, and Y begins at 0 and increases downward. You may use them on one computer at a time. The frequency of random jumps increases based on the Random value. Page Animating Transformations
 
 

 

Actionscript 3.0 for adobe flash professional cs5 classroom in a book pdf free.Adobe Flash Professional CS5 Classroom in a Book

 

Readers will also learn to use third-party libraries and create Adobe Air applications. The companion CD provides users with all the sample files they need to complete all the projects.

Simply register your product at www. The Adobe Creative Team of designers, writers, and editors has extensive, real-world knowledge of Adobe products. This book will show you how to make your very own next-gen 3D games in Flash.

If you have ever dreamed of writing Flash enables you to create animations and can also be used to build an interactive, multimedia Web site. Completely enhanced and revised, this must-have reference covers everything you need to know to learn and master the latest version of Flash. Top Flash trainer and author Todd Perkins provides you with unparalleled comprehensive coverage of tips, tricks, and techniques that you won’t find in any other resource.

The reader-friendly format will appeal to both the novice as well as the accomplished professional and everyone in between. Todd Perkins. Pressing the Shift key lets you change the shape uniformly so the oval maintains its aspect ratio. Your coffee cup now is filled with coffee!

Changing shape contours With the Selection tool, you can push and pull lines and corners to change the overall contours of any shape. A curved line appears near your cursor, indicating that you can change the curvature of the stroke.

The sides of the coffee cup bend, giving the coffee cup a slight bulge. The coffee cup now has a more rounded body. If you want to change the properties of any stroke or fill, you can use the Ink Bottle tool or the Paint Bucket tool. Close the gap, or at the bottom of the Tools panel, choose to close different gap sizes for your Paint Bucket tool. The fill of the top oval changes to the darker brown color. The stroke around the surface of the coffee changes to a darker brown color.

By default, Flash uses merge drawing mode, but you can enable object drawing mode or use the Rectangle Primitive or Oval Primitive tool to use the primitive drawing mode. Merge drawing mode In this mode, Flash merges drawn shapes, such as rectangles and ovals, where they overlap, so that multiple shapes appear to be a single shape.

If you move or delete a shape that has been merged with another, the overlapping portion is permanently removed.

To enable object drawing mode, select the tool you want to use, and then click the Object Drawing icon in the options area of the Tools panel. Unlike regular objects, however, you can modify the corner radius of rectangle primitives as well as the start and end angle, and the inner radius of oval primitives using the Properties inspector. Currently, you have a solid tan color, but you can also have a gradient or a bitmap image such as a JPEG file as a fill, or you can specify that the object has no fill at all.

In a gradient, one color gradually changes into another. Flash can create linear gradients, which change color horizontally, vertically, or diagonally; or radial gradients, which change color moving outward from a central focal point. You can import a bitmap file in the Color panel. By default, a linear gradient moves from one color to a second color, but you can use up to 15 color transitions in a gradient in Flash.

A color pointer determines where the gradient changes from one color to the next. Add color pointers beneath the gradient definition bar in the Color panel to add color transitions. Select the fill that represents the front surface of the coffee cup. In the Color panel, choose the Fill color icon and select Linear gradient.

The front surface of the coffee cup is filled with a color gradient from left to right. You can also choose a color from the color picker or double-click the color pointer to choose a color from the color swatches. The gradient fill for the coffee cup gradually changes from light tan to dark tan across its surface. The gradient fill for the coffee cup gradually changes from light tan to white to dark tan.

The Lock Fill option locks the current gradient to the first shape to which it was applied so that subsequent shapes extend the gradient. The gradient is applied to the back surface.

Using the Gradient Transform tool In addition to choosing colors and positioning the color pointers for a gradient, you can adjust the size, direction, or center of a gradient fill. The Gradient Transform tool is grouped with the Free Transform tool. Transformation handles appear. Drag the center circle to move the gradient to the left so the white highlight is positioned slightly left of center. The coffee cup now has more realism because the shadows and highlights make it appear that the front surface is convex and the back surface is concave.

A JPEG image of foam will be used as a bitmap fill. The top surface of the coffee fills with the foam image. The cup of coffee is complete! Rename the layer containing your completed drawing coffee. A group holds together a collection of shapes and other graphics to preserve their integrity. When grouped, you can move the coffee cup as a unit without worrying that it may merge with underlying shapes.

Use groups to organize your drawing. The cup of coffee is now a single group. When you select it, a blue outline indicates its bounding box. Notice that all the other elements on the Stage dim, and the top horizontal bar above the Stage displays Scene 1 Group. This indicates that you are now in a particular group and can edit its contents. Many options allow you to quickly and easily build symmetrical designs, grids, or branching-type flourishes.

Notice the top horizontal bar above the Stage, which indicates you are currently editing the symbol called line. You will now draw a line for this symbol. A hairline stroke maintains a uniform thin thickness regardless of how large or small you scale it.

Make the line about 25 pixels high. Your new symbol called line has been created and is stored in your Library panel for later use.

With these Deco tool options, you can create a repeating pattern of the line symbol that is symmetrical around a point. A green guide appears on the Stage that shows the center point, the main axis, and a secondary axis that determines how frequently the symbol is repeated.

The initial line should be vertical. The resulting pattern is a group consisting of a number of line symbols. The bubble should be located exactly in the center of the radiating lines, and for that, you can turn to the Align panel.

The Align panel, as you might guess, aligns any number of selected objects horizontally or vertically. It can also distribute objects evenly.

To select no fill, choose the color box that has a diagonal red line through it. Select Hairline for Stroke Style. Hold down the Shift key while you draw a small circle on the Stage.

The star-shaped group and the oval become aligned horizontally. The star-shaped group and the oval become aligned vertically. The group of lines breaks into its component parts and becomes a collection of line symbols. The collection of line symbols breaks into its component parts and becomes a collection of strokes. The lines and center circle become a single group. Use the Transform tool to scale the bubbles to different sizes.

Choose a dark brown color for the Pattern color and leave Pattern size and Pattern width at their default values. In the Properties inspector, click the Edit Stroke Style button to customize the stroke for dashed lines. The Decorated Brush creates dashed lines giving your coffee cup a little more life!

Select the Branch option and leave the colors and sizes at their default values. The flowers, leaves, fruits, and branches are generated repeatedly as you move your brush over the Stage.

The flower decorations are combined into a single group so you can move or modify them as a unit. For more precise control, you can use the Pen tool. When you want to create a smooth curve, click and drag with the Pen tool. A handle appears from the anchor point, indicating the curvature of the line.

Make the width of the wave wider than the Stage. It takes practice to get used to the Pen tool. Use the Selection tool or the Subselection tool to refine your curves. This indicates that you can edit the curve. If a corner appears near your cursor, this indicates that you can edit the vertex. Deleting or adding anchor points Use the hidden tools under the Pen tool to delete or add anchor points as needed.

Transparency can be applied to either the stroke or the fill. Transparency is measured as a percentage and is referred to as alpha. Modifying the alpha value of a fill 1 Select the shape in the dark brown wave layer. The Paste in Place command puts the copied item in the exact same position from where it was copied.

Transparencies are indicated by the gray pattern that appears behind the color swatch. After you click on a shape with the Eyedropper tool, Flash automatically provides you with the Paint Bucket tool or the Ink Bottle tool with the selected color and associated properties that you can apply to another object.

Your tool automatically changes to the Paint Bucket with the sampled fill color. The fill in the light brown wave layer changes to match that of the one in the dark brown wave layer. Undo this step to return to the two different colored wave shapes. When you create text on the Stage and publish your project, Flash automatically includes all the necessary fonts to display the text correctly.

Using the Text tool 1 Select the top layer. Alternately, you can click and drag out a text box to define the maximum width of your text. Review Answers 1 The three drawing modes are merge drawing mode, object drawing mode, and primitive drawing mode. If needed, delete the previous lesson folder from your hard drive and copy the Lesson03 folder onto it. The movie clip, graphic, and button symbols are three types of symbols that you will be creating and using often for special effects, animation, and interactivity.

The project is a static illustration of a cartoon frame. Learning how to work with symbols is an essential step to creating any animation or interactivity. However, for complex drawings, you may prefer to create the artwork in another application. Adobe Flash Professional CS5 supports a variety of graphic formats, including Adobe Illustrator files, so you can create original artwork in that application and then import it into Flash. When you import an Illustrator file, you can choose which layers in the file to import and how Flash should treat those layers.

A check mark should appear in the check box next to each layer. If you only want to import certain layers, you can deselect the layers you want to omit. About Symbols A symbol is a reusable asset that you can use for special effects, animation, or interactivity. There are three kinds of symbols that you can create: the graphic, button, and movie clip.

Symbols can reduce the file size and download time for many animations because they can be reused. You can use a symbol countless times in a project, but Flash includes its data only once.

Symbols are stored in the Library panel. When you drag a symbol to the Stage, Flash creates an instance of the symbol, leaving the original in the Library. An instance is a copy of a symbol located on the Stage. You can think of the symbol as an original photographic negative, and the instances on the Stage as prints of the negative.

With just a single negative, you can create multiple prints. Alternatively, you can even copy artwork from Illustrator and paste it into a Flash document. In fact, you can use many of the same symbol keyboard shortcuts in both Illustrator and Flash: Press F8 in either application to create a symbol.

When you create a symbol in Illustrator, the Symbol Options dialog box lets you name the symbol and set options specific to Flash, including the symbol type such as movie clip and registration grid location. If you want to edit a symbol in Illustrator without disturbing anything else, double-click the symbol to edit it in isolation mode. Illustrator dims all other objects on the artboard. When you exit isolation mode, the symbol in the Symbols panel—and all instances of the symbol—are updated accordingly.

Use the Symbols panel or the Control panel in Illustrator to assign names to symbol instances, break links between symbols and instances, swap a symbol instance with another symbol, or create a copy of the symbol. Copying and Pasting Artwork When you copy and paste or drag and drop artwork between Illustrator and Flash, the Paste dialog box appears. You can paste the file as a single bitmap object, or you can paste it using the current preferences for AI files.

Just as when you import the file to the Stage or the Library panel, when you paste Illustrator artwork, you can convert Illustrator layers to Flash layers. Symbols are simply containers for your content. At any time, you can go inside your symbol and edit it, which means editing or replacing its contents.

Each of the three kinds of symbols in Flash is used for a specific purpose. Movie clip symbols Movie clip symbols are one of the most common, powerful, and flexible of symbols. When you create animation, you will typically use movie clip symbols. You can apply filters, color settings, and blending modes to a movie clip instance to enhance its appearance with special effects. Also notable is the fact that movie clip symbols contain their own independent Timeline.

You can have an animation inside a movie clip symbol just as easily as you can have an animation on the main Timeline. This makes very complex animations possible; for example, a butterfly flying across the Stage can move from left to right as well as have its wings flapping independently of its movement.

Most important, you can control movie clips with ActionScript to make them respond to the user. For instance, a movie clip can have a drag-and-drop behavior. Button symbols Button symbols are used for interactivity. They contain four unique keyframes that describe how they appear when the mouse is interacting with them. However, buttons need ActionScript functionality to make them do something. You can also apply filters, blending modes, and color settings to buttons.

Graphic symbols Graphic symbols are the most basic kind of symbol. However, in some cases when you want an animation inside a graphic symbol to be synchronized to the main Timeline, graphic symbols are useful.

In Flash, there are two ways to create a symbol. Flash will bring you to symbol editing mode where you can begin drawing or importing graphics for your symbol. Whatever is selected will automatically be placed inside your new symbol. Both methods are valid: Which you use depends on your particular workflow preferences. Most designers prefer to use Convert to Symbol F8 because they can create all their graphics on the Stage and see them together before making the individual components into symbols.

For this lesson, you will select the different parts of the imported Illustrator graphic, and then convert the various pieces to symbols. The Registration indicates the registration point of your symbol. Leave the registration at the top-left corner. The hero symbol appears in the Library. Name it robot. You now have two movie clip symbols in your Library and an instance of each on the Stage as well. The Photoshop file contains two layers with a blending effect. A blending effect can create special color mixes between different layers.

The other option, Flatten bitmap image, will not preserve any layer effects such as transparencies or blending. You also have the option of changing the Flash Stage size to match the Photoshop canvas. However, the current Stage is already set to the correct dimensions pixels x pixels. You can edit any image on the Stage or in the Library panel in Adobe Photoshop CS5 or any other image-editing application.

Flash launches the application, and once you have saved your changes, your image is immediately updated in Flash. The two Photoshop layers are imported into Flash and placed on separate layers on the Timeline. The Photoshop images are automatically converted into movie clip symbols and saved in your Library.

All the blending and transparency information is preserved. Editing and Managing Symbols You now have multiple movie clip symbols in your Library and several instances on the Stage.

You can better manage the symbols in your Library by organizing them in folders. You can also edit any symbol at any time. A new folder is created in your Library. Use JPEG files for images that include gradients and subtle variations, such as those that occur in photographs.

GIF files are used for images with large solid blocks of color or black and white line drawings. Use PNG files for images that include transparency. Use PSD files if you want to retain all the layer, transparency, and blending information from a Photoshop file. Flash handles bitmap images as a series of colored dots or pixels ; vector graphics are handled as a series of lines and curves. This vector information is rendered on the fly, so that the resolution of vector graphics is not fixed like a bitmap image.

That means you can zoom in on a vector graphic and your computer will always display it sharply and smoothly. To convert a bitmap to a vector, import the bitmap image into Flash. The options determine how faithful of a trace the vector image will be to the original bitmap.

In the following figure, the left image is an original bitmap and the right image is a vector graphic. Exercise caution when using the Trace Bitmap command, because a complicated vector graphic is often more memory and computer-processor intensive than the original bitmap image.

Flash takes you to symbol editing mode. In this mode, you can see the contents of your symbol, in this case, the robot on the Stage.

Notice on the top horizontal bar that you are no longer in Scene 1 but are inside the symbol called robot. You will need to double-click the drawing groups several times to drill down to the individual shape that you want to edit. Select a new fill color and apply it to the shape on the robot drawing. Or, from the top-right Options menu in the Library, choose Duplicate. An exact copy of the selected symbol will be created in your Library.

The movie clip symbol in the Library reflects the changes you made. The instance on the Stage also reflects the changes you made to the symbol. All instances of the symbol on the Stage will change if you edit the symbol.

You can do so by double-clicking an instance on the Stage. This editing mode is called editing in place. Flash dims all other objects on the Stage and takes you to symbol editing mode. You can also just double-click any part of the Stage outside the graphic with the Selection tool to return to the next higher group level. The movie clip symbol in the Library panel reflects the changes you made. All instances of the symbol will change according to the edits you make to the symbol.

Breaking apart a symbol instance If you no longer want an object on the Stage to be a symbol instance, you can use the Break Apart command to return it to its original form. Flash breaks apart the robot movie clip instance. A new instance appears. Control handles appear around the selected instance.

With the Free Transform tool, flip the robot, resize it, and make it overlap the second robot. The robot army is growing! Using rulers and guides You may want to be more precise in your placement of your symbol instances. In Lesson 1, you learned how to use the X and Y coordinates in the Properties inspector to position individual objects.

In Lesson 2 you learned to use the Align panel to align several objects to each other. Another way to position objects on the Stage is to use rulers and guides. Rulers appear on the top and left edge of the Pasteboard to provide measurement along the horizontal and vertical axes.

Guides are vertical or horizontal lines that appear on the Stage but do not appear in the final published movie. Horizontal and vertical rulers measuring in pixels appear along the top and left edges of the Pasteboard. As you move objects on the Stage, tick marks indicate the bounding box positions on the rulers. A colored line appears on the Stage that you can use for alignment. The Move Guide dialog box appears.

The guide is repositioned pixels from the top edge of the Stage. Objects will now snap to any guides on the Stage. Changing the Color Effect of Instances The Color Effect option in the Properties inspector allows you to change several properties of any instance: These properties include brightness, tint, or alpha.

Brightness controls how dark or light the instance appears, tint controls the overall coloring, and alpha controls the level of opacity. Decreasing the alpha value decreases the opacity and increases the amount of transparency. The robot instance on the Stage becomes darker and appears to recede into the distance. The orb in the flare layer on the Stage becomes more transparent. You saw how the instance in the flare layer had the Lighten option applied to it carried over from Photoshop , which integrated it more with the instance in the Background layer.

There are many kinds of Blending options. Some have surprising results, depending on the colors in the instance and the colors in the layers below it. Experiment with all the options to understand how they work. The following figure shows some of the Blending options and their effects on the robot instance over a blue-black gradient. Several filters are available in the Filters section of the Properties inspector.

Each filter has different options that can refine the effect. Higher settings are processor intensive and can bog down performance, especially if you have multiple filters.

The instance on the Stage becomes blurry, helping to give an atmospheric perspective to this scene. The Presets button lets you save a particular filter and its settings so you can apply it to another instance. The Clipboard button lets you copy and paste any selected filter. The Enable or Disable Filter button lets you see your instance with or without the filter applied. The Reset Filter button resets the filter parameters to their default values.

Positioning in 3D Space You also have the ability to position and animate objects in real three-dimensional space. The Transform panel also provides information for position and rotation. Understanding the 3D coordinate space is essential for successful 3D placement of objects. Flash divides space using three axes: the x, y, and z axes.

Think about the beginning text introduction to the Star Wars movies, and see if you can achieve a similar effect. A circular, multicolored target appears on the instance. This is a guide for the 3D rotation. The red longitudinal line rotates your instance around the x axis.

The green line along the equator rotates your instance around the y axis. The circular blue guide rotates your instance around the z axis. You can also click and drag the outer orange circular guide to freely rotate the instance in all three directions.

Use the 3D Translation tool, which is hidden under the 3D Rotation tool. A guide appears on the instance. This is a guide for the 3D translation. The red guide represents the x axis, the green is the y axis, and the blue is the z axis. Notice that your text stays in perspective as you move it around the Stage.

The Transform panel shows all the values for the x, y, and z angles and positions. The selected instance returns to its original settings. Local Transformations When you choose the 3D Rotation or 3D Translation tool, be aware of the Global Transform option it appears as a three-dimensional cube at the bottom of the Tools panel.

When the Global Transform option is depressed, rotation and positioning is relative to the global, or Stage, coordinate system. Notice in the following image how the 3D display is always perpendicular to the Stage. You will add your version of the onRenderTick function now. Remember that this property will be set to true when the spacebar is being pressed. You will make the cube move away from the screen by adding to its z property, and you will make the cube spin on its own y-axis by adding to a Papervision3D property called localRotationY.

At this point, the cube will continue to rotate away even after the spacebar is released, but soon you will add code to animate the cube back when the spacebar is released, using the onKeyU function. Using Caurina Tweener to animate the 3D Cube In the last step, you created code that makes the cube spin into the distance when the spacebar is pressed.

Now you will write code to make the cube spin back to its original position whenever the spacebar is released. In fact, both Tweener and the built-in Tween class are based on code originally created by Grant Skinner. However, the Tweener class, which was created by Zhe Fernando, allows you to create tweens that can animate any type of object using properties of any class, including custom classes. You w ill add two twe ens using a Tweener class for each of the properties you animated in the onRenderTick method.

After this parameter are curly braces that contain two name:value pairs. P re ss ing the s pa ceba r wi ll s ti ll animate the cube away from you, but now releasing the spacebar will cause the cube to spin back to its original position over two seconds. In the next task, you will add another addTween method. Rotating the cube when it is clicked You have already created an onClick function that responds when the cube is clicked.

 
 

Leave A Comment