MACROMEDIA FLASH 8-LEARNING ACTIONSCRIPT 2.0 IN FLASH Especificaciones

Getting Started with Flash000_Getting_Started.book Page 1 Friday, September 2, 2005 12:22 PM

10 Introduction2. Select the No Color option from the Stroke Color Picker.Selecting the No Color option in the Stroke Color Picker3. Select a color of

100 Tutorial: Building Your First Flash ApplicationDefine document propertiesConfiguring document properties is a common first step in Flash authoring

Create a new document 1014. In the Document Properties dialog box, enter 700 in the width text box and 150 in the height text box, and then click OK.F

102 Tutorial: Building Your First Flash ApplicationCreate symbolsNext, you will create some symbols or reusable assets. Symbols allow you to use the s

Create symbols 1037. Drag in the drawing area to draw a wide, flat rectangle.8. Select the Selection tool from the Tools panel.9. Double-click the rec

104 Tutorial: Building Your First Flash Application4. In the Library panel (Window > Library), drag the imageHolder symbol to the drawing area.You

Create symbols 105You have now finished creating the symbol called slides. Next, you will create a third symbol that will contain an instance of the s

106 Tutorial: Building Your First Flash Application4. With the symbol instance still selected, in the Property inspector, enter 0 in the X and Y text

Edit a symbol Timeline 1072. In the Timeline, select Frame 20 of Layers 1 and 2.Selecting Frame 20 of Layers 1 and 23. Select Modify > Timeline >

108 Tutorial: Building Your First Flash ApplicationAdd actions to framesIn this section, you will add a small amount of ActionScript to control how th

Add labels to frames 10916. Select frame 60 of Layer 2.17. In the Actions panel, type the stop(); ActionScript.18. In the Timeline, select frame 80 of

Making a simple Flash document 11Creating a symbolYou can turn your new artwork into a reusable asset by converting it to a Flash symbol. A symbol is

110 Tutorial: Building Your First Flash ApplicationAdd motion tweensA motion tween is a type of animation in which an object moves from one position t

Add motion tweens 1118. In the Property inspector, enter -150 in the Y text box.This moves the slideShow movie clip instance upward 150 pixels in the

112 Tutorial: Building Your First Flash ApplicationEdit the main TimelineNow you will return to the main Timeline of your Flash document to add detail

Create the border 113To add the slideShow movieClip to the Stage:1. Click the slideShow layer name to make that layer active.2. Drag the slideShow sym

114 Tutorial: Building Your First Flash Application5. Select the color black (#000000) from the Fill Color Picker.Selecting black from the Fill Color

Create the border 11510. In the Align panel, click the To Stage option so it is selected. This allows the Align panel to align the selected rectangle

116 Tutorial: Building Your First Flash Application13. Still in the Align panel, click the Align Horizontal Center button.Clicking the Align Horizonta

Create the border 11716. Still in the Tools panel, select the color blue with the hexadecimal value #0000FF from the Fill Color Picker.17. In the Tool

118 Tutorial: Building Your First Flash Application21. In the Tools panel, click the Selection tool.22.Click the blue rectangle to select it.23.With t

Add a symbol 119Add a symbolIn this section, you will add a blue-colored area to the right side of the Stage. This is where the text that describes ea

12 IntroductionAnimating the circleNow that you have some artwork in your document, you can make it more interesting by animating it to move across th

120 Tutorial: Building Your First Flash Application16. In the Tools panel, click the Subselection tool.17. Move the mouse over the lower-left corner o

Add a text box 121To add the text box for the menu item title:1. In the Tools panel, click the Text tool.2. In the Property inspector, select Dynamic

122 Tutorial: Building Your First Flash ApplicationAdd the second text boxNow you will add the second text box, which will hold the description text f

Add the movie clip to the Stage 1239. In the Tools panel, click the Selection tool. 10. Click in the Stage area outside the shapes you have drawn to d

124 Tutorial: Building Your First Flash ApplicationAdd a button componentNow you are ready to add the button that allows the user to switch from one s

Add ActionScript code 125Add ActionScript codeYou have now added all the graphic and text elements that your FMA requires. The last step is to add the

126 Tutorial: Building Your First Flash ApplicationEnter ActionScript code for the slide showNow you will enter the ActionScript code that makes the s

Add ActionScript code 127menu_mc.description_txt.text = this["image"+currImage+"desc"];for (var i:Number = 0; i<totalImages; i+

128 Tutorial: Building Your First Flash ApplicationThe first section of code contains variables that store information about the images that will appe

Add ActionScript code 129image0uri contains a string that is the Universal Resource Identifier for the image file that is loaded and displayed in each

Making a simple Flash document 133. Select Insert > Timeline > Frame. Flash adds frames to Frame 20, which remains selected.Frames inserted in t

130 Tutorial: Building Your First Flash ApplicationA for loop is a block of code surrounded by a set of braces { } that repeats for each increment of

Publish your document 131The line of code immediately after the function definition tells Flash to execute the nextMenuItem function when the next_btn

132 Tutorial: Building Your First Flash Application5. Click Publish. Flash saves a SWF file copy of your document and an HTML file in the folder that

Resources 133Flash training and certificationBoost your Flash skills with hands-on tasks and real-world scenarios. Flash training allows you to roll u

134 Tutorial: Building Your First Flash ApplicationAdditional resourcesThe following Macromedia web pages include reference materials and links to thi

1354CHAPTER 4Tutorial: Building a Video Player (Flash Professional only)This tutoral guides you through the process of creating a simple video player

136 Tutorial: Building a Video Player (Flash Professional only)Review your taskIn this tutorial, you will create a type of application known as a flex

Examine the completed application 137To play the SWF version of the file in Flash Player:1. In Flash, select File > Open.2. Use one of the followin

138 Tutorial: Building a Video Player (Flash Professional only)3. After you have the file open, you can explore the Stage, Library panel, and the Time

Encode a video file 1392. Locate the cafe_townsend folder in the Flash application folder on your hard disk. If you installed Flash to its default loc

14 Introduction7. In the Property inspector (its default location is at the bottom of the Flash application window), select Motion from the Tween pop

140 Tutorial: Building a Video Player (Flash Professional only)4. In the Flash Video Encoding Settings dialog box, select Flash 8 - Medium Quality (40

Create a new Flash document 141Open a new documentNow you’re ready to create your own version of the FMA.To create a new document:1. Start Flash.2. Se

142 Tutorial: Building a Video Player (Flash Professional only)4. Click OK.5. Save your work.For more information about setting document properties, s

Add a media component 143To add a media component:1. Select Window > Components to open the Components panel.2. In the Components panel, click the

144 Tutorial: Building a Video Player (Flash Professional only)4. With the new component still selected on the Stage, enter the following values in th

Publish your document 14510. Save your work.11. To test your document, select Control >Test Movie.The document plays in the Test Movie window. You

146 Tutorial: Building a Video Player (Flash Professional only)The next stepsNow that you have completed the Flash video player, you would normally in

147IndexAaccessibility, in the Flash authoring environment 86accessing Flash documentation 34Actions panel 74activating Flash 20applications, samp

148 IndexFrame View button 58Frame View menu 58framescentering the playhead in 57changing the view 57converting keyframes into 60copying and past

Index 149locking 64organizing 66renaming 64layersAdd Layer button 62adding layer folder 62changing layer height 63changing number of layers disp

Making a simple Flash document 15Publishing the fileWhen you finish your Flash document, you are ready to publish it so it can be viewed in a browser.

150 IndexUndo Levels 79warning 82Preferences command 79previewing frame thumbnails 57printing help 45Printing Options preference (Windows only)

Index 151training and certification 133tree controls, keyboard shortcuts for 92trial modepurchasing Flash 22switching between editions 22tutorials

152 Index000_Getting_Started.book Page 152 Friday, September 2, 2005 12:22 PM

16 Introduction3. In the Publish Settings dialog box, select the HTML tab and verify that Flash Only is selected in the Template pop-up menu. This tem

What’s new in Flash 178. Select the file named SimpleFlash.html.9. Click Open. Your Flash document is displayed in the browser window.Congratulations!

18 IntroductionObject Drawing model Previously in Flash, all shapes in the same layer on the Stage could affect the outlines of other overlapping sha

What’s new in Flash 19Object-level Undo mode You can now choose to keep track of the changes you make in Flash on a per-object basis. When you use th

Trademarks1 Step RoboPDF, ActiveEdit, ActiveTest, Authorware, Blue Sky Software, Blue Sky, Breeze, Breezo, Captivate, Central, ColdFusion, Contribute,

20 IntroductionImproved text anti-aliasing You can now apply new anti-aliasing settings that make normal and small-sized text much clearer and easier

Installing Flash 21To install Flash:1. Close any running versions of Flash before installing. 2. Do one of the following to start the installation pro

22 IntroductionSwitching between trial-mode editionsIf you’re running the trial mode of one edition of Flash, you can change to another edition during

Installing Flash 23First Run folder This folder is a sibling to the application-level configuration folder, but serves a different purpose. The First

24 IntroductionAll-user-level configuration folder This is the configuration folder found in the common user profile area. This folder is part of the

Installing Flash 25To change or reinstall the plug-in for Windows (CompuServe, Firefox, Mozilla, Netscape, or Opera):1. Close your browser before inst

26 Introduction000_Getting_Started.book Page 26 Friday, September 2, 2005 12:22 PM

271CHAPTER 1Learning FlashMacromedia Flash Basic 8 and Flash Professional 8 include a diverse set of tools with an extremely broad range of uses. Acco

28 Learning FlashWhere to startBecause Flash includes several manuals that cover a wide variety of topics, it is helpful to know where to start when l

Where to start 29You are a web or graphic designer who wants to learn Flash, but not ActionScript:1. Continue to read this Getting Started with Flash

3ContentsIntroduction . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5What is Flash. . . . . . . . . . . .

30 Learning FlashIf you have previous experience with coding in a language other than ActionScript and want to learn the Flash development environment

Where to start 31If you have some basic understanding of Flash and you need to catch up with changes in the user interface or ActionScript:1. For a de

32 Learning FlashIf you are a Flash developer with no mobile or device development experience:1. Read Developing Flash Lite Applications to learn abou

Get the most from the Flash documentation 33Get the most from the Flash documentationThe Macromedia Flash help system contains a great deal of informa

34 Learning FlashAccessing the Flash documentationThe following tables summarize the documents included in the Flash help system. You can purchase pri

Accessing the Flash documentation 35Tutorials and samplesTitle Description/AudienceWhere to Find ItFlash Tutorials A collection of step-by-step tutori

36 Learning FlashActionScriptTitle Description/AudienceWhere to Find ItLearning ActionScript 2.0 in FlashA detailed introduction to coding with Action

Accessing the Flash documentation 37ComponentsExtending FlashTitle Description/AudienceWhere to Find ItUsing ComponentsInformation about how to use an

38 Learning FlashFlash LiteTitle Description/AudienceWhere to Find ItGetting Started with Flash LiteIntroductory information about Flash Lite workflow

Accessing additional online Flash resources 39Accessing additional online Flash resourcesThe following table summarizes additional online resources fo

4ContentsChapter 3: Tutorial: Building Your First Flash Application . . . . .95Review your task . . . . . . . . . . . . . . . . . . . . . . . . . .

40 Learning FlashChoosing the right help booksBecause Flash Help contains many books, it is useful to know what each book is about before deciding whi

Choosing the right help books 41 ActionScript 2.0 Language Reference includes dictionary-style entries for all of the actions, methods, and propertie

42 Learning Flash Developing Flash Lite Applications provides techniques and guidelines for creating content and applications for Flash Lite, the ver

Searching the help system 43Searching the help systemFlash Basic 8 and Flash Professional 8 provide thorough search capabilities that help you easily

44 Learning Flash3. Click a help topic to select it from the list. The topic appears in the Table of Contents pane of the Help panel. The table of con

Printing the Flash documentation 452. To open the Help panel reference page for the selected item, do one of the following: Press F1. Right-click th

46 Learning FlashPurchasing printed documentationTo purchase printed versions of the Flash documentation, go to www.macromedia.com/go/books.Discussing

Controlling the appearance of the Help panel 47Controlling the appearance of the Help panelYou can control how the Help panel appears in Flash.Arrangi

48 Learning FlashChanging the size of text displayed in the Help panelIf you are using a laptop, you may find it useful to change the text in the Help

492CHAPTER 2Flash BasicsThe Macromedia Flash Basic 8 and Flash Professional 8 workspace consists of a Stage on which you place media objects, a Proper

5IntroductionWelcome to Macromedia Flash Basic 8 and Macromedia Flash Professional 8. Flash provides everything you need to create and deliver rich we

50 Flash BasicsAbout Flash filesThe primary Flash file type, FLA files, contain three basic types of information that comprise a Flash document. These

Getting to know the workspace 51 JSFL files are JavaScript files that you can use to add new functionality to the Flash authoring tool. See Extending

52 Flash BasicsTo display the Start page again, do one of the following: (Windows) Select Edit > Preferences and select Show Start Page in the Gen

Getting to know the workspace 53To magnify or reduce your view of the Stage, do one of the following: To zoom in on a certain element, select the Zoo

54 Flash BasicsMoving the view of the StageWhen the Stage is magnified, you may not be able to see all of it. The Hand tool lets you move the Stage to

Getting to know the workspace 55You can change the way frames appear in the Timeline, as well as display thumbnails of frame content in the Timeline.

56 Flash BasicsTo move the Timeline when it is docked to the application window: Drag the gripper at the left of the word Timeline in the panel titl

Getting to know the workspace 57To go to a frame: Click the frame’s location in the Timeline header, or drag the playhead to the desired position.To

58 Flash BasicsTo change the display of frames in the Timeline:1. Click Frame View in the upper-right corner of the Timeline to display the Frame View

Getting to know the workspace 59Working with frames in the Timeline In the Timeline, you work with frames and keyframes, placing them in the order you

6IntroductionFlash is extremely well suited to creating content for delivery over the Internet because its files are very small. Flash achieves this t

60 Flash BasicsTo select one or more frames in the Timeline: To select one frame, click the frame. If you have Span Based Selection enabled in the Pr

Getting to know the workspace 61 To change the length of a tweened sequence, drag the beginning or ending keyframe left or right. To change the lengt

62 Flash BasicsCreating layers and layer folders When you create a new layer or folder, it appears above the selected layer. The newly added layer bec

Getting to know the workspace 63 Alt-click (Windows) or Option-click (Macintosh) in the Eye column to the right of a layer or folder name to hide all

64 Flash BasicsTo change the number of layers displayed in the Timeline: Drag the bar that separates the Timeline from the Stage area.Editing layers

Getting to know the workspace 65 Drag through the Lock column to lock or unlock multiple layers or folders. Alt-click (Windows) or Option-click (Mac

66 Flash BasicsOrganizing layers and layer foldersYou can rearrange layers and folders in the Timeline to organize your document. Layer folders help o

Getting to know the workspace 67You can also create a motion guide layer to control the movement of objects in a motion tweened animation. For more in

68 Flash BasicsUsing the Customize Tools panel dialog box, you can specify which tools to display in the Flash authoring environment. For more informa

Getting to know the workspace 69To customize the Tools panel:1. To display the Customize Tools panel dialog box, do one of the following: (Windows) S

What you can do with Flash 7When you have finished authoring your Flash document, you publish it using the File > Publish command. This creates a c

70 Flash BasicsUsing rulersWhen rulers are displayed, they appear along the top and left sides of the document. You can change the unit of measure use

Getting to know the workspace 71To turn snapping to guides on or off: Select View > Snapping > Snap to Guides. To move a guide: 1. Make sure ru

72 Flash BasicsTo clear guides: Select View > Guides > Clear Guides. If you are in document-editing mode, all guides in the document are cleare

Getting to know the workspace 73Using panels and the Property inspectorFlash offers many ways to customize the workspace to your needs. Using panels a

74 Flash BasicsAbout the Library panelThe Library panel is where you store and organize symbols created in Flash, as well as imported files, including

Getting to know the workspace 75For information on using the Actions panel and writing ActionScript code, including switching between editing modes, s

76 Flash BasicsTo open a panel: Select the desired panel from the Window menu.To close a panel, do one of the following: Select the desired panel fr

Getting to know the workspace 77To move a panel: Drag the panel by its gripper (on the left side of the title bar).To add a panel to an existing pane

78 Flash BasicsTo select a panel layout:1. Select Window > Workspace Layout. 2. From the submenu, select Default Layout to reset panels to the defa

Getting to know the workspace 79To set preferences:1. Select Edit > Preferences (Windows) or Flash > Preferences (Macintosh). 2. In the Category

8IntroductionTo build a Flash application, you typically perform the following basic steps:1. Decide which basic tasks the application will perform.2.

80 Flash Basics For Test Movie Options, select Open Test Movie in Tabs to have Flash open a new document tab in the application window when you selec

Getting to know the workspace 81To set AutoFormat preferences for ActionScript: Select any of the check boxes. To see the effect of each selection, l

82 Flash BasicsTo set text preferences, select one of the following options: For Font Mapping Default, select a font to use when substituting missing

Getting to know the workspace 83 Select Warn on Conversion of Effect Graphic Objects to have Flash warn you when you attempt to edit a symbol that ha

84 Flash BasicsTo view or print the current set of keyboard shortcuts:1. Select Edit > Keyboard Shortcuts.2. In the Keyboard Shortcuts dialog box,

Getting to know the workspace 85To add or remove a keyboard shortcut: 1. Select Edit > Keyboard Shortcuts (Windows) or Flash > Keyboard Shortcut

86 Flash BasicsUsing context menusContext menus contain commands relevant to the current selection. For example, when you select a frame in the Timeli

Getting to know the workspace 87About Flash authoring accessibility on the MacintoshAccessibility for the Flash authoring environment on the Macintosh

88 Flash BasicsTo use keyboard shortcuts to select or deselect, expand, or collapse panels or the Property inspector: To move the focus through the p

Getting to know the workspace 89 You can use the Right Arrow and Left Arrow keys to move the focus between the pop-up menu and the panel title bar.

Making a simple Flash document 93. The Background color swatch is set to white. You can change the color of the Stage by clicking the swatch and selec

90 Flash BasicsTo move the focus through the controls in a panel:1. Press Tab when the focus is currently applied to the panel pop-up menu. Press Tab

Getting to know the workspace 91Selecting the Stage or objects on the Stage using keyboard shortcutsYou can select the Stage or an object on the Stage

92 Flash BasicsNavigating tree controls using keyboard shortcutsYou can navigate tree structures, the hierarchical displays of file structures in cert

Getting to know the workspace 93 You can paste a library item into a different location in the same library where it originated. If you attempt to p

94 Flash Basics000_Getting_Started.book Page 94 Friday, September 2, 2005 12:22 PM

953CHAPTER 3Tutorial: Building Your First Flash Application This tutorial guides you through the process of creating a simple application using some o

96 Tutorial: Building Your First Flash ApplicationReview your taskIn this tutorial, you will create a type of application known as a flexible messagin

Examine the completed application 97Run the completed applicationTo better understand the type of application you’ll create as you work through this t

98 Tutorial: Building Your First Flash ApplicationYou now see the completed tutorial application in the Flash authoring environment.3. After you have

Create a new document 992. Locate the cafe_townsend folder in the Flash application folder on your hard disk. If you installed Flash to its default lo