In the Movie Explorer pane, expand Actions for Play to view ActionScript that Flash created when you added the Play video control behavior. To close the Movie Explorer, click its close box.

Test the document

As you author a document, you should save and test it frequently to ensure the Flash content plays as expected. When you test the SWF file, click the video control buttons to see if the video stops, plays, and rewinds as expected.
Save the document (File > Save) and select Control > Test Movie. The Flash content plays in a SWF file window. Although.fla is the extension for documents in the authoring environment,.swf is the extension for tested, exported, and published Flash content.
When you finish viewing the SWF content, close the SWF file window to return to the authoring environment.

Find help

The lessons provide an introduction to Flash, and suggest ways that you can use features to create exactly the kind of document required. For comprehensive information about a feature, procedure, or process described in the lessons, see the Help tab of the Help panel (Help > Flash Help).

Summary

Congratulations on creating a Flash document that includes graphics, a video, and video control behaviors. In a few minutes, you learned how to accomplish the following:
Tour the user interface Dock and undock panels Change the background and Stage size Change your view of the Stage View your document library Add graphics to the Stage Add video
View object properties Add video control behaviors Use the Movie Explorer to view the document structure Test the document Find help
To learn more about Flash, take another lesson.

CHAPTER 2

Basic Tasks: Creating a banner, Part 1
Macromedia Flash Basic 8 or Macromedia Flash Professional 8 can seem like a very complex programs to learn. One reason for this seeming complexity is that you can use it for so many different things, such as cartoon animations, media players, and sophisticated software. This tutorial is suitable for you if you're opening Flash 8 for the first time. This tutorial shows you some of the fundamental aspects of the program, and how to get started using them to build a real project. You don't need to know anything about Flash or animation to complete this tutorial; in fact, you'll discover how easy it is to start using Flash 8 to add elements to your web pages. This is Part 1 of a three-part tutorial on how to build a simple animated banner in Flash and add it to a web page using Macromedia Dreamweaver. You'll learn how to create a file and modify its settings, import and add graphics to the Stage from the library, and create layers in Part 1. In Part 2 and Part 3, you'll add an animation and create a button that opens a browser window. Then you'll specify publish settings, and add the banner to a web page. Basic Tasks: Creating a banner, Part 1 on page 25: You learn how to create and structure the banner application. Basic Tasks: Creating a banner, Part 2 on page 43: You learn how to add animation, create a button, and write basic scripts. Basic Tasks: Creating a banner, Part 3 on page 63: You learn how to publish your SWF file, and insert the file into a Dreamweaver website. You do not need any prerequisite knowledge to complete these tutorials.

Select File > Import > Import to Library to import an image into the current document.
You'll see the Import dialog box (see the following figure), which enables you to browse to the file you want to import.
Browse to the folder on your hard disk that contains an image to import into your Flash document.
Navigate to the directory where you saved the tutorials source files, and locate the bitmap image saved in the FlashBanner/Part1 directory. Select the gnome.png image, and click Open (Windows) or Import (Macintosh). The image is imported into the document's library.
You can drag assets from the library onto the Stage several times if you want to see several instances of the artwork. Your file size doesn't increase if you use several instances on the Stage. The SWF file only stores the information of the original symbol or asset from the library, and treats each instance like a duplicate. 4.
Select Window > Library to open the Library panel. You'll see the image you just imported, gnome.png, in the document's library.
Select the imported image in the library and drag it onto the Stage. Don't worry about where you put the image on the Stage, because you'll set the coordinates for the image later. When you drag something onto the Stage, you will see it in the SWF file when the file plays.
Click the Selection tool, and select the instance on the Stage. If you look at the Property inspector you'll notice that you can modify the image's width and height, as well as the image's X and Y position on the Stage. When you select an object on the Stage, you can see and modify the current coordinates in the Property inspector (see the following figure).
The X and Y coordinates match the registration point, which is the upper left corner of this movie clip symbol.
Type 0 into the X text box, and type 0 into the Y text box. Typing these values in sets the X and Y coordinates both to 0, as shown in the following figure.
Set the X and Y coordinates using the Property inspector. Set the X and Y values to 0.
Setting new coordinates moves the upper-left corner of the image to the upper-left corner of the Stage. You can drag the bitmap image around the Stage using the Selection tool instead of changing coordinates in the Property inspector. Use the Property inspector when you need to set a specific position for an object, like you did in this step.
Select File > Save to save the document before you proceed to the next section (Introducing layers and the timeline).
You can also import sound files into your FLA files. This isn't covered in this tutorial, but you can find out more information Chapter 12, Working with Sound.
Introducing layers and the timeline
The Timeline is above the Stage in the Flash workspace. The Timeline, which contains layers and frames, helps you organize assets in your document, and also controls a document's content over time. Flash documents can play over a length of time, like movies or sound, which is measured using frames. Layers are like transparencies that stack on top of one another, and each layer can contain images, text, or animations that display on the Stage. You'll learn more about frames and the Timeline in Part 2 of this tutorial, Basic Tasks: Creating a banner, Part 2 on page 43. The FLA file you're working on has one layer (Layer 1) with contents on a single frame (Frame 1). This is the default way that a Flash document opens. In this exercise, you lock and rename Layer 1. Often you'll want to place objects in a particular position on the Stage. To help you keep those objects in place, Flash enables you to lock layers, so you cannot select the items on a layer and accidentally move them.

In this section, you will complete the following tasks:
Creating a new layer on page 38 Importing to a layer on page 39 Select Layer 1 in the Timeline and click the dot below the lock icon, as shown in the following figure.
Lock a layer so its contents arent accidentily moved or deleted from the Stage. You can also prevent inadvertently adding other assets to that layer. With your only layer locked, you need to add new layers before you can add any other objects to the Stage. You cannot add new objects to a locked layer.
Select the Selection tool in the Tools panel, and double-click the name Layer 1. When you double-click a layer name, you can modify the name of the layer.
Type background into the layer name to rename the layer. Then save your file. When you start building projects with many layers, layer names like Layer 1 and Layer 14 don't help you determine what's on that layer. Giving layers a descriptive name is a good practice to adopt.
Select File > Save before you proceed to the next exercise (Creating a new layer).
You can also organize layers into layer folders. For more information, see Organize layers in a folder on page 94.

Creating a new layer

In just about any Flash project where you use imported graphics and animation, you'll need to create at least a few layers. You need to separate certain elements onto their own layers, particularly when you start to animate objects. You can also stack graphics on top of each other, and even create a sense of depth or overlapping by using multiple layers.
Select the background layer on the Timeline, and click Insert Layer to create a new, empty layer. The new layer is created above the background layer (see the following figure).
Click Insert Layer to insert a new layer above the currently selected layer.
Double-click the name of the new layer so the layer's name becomes editable. Type animation to rename the new layer. Graphics on the Stage stack according to the layers on the Timeline. For example, anything that you put on the animation layer will appear above the image on the background layer. You will add animation to this second layer in Part 2 of this tutorial.

Copy the FlashBanner folder to another location on your hard disk to which you have access. Inside this folder are three directories for each part of this tutorial: Part1, Part2, and Part3. In the FlashBanner/Part2 folder, you will find a Flash file called banner2_complete.fla. Double-click the file to open it in Flash. You now see the completed tutorial file in the Flash authoring environment.
In the completed FLA file, you will see the structure that makes up the finished SWF file for Part 2 of this tutorial. The application, a Flash banner for a gnome website, looks like this at the end of Part 2:
The completed banner for Part 2.
This file contains an animation in a movie clip, text, an invisible button, and the assets that you imported in Part 1 of this tutorial.
The movie clip instance contains a graphical instance that you animate. Text fields contain static, stylized text that you display on the Stage. The invisible button covers the entire Stage, and it lets your visitors click the banner and open a new web site. The graphic assets include a bitmap background image (the gnome), and the star graphic that you animate in an upcoming exercise.
By the end of Part 3 of this tutorial, you will add the graphics, animation, and interactivity to the banner. Then, youll insert the banner on a website using Dreamweaver.
To close the document, select File > Close. If you prefer to keep the finished file open as a reference while working with your banner file, be careful not to edit it or save any changes to it. Now youre ready to start creating your own banner file in the next section, Adding text.

Adding text

You need to add some additional text to your banner for decorative purposes. You can add several types of text to a Flash document: static text, dynamic text, or input text. Static text is useful when you need to add decorative text to the Stage, or any text that doesn't need to change or load from an external source. Use dynamic text when you need to load text from a file, database, or change the text when the SWF file plays in Flash Player. Use input text when you want the user to type into a text field. You can take that text and send it to a database, have it manipulate something in the SWF file, and more.
You can add any of these types of text using the Text tool. For this exercise, you will add some static text to the Stage for decorative purposes. To add static text, follow these steps: Open the banner.fla file you created in Part 1 of this tutorial, and rename the file banner2.fla.

Creating a symbol

A symbol is an object that you create in Flash. As you discovered in Part 1, a symbol can be a graphic, button, or movie clip, and you can then reuse it throughout the current FLA or other FLA files. Any symbol that you create is automatically added to the document's library (Window > Library), so you can use it many times within a document. When you add animation, you should always animate symbols in Flash, instead of animating raw graphics (graphics that you draw) or raw assets that you import (such as a PNG file). For example, if you draw a circle using the Oval tool in Flash, you should convert that circle graphic into a movie clip before you animate it. This helps you reduce the SWF file size, and makes it easier to create an animation in Flash. You will create a movie clip symbol in the following exercise. You will animate this movie clip in later exercises.
In banner2.fla, select the star.png image (imported in Part 1) and select Modify > Convert to Symbol from the main menu. The Convert to Symbol dialog box opens (see the following figure), where you can name a symbol and select which type of symbol you want it to be.
Type join us in the Name text box (see the following figure). You will see the name of the symbol, join us, in the Library panel after you create the symbol. You will also see an icon that represents movie clips next to the symbol's name. Remember that the symbol's name is different than its instance name, because you can have numerous instances of a single symbol on the Stage. For example, you can set an instance name for the join us symbol using the Property inspector after you drag it to the Stage from the Library panel. If you drag another instance of the join us symbol to the Stage, assign it a different instance name. You use the instance name in your ActionScript to reference and manipulate the instance with code. There are some naming guidelines you must follow when you assign an instance name. (This is discussed in Writing simple actions).
Use the Convert to Symbol dialog box to convert selected content into a symbol, give it a name, and click OK (shown above) add it to the documents library. You might see a smaller dialog box without the advanced linkage and source information when you convert a symbol.
Select the Movie clip option, and click OK. This means that you will convert the graphic image into a movie clip symbol. Movie clip symbols have their own timelines. This means you can animate each movie clip instance on its own timeline, and on the main timeline of the document. This is unique to movie clip instances.
Select File > Save to save your progress before moving on. After you finish saving the file, proceed to the following exercise, Adding animation to a timeline. In this exercise you will animate the movie clip.

The lesson offers an introduction to basic techniques of making your Flash content accessible. For detailed and comprehensive information about incorporating accessibility features in your Flash content, see Creating Accessible Content in Using Flash.

Set up your workspace

First, youll open the start file for the lesson and set up your workspace to use an optimal layout for taking lessons.
In Windows, browse to boot drive\Program Files\Macromedia\Flash 8\Samples and Tutorials\Tutorial Assets\Basic Tasks\Create Accessible Content and double-click accessibility_start.fla. On the Macintosh, browse to Macintosh HD/Applications/ Macromedia Flash 8/Samples and Tutorials/Tutorial Assets/Basic Tasks/Create Accessible Content and double-click accessibility_start.fla
Select File > Save As and save the document with a new name, in the same folder, to preserve the original start file.
As you complete this lesson, remember to save your work frequently.
Select Window > Workspace Layout > Default to set up your workspace for taking lessons.
Make your document accessible to screen readers
Youll now specify that your document is accessible to screen readers, and provide a name and description of your document that a screen reader can read aloud.
With nothing selected on the Stage, select Window > Other Panels > Accessibility. In the Accessibility panel, verify that the following options are selected:

Make Movie Accessible is

selected by default and allows Flash Player to pass accessibility information to a screen reader.
allows Flash Player to pass accessibility information nested inside a movie clip to a screen reader. If this option is selected for the entire document, you can still hide child objects for individual movie clips.
Auto Label associates text next to another Stage object, such as an input text field, as a label or title for that element.
Make Child Objects Accessible
Provide a document title and description
In the Accessibility panel for the document, you can enter a name and description for your document for screen readers.
In the Name text box, enter Trio ZX2004. In the Description text box, enter Corporate website about the Trio ZX2004. Includes 6 navigation buttons, overview text, and an animated car.
Provide a title and description for instances
Now that youve provided information about the entire document, you can provide information about Stage objects included in the document.
Select the Trio Motor Company logo along the top of the Stage. In the Accessibility panel, enter Trio Motor Company in the Name text box. Do not enter anything in the Description text box. Not every instance needs a description, which is read with the title information. If the title name sufficiently describes the function of the object, you dont need to include a description.

The tweening tutorial workflow includes the following tasks:
Examine the completed FLA file on page 163 allows you to look at the completed Flash file. In the process, you will become familiar with the construction of the animation example and what you will be building in this tutorial. Open the starter document on page 165 lets you begin the tutorial with a FLA file that has some graphics already created for you. You will apply animation effects to these graphics. Create a motion tween on page 165 shows you the steps needed to apply a typical motion tween. Use easing controls on page 168 shows you how to finely control how Flash calculates the motion of your animations. Create a motion tween with an alpha setting on page 174 shows you the steps needed to animate alpha transparency values.
162 Creating Graphics: Making Animations with Easing (Flash Professional only)
As you examine the finished version of the application youll create, you will also look at the Flash workspace. In subsequent sections, youll go through the steps to create the application yourself.
Open the authoring document
Its helpful to analyze the completed authoring document, which is a FLA file, to see how the author designed the animation and understand what you are going to create. The files for this tutorial are located in the Samples and Tutorials folder in the Flash application folder. For many users, particularly in educational settings, this folder is read-only. Before proceeding with the tutorial, you should copy the entire Animation Easing tutorial folder to the writable location of your choice. On most computers, you will find the Animation Easing tutorial folder in the following locations:
In Windows: boot drive\Program Files\Macromedia\Flash 8\Samples and Tutorials\Tutorial Assets\Creating Graphics\Animation Easing On the Macintosh: boot drive/Applications/Macromedia Flash 8/ Samples and Tutorials/Tutorial Assets/Creating Graphics/Animation Easing
Copy the Animation Easing folder to another location on your hard disk that you have write access to. In the Animation Easing folder, you will find a Flash file called tween_finished.fla. Double-click the file to open it in Flash. You now see the completed tutorial file in the Flash authoring environment.

// function takes user to Scene 1 when back_btn instance // is released back_btn.onRelease = function (){ gotoAndStop("Scene 1", 1); };
The only differences between this function and the function in Scene 1 are the name of the button and the name of the scene.
In the Scene panel, select Scene 1.
Add navigation to return to Scene 1 239

Play a movie clip

You can configure your document to play a movie clip at runtime. Using the attachMovie() method, you can attach an instance of a movie clip in the Library panel to the Stage even though you have not placed an instance on the Stage. With the attachMovie() method, you must export the symbol for ActionScript and assign it a unique linkage identifier, which is different from the instance name.
In the Library panel, right-click the MCTrio symbol and select Linkage from the context menu. In the Linkage Properties dialog box, select Export for ActionScript. In the Identifier text box, verify that MCTrio appears as the linkage name. Verify that Export in First Frame is selected, and then click OK. Movie clips that are exported for use with ActionScript load, by default, before the first frame of the SWF file that contains them. This can create a delay before the first frame plays. When you assign a linkage identifier to an element, you can specify that the movie clip loads on the first frame to avoid playback delays.
Use the attachMovie() method to play a movie clip
Youll now use the attachMovie() method to load the movie clip and provide the symbol with an instance name. Since the instance of the symbol does not exist on the Stage, youll create the instance name programmatically.
In the Timeline, select Frame 1 of the Actions layer for Scene 1. In the Script pane of the Actions panel, place the insertion point at the end of your last line of code. Press Enter (Windows) or Return (Macintosh), and then type the following to add a comment and create a new function:
// function plays trio_mc when attachMovie_btn instance // is released attachMovie_btn.onRelease = function(){
240 ActionScript: Add Interactivity

pedals

id prodName description 0 Clipless Pedals Excellent cleat engagement 1 ATB Available in comfort and aero design

handleBars

id prodName description
Verify that you created the objects as follows:
var handleBars:Product = new Product (1, "ATB", "Available in comfort and aero design"); var pedals:Product=new Product(0,"Clipless Pedals","Excellent cleat engagement");
Trace the description property of pedals:
trace (pedals.getDescription ());
Save and test the document. You should see the description of pedals in the Output panel.
A finished sample file of the document you just created, named handson2.fla, is located in your finished files folder. For the path, see Set up your workspace on page 256.
Learn about extending existing classes
The extends keyword in ActionScript 2.0 allows you to use all the methods and properties of an existing class in a new class. For example, if you wanted to define a class called Drag that inherited everything from the MovieClip class, you could use the following:
class Drag extends MovieClip {}
Learn about extending existing classes 263
The Drag class now inherits all properties and methods from the existing MovieClip class, and you can use MovieClip properties and methods anywhere within the class definition, as in the following example:
The following ActionScript is an example only. Do not enter the script in your lesson FLA file. class Drag extends MovieClip { // constructor function Drag () { onPress=doDrag; onRelease=doDrop; } private function doDrag():Void { this.startDrag(); } private function doDrop():Void { this.stopDrag(); } } The Convert to Symbol dialog box now offers a class field in which you can associate visual objects (such as movie clip) with any class that you define in ActionScript 2.0.

N OT E NO TE

Extend the MovieClip class to create a new class
Youll create a new class by extending the built-in MovieClip class.
Create a new Flash document and name it Shape.fla. Using the drawing tools, draw a shape on the Stage. With the entire shape selected, right-click (Windows) or Control-click (Macintosh) the shape and select Convert to Symbol from the context menu.

In the Convert to Symbol dialog box, select Movie Clip as the behavior, and click Advanced. Select Export for ActionScript.
264 ActionScript: Work with Objects and Classes
In the Name text box, enter myShape. In the AS 2.0 Class text box, enter Drag. Click OK. This associates the movie clip with the Drag class that youll create.
Using the Property inspector, assign the movie clip an instance name, then save the FLA file.
A finished sample file of the document you just created, named handson3.fla, is located in your finished files folder. For the path, see Set up your workspace on page 256. 7.
Create an ActionScript file by selecting File > New > ActionScript File (Not Flash Document). Save the document with the name Drag.as, in the same location where you saved Shape.fla. In the ActionScript file that you just created, create a new class and constructor called Drag:
class Drag extends MovieClip { function Drag () { onPress=doDrag; onRelease=doDrop; } }
Define private methods in the class that use the existing movie clip methods, startDrag() and stopDrag():
class Drag extends MovieClip { function Drag() { onPress=doDrag; onRelease=doDrop; } private function doDrag():Void { this.startDrag(); } private function doDrop():Void { this.stopDrag() } }

10. Save

the ActionScript file.
Extend the MovieClip class to create a new class 265
Test the Shape.fla file. You should be able to drag the movie clip.
An example of the ActionScript file you just created, named Drag.as, is located in your finished files folder. For the path, see Set up your workspace on page 256.
266 ActionScript: Work with Objects and Classes
Congratulations on learning how to work with objects and classes in ActionScript 2.0. In a few minutes, you learned how to accomplish the following tasks:
Create and use objects from existing classes. Create a custom class. Create a property within a custom class. Create a method within a custom class. Extend an existing class and take advantage of inheritance.

CHAPTER 23

Data Integration: Overview (Flash Professional Only)
The following tutorials illustrate several ways to use data binding and the data components in Macromedia Flash Professional 8. Many of the tutorials use public web services and therefore require that you have an Internet connection. In addition, the tutorials wont work in a browser because of sandbox restrictions, but they will work in the Flash authoring environment or Flash Player.
Data Integration: Using the Macromedia Tips Web Service (Flash Professional Only) Data Integration: Using XML for a Timesheet (Flash Professional Only) Data Integration: Using XUpdate to Update the Timesheet (Flash Professional Only)

To complete the timesheet tutorials, you must download the file data.xml.
These tutorials are working models that illustrate how to use the data components (XMLConnector, WebServices Connector, RDMBSResolver and XUpdateResolver) with data binding in Flash Professional 8. They are not intended to be production-ready applications.
The use of public web services in these tutorials does not imply that you should use them for real-world applications. In fact, Macromedia does not recommend using public web services directly from within any client-side application. For more information, see Applications and Web Services in the Data Integration chapter in Using Flash (in Flash, select Help > Using Flash).
If you have trouble downloading or decompressing the files, see TechNote 13686 at www.macromedia.com/support/general/ts/documents/ downfiles.htm.
268 Data Integration: Overview (Flash Professional Only)

CHAPTER 24

Data Integration: Using the Macromedia Tips Web Service (Flash Professional Only)
In this tutorial, you use the Web Services panel to connect to a web service, which you use to return a random tip about Macromedia software. You then use components to set up a simple user interface. You can print this tutorial by downloading a PDF version of it from the Macromedia Flash Documentation page at www.macromedia.com/go/ fl_documentation. In this tutorial, you will complete the following tasks:
Connect to a public web service.270 Create a user interface and bind the components with the web service.272
This tutorial uses a public web service and therefore requires that you have an Internet connection. If you have trouble downloading or decompressing the files, see TechNote 13686 at www.macromedia.com/support/general/ts/documents/ downfiles.htm.
The use of a public web service in this tutorial does not imply that you should use one for real-world applications. In fact, Macromedia does not recommend using public web services directly from within any client-side application. For more information, see About data connectivity and security in Flash Player in the Data Integration chapter in Using Flash (in Flash, select Help > Using Flash). In a production environment, you should use web services that are placed on your own web server.

286 Data Integration: Using XML for a Timesheet (Flash Professional Only)

CHAPTER 26

Data Integration: Using XUpdate to Update the Timesheet (Flash Professional Only)

Prerequisite: Data

Integration: Using XML for a Timesheet (Flash Professional Only) This tutorial starts where the Data Integration: Using XML for a Timesheet (Flash Professional Only) tutorial left off. Now that the DataSet component is managing the data, it is tracking changes that are made to the data into the DeltaPacket property. A resolver is needed to send the changes back to the server in an optimized way. The XUpdateResolver component is the best choice for updating an XML source, because it generates XUpdate statements that can be sent to the server to update the data. You can print this tutorial by downloading a PDF version of it from the Macromedia Flash Documentation page at www.macromedia.com/go/ fl_documentation. In this tutorial, you will complete the following task:

Update the timesheet.288

This tutorial uses a public web service and therefore requires that you have an Internet connection. In addition, the tutorial wont work in a browser because of sandbox restrictions, but will work in the Flash authoring environment or Flash Player.
288 Data Integration: Using XUpdate to Update the Timesheet (Flash Professional Only)

Update the timesheet

Now you will set up the bindings to allow the timesheet to be updated.
Begin with the file you created in the Data Integration: Using XML for a Timesheet (Flash Professional Only) tutorial. In the Components panel, open the Data category and drag an XUpdateResolver component to the Stage. In the Property inspector, enter the instance name timeInfo_rs. Click the Schema tab in the Component inspector, and select the deltaPacket component property within the Schema Tree pane. Change the DeltaPacket components encoder setting to DataSetDeltaToXUpdateDelta. This encoder converts data within the DeltaPacket into XPath statements that are supplied to the XUpdateResolver component, but it needs additional information from you to do its job.
Double-click the encoder options property. When prompted for a value for the rowNodeKey property, type datapacket/row[@id='?id']. This property identifies which node within the XML file will be treated as a record within the data set. It also defines which element or attribute combination makes the row node unique, as well as the schema field within the DataSet component that will represent it. See Updates sent to an external data source in Using Flash (in Flash, select Help > Using Flash). In the sample XML file, the id attribute of the datapacket/row node is the unique identifier, and it will be mapped to the DataSet components ID schema field. This is defined with the following expression: