Adobe Flash Professional CS5 Classroom in a Book [Adobe Creative Team] on DVD includes lesson files so readers can work along with the book, as well as. The Adobe Flash Professional CS5 Classroom in a Book disc includes the lesson files that you'll need to complete the exercises in this book. Adobe Flash Professional CS5 Classroom in a Book Video and Lesson Files Publisher: Adobe Press | Pages | ISBN:
|Language:||English, Spanish, Portuguese|
|ePub File Size:||22.48 MB|
|PDF File Size:||18.34 MB|
|Distribution:||Free* [*Sign up for free]|
Selection from Adobe® Flash® Professional CS6 Classroom in a Book®: The official training The print version of this title comes with a disc of lesson files. The companion DVD includes lesson files so readers can work along with the book, as well as 2 hours of video tutorials from 'Learn Adobe Flash Professional. Adobe Flash Professional CS5 Classroom in a Book. WHERE ARE THE LESSON FILES? Thank you for downloading this digital version of: Adobe Flash.
About this title This project-based guide from Adobe will teach readers all they need to know to create engaging interactive content with ActionScript 3. Using step-by-step instructions with projects that build on the knowledge acquired in each lesson, readers will learn the fundamentals of adding interactivity to Flash files using ActionScript, starting with using prewritten Code Snippets, but progressing to customizing and writing their own ActionScript code. The tutorials start with simple navigation and timeline control and progress through controlling animation with ActionScript; using Event Listeners and writing event-handling functions; and controlling loading of and interaction with data, text, video, sound, and images. 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 current arrangement of panels is saved. Your workspace is added to the options in the Workspace pull-down menu, which you can access at any time. As with a theater stage, the Stage in Flash is the area that viewers see when a movie is playing.
It contains the text, images, and video that appear on the screen. Move elements on and off the Stage to move them in and out of view. The gray area is called the Pasteboard. For now, leave the option selected. You can also choose different magnification view options from the pop-up menu just above the Stage. These options are available in the Properties inspector, which is the vertical panel just to the right of the Stage. Click the Edit button. The Document Settings dialog box appears.
Enter for the Width and for the Height. Choose dark gray Your Stage is now a different dimension and color. You can also change the Stage color by clicking the Stage button directly in the Properties inspector.
You can change the Stage properties at any time. The Library panel is accessible from a tab just to the right of the Properties inspector. The Library panel is where you store and organize symbols created in Flash, as well as imported files, including bitmaps, graphics, sound files, and video clips.
Symbols are often-used graphics used for animation and for interactivity. About the Library panel The Library panel lets you organize library items in folders, see how often an item is used in a document, and sort items by type. When you import items into Flash, you can import them directly onto the Stage or into the library. However, any item you import onto the Stage is also added to the library, as are any symbols you create.
You can then easily access the items to add them to the Stage again, edit them, or see their properties.
In the Open dialog box, select the background. You can also hold down the Shift key to select multiple files and import all of them at once. These images are now available to be used in your Flash document. Understanding the Timeline The Timeline is located below the Stage. Like films, Flash documents measure time in frames. As the movie plays, the playhead, shown as a red vertical line, advances through the frames in the Timeline. You can change the content on the Stage for different frames.
At the bottom of the Timeline, Flash indicates the selected frame number, the current frame rate how many frames play per second , and the time that has elapsed so far in the movie. The Timeline also contains layers, which help you organize the artwork in your document.
Think of layers as multiple film strips stacked on top of each other. Each layer contains a different image that appears on the Stage, and you can draw and edit objects on one layer without affecting objects on another layer. The layers are stacked in the order in which they overlap each other, so that objects on the bottom 16 Lesson 1 Getting Acquainted layer in the Timeline are on the bottom of the stack on the Stage.
You can hide, show, lock, or unlock layers. Locking a layer prevents you from accidentally making changes to it. Adding a layer A new Flash document contains only one layer, but you can add as many layers as you need.
Objects in the top layers will overlap objects in the bottom layers. You can also click the New Layer button below the Timeline. A new layer appears above the background layer. Click outside the name box to apply the new name. Your Timeline now has two layers. The background layer contains the background photo, and the newly created photo1 layer above it is empty.
If you want to rearrange your layers, simply click and drag any layer to move it to a new position in the layer stack.
Inserting frames So far, you have a background photo and another overlapping photo on the Stage, but your entire animation exists for only a single frame. To create more time on the Timeline, you must add additional frames. You can also right-click Windows or Ctrl-click Mac and choose Insert Frame from the context menu that pops up. Flash adds frames in the background layer up to the selected point, frame Flash adds frames in the photo1 layer up to the selected point, frame You now have three layers, all with 48 frames on the Timeline.
Since the frame rate of your Flash document is 24 frames per second, your current animation lasts two seconds. Selecting Multiple Frames Just as you can hold down the Shift key to select multiple files on your desktop, you can hold down the Shift key to select multiple frames on the Flash Timeline.
If you have several layers and want to insert frames into all of them, hold down the Shift key and click on the point at which you want to add frames in all of your layers. Keyframes are indicated on the Timeline as a circle. An empty circle means there is nothing in that particular layer at that particular time.
A filled-in black circle means there is something in that particular layer at that particular time. The background layer, for example, contains a filled keyframe black circle in the first frame.
The photo1 layer also contains a filled keyframe in its first frame. Both layers contain photos. The photo2 layer, however, contains an empty keyframe in the first frame, indicating that it is currently empty. As you select a frame, Flash displays the frame number beneath the Timeline. A new keyframe, indicated by an empty circle, appears in the photo2 layer in frame The empty circle at frame 24 becomes filled, indicating there is now a change in the photo2 layer.
At frame 24, your photo appears on the Stage. For information on Flash Player version penetration visit: Only the commands and options used in the lessons are explained in this book.
For comprehensive information about program features and tutorials, refer to these resources: Adobe Community Help: Community Help brings together active Adobe product users, Adobe product team members, authors, and experts to give you the most useful, relevant, and up-to-date information about Adobe products. Search results will show you not only content from Adobe, but also from the community.
With Adobe Community Help you can: This companion application lets you search and browse Adobe and community content, plus you can comment on and rate any article just like you would in the browser. You can download the application from www. You can contribute in several ways: Find out how to contribute: See http: Adobe TV: Adobe Design Center: Adobe Developer Connection: ActionScript Technology Center: Resources for educators: Also check out these useful links: Adobe Forums: Adobe Flash Professional CS5 product home page: A directory of AATCs is available at http: Adobe BrowserLab is for web designers and developers who need to preview and test their web pages on multiple browsers and operating systems.
Unlike collaborating via email and attend- ing time-consuming in-person meetings, Acrobat. Adobe Story is for creative professionals, producers, and writers working on or with scripts. SiteCatalyst NetAverages is for web and mobile professionals who want to optimize their projects for wider audiences. NetAverages provides intelligence on how users are accessing the web, which helps reduce guesswork early in the creative process.
The data is derived from visitor activity to participating Omniture SiteCatalyst customer sites. Unlike other web intelligence solutions, NetAverages innovatively displays data using Flash, creating an engaging experience that is robust yet easy to follow. Note, this option does not give you access to the services from within your products.
See www. Today, the combination of the design and animation tools in Flash CS5 and the advanced interactive capabilities of ActionScript 3.
These actions allowed for navigation of the Flash Timeline and creating links to URLs, but not much more. In ActionScript 2. This was because each version of ActionScript was built on the foundation of the previ- ous one, going all the way back to its very simple beginnings. It became clear that a new version of ActionScript needed to be written from the ground up.
In , Adobe introduced ActionScript 3. Flash CS4 added functionality to ActionScript 3. Flash CS5 continues the evolu- tion of ActionScript 3. Flash CS5 also has a number of new features to help you learn and work with ActionScript, including the new Code Snippets panel, which lets you reuse common ActionScript code with the click of a mouse.
Other new ActionScript features, such as code completion and tooltips for custom classes, will show their worth as you begin working with the language. Many designers and animators who use Flash regularly are daunted by the prospect of learning ActionScript 3. The truth is that with a little patience at the beginning, you can quickly learn enough ActionScript to be able to add lots of interactive features to your Flash work.
The lessons in this book are geared toward designers who have little or no pro- gramming experience. Some knowledge of ActionScript 1. By working through these lessons, you will gain a comfort with the syntax of ActionScript 3. More importantly, you will gain a large repertoire of interactive tools to add to your existing Flash skills.
First, the bad news There is no doubt that ActionScript 3. Also, Flash applications written in ActionScript 3. This is because there are actually two ActionScript players inside Flash Player 9 and later. In this book, we will focus exclusively on ActionScript 3. Better performance. As mentioned, ActionScript 3. This makes Flash viable for creating high-performance games, simulations, 3D interfaces, and data-driven applications. More consistent syntax. Because everything up to ActionScript 2.
This could be extremely confusing. For example, in ActionScript 1. For example, there is one way to listen for and respond to an event in ActionScript 3. Everyone makes mistakes, so it is a blessing that ActionScript 3. Lots of new features. As you progress through the lessons you will become comfortable with many of these features. Formats for playing back Flash and ActionScript 3.
This is the most common use of Flash for most developers. Not long ago, Adobe introduced its Adobe AIR technology, which allows creation of true cross-platform desktop applications that run on Macintosh, Windows, or Linux.
Flash Builder 4 is the new name for what formerly was called Flex Builder. Another option for experienced programmers is to use the free Flex SDK that is available from Adobe at www. All of these programs support the entire ActionScript 3. Flash Builder is more geared toward people with a programming background and includes a number of features that support the development of large-scale rich-media applica- tions and data-driven projects. Flash CS5 on the other hand includes tools and an interface adapted to the needs of designers and animators.
Of course this is an optional step—code can also be written exclusively in Flash CS5. This book focuses on the use of ActionScript 3. ActionScript in the Flash Timeline vs. In earlier versions of Flash, ActionScript could also be placed directly on an object such as a button or a movie clip, but this is no longer the case with ActionScript 3. ActionScript is a true object-oriented language, which makes it very good for building larger and more complex projects.
While this book does not put an emphasis on OOP, the later lessons will lay a foundation that will allow you to delve more deeply into OOP development in ActionScript 3.
This is the foundation for OOP in Flash. In the early lessons of this book, you will be placing all your code in the Flash Timeline. Navigate to a URL using a code snippet. Add ActionScript to the Timeline via the Actions panel. Add labels to frames on a timeline. Use an ActionScript variable to keep track of a changing number. Use a conditional statement to respond to the looping of an animation.
This lesson will take approximately 2 hours. The Flash Timeline is an extremely useful tool for creating anima- tions. This lesson introduces the techniques for adding code to the Flash Timeline to control playback; it also introduces a few essential ActionScript 3. First, though, this chapter introduces you to a great new feature in Flash CS5 called code snippets.
Code snippets are designed to help new programmers learn ActionScript 3. If you ran the movie at this point, it would just play through the whole Timeline from start to end, showing a brief glimpse of the interface before returning to the beginning.
Adding ActionScript using code snippets You can create ActionScript on any keyframe in the main timeline of a Flash movie. You can also create it on any keyframe within a movie clip symbol. During playback of the compiled Flash project, the code on each frame will execute when that frame plays. The artwork in Lessons 1 and 2 was created by the animator Rattana Ouch rattana.
In addition to typing code directly in the Actions panel, you can add code to this panel using the new Code Snippets panel. Code snippets, as their name implies, are prebuilt chunks of ActionScript 3. Code snippets provide a wonderful way to begin working with ActionScript and can be very useful for increasing the range of tasks that you can accomplish.
When you add a code snippet to your project, the code snippet is written in the Actions panel, saving you the trouble of typing it yourself. After the code snippet is placed in the Actions panel, it is fully editable, allowing you to customize and modify that code.
To see how code snippets work, you will add some code that will link to the Flash support page at www. Begin by adding a button to the Stage: The Property inspector is also sometimes called the Properties panel.
In Flash, it is essential that all objects onstage that will be controlled with ActionScript be given instance names. Applying a code snippet Depending on the functionality needed, code snippets can be applied in a few dif- ferent ways. The button that you are working with is a component that ships with Flash CS5. You will learn more about components in coming chapters and will see that component parameters can also be controlled using ActionScript.
Notice that the keyframe in Frame 1 of the actions layer of the Timeline now has a lowercase a in it. This indicates that the ActionScript written by the code snippet has been stored in this frame. You should also see the following code appear in the Actions panel: Replace http: Keep the quotation marks "". All of the code snippets that ship with Flash CS5 come with comments like this that Note: Comments will be discussed in more detail soon and are good elements to add to your own code as notes for yourself and others.
This time when you click the button, you should be taken to the support section for Flash on the Adobe website. You can substitute any URL in this code, and clicking the button will cause the browser to navigate to that location. In the meantime, you can use the actions available in the Code Snippets panel to immediately start adding interactivity to your projects.
Using this panel will also aid in your learning process by giving you insight into how to create working code and how to modify it to suit your needs. You will work with the Code Snippets panel again in the next lesson, but now you will begin to write your own ActionScript code.
Placing code on the Flash Timeline Working with frame labels Before you start adding ActionScript, notice that among the layers in the Timeline is one called labels. In this layer, Frame 2 has the label loop and Frame 50 has the label home. ActionScript can reference labels to control navigation.
You will see the label name appear in the Timeline on Frame Looping playback with ActionScript There are many situations in which you may want to play a section of the Timeline repeatedly. For example, an animation might loop while waiting for additional con- tent to load or while the user is deciding which section of a website to go to next. If you do not see line numbers, you can turn them on by choosing Line Numbers from the Actions panel menu in the upper-right corner of the panel.
Notice that the movie no longer reaches the home frame but instead plays the opening animation over and over. This behavior occurs because every time the playhead reaches Frame 30, the action you just wrote sends it back to Frame 2. In between the parentheses, you could have chosen to use the number of the frame instead of the frame label, as shown here: You will do this by storing the value for the number of loops in a variable.
Creating a count variable The purpose of a variable is to store a reference to data. In this lesson, you will create a variable to store a numeric value to keep track of the number of times the animation in Frames 2 through 30 repeats. To create a variable in ActionScript 3. Consider this example: The name of the variable is count.
You can choose any name you want for your own variables, as long as you follow these three rules: Do not use spaces in your variable names. Except for underscores, do not use special characters; stick to letters and numbers. Do not start your names with numbers. The colon after the variable name indicates that the next piece of information will denote the type of data that will be stored in the variable.
In this example, the count variable stores a number. You will learn more about data typing in the com- ing lessons.
You do not need to give a value to a variable when you create it. Often a variable is created so that it can store information at a later time. In our example, the variable count is assigned an initial value of 1. Again, it is essential that all objects onstage that will be controlled with ActionScript be given instance names. They can even be created and formatted from scratch with ActionScript.
You will learn much more about working with text in later lessons. Literal text in ActionScript belongs to the data type String.
You will get plenty of practice with text and data typing in the coming lessons. For a web project, you might want to set up an introduction that plays over and over until the next section is fully downloaded. You will accomplish this by adding a conditional statement to your code. A condi- tional statement in ActionScript checks to see if a condition is true. In this case, if the count variable is more than 4, then code will execute that goes to the home frame.
Place the insertion point before the code that is already in this window and press Enter Windows or Return Mac.
Notice that when you do, Flash automatically adds a new line with a closing bracket for you. This code completion feature is new to Flash CS5 and is a convenience that helps you avoid the common mistake of forgetting to close the brackets of a block of code that needs to be contained within a pair of brackets. Updating the text on the home frame Now you will change the text on the home frame.
Since the user is no longer watch- ing the animation loop on this frame, there is no reason anymore to display the count number. Instead, you will add a message to welcome the user to the home frame. Conditional statements are available in most programming languages and work similarly to the way they do in ActionScript 3. Even if you have no experience with programming languages, you are probably familiar with the concept of a condi- tional statement.
You hear an almost-perfect example of one every time you interact with a voicemail system. If you want John, press one, or, if you want Mary, press two, or, leave a message after the beep. In ActionScript, the same interaction would look like this: If a question on a quiz has been answered correctly, then go to the next question.
If a level of a game has been completed, then update the score and go to the next level. If a product has been dragged to the shopping cart, then add its cost to the total download and ship the product. Although the application you just created is very simple, it introduced a number of essential ActionScript concepts.
Storing and passing data with variables and responding to changing circumstances by using conditional statements are both critical elements in the creation of rich interactivity with ActionScript 3.
You will be working with these techniques often in the lessons to come. In the next lesson, you will learn how to respond to events in ActionScript 3. Some suggestions to try on your own To get comfortable with the techniques introduced in this chapter, you can try some of the following techniques: Change the number of times that the opening animation repeats by altering the conditional statement.
Experiment with modifying this code. Remember that if you cause the code to stop functioning, you can always reset the code snippet. If the condition is false, you can execute an alternative block of code. Use code snippets to create ActionScript that navigates the Flash Timeline in response to button clicks.
Add code to a function created by a code snippet. Write event listeners to listen for mouse events. Write event-handling functions that respond to mouse events. Use buttons to change the value of a variable.
In the previous lesson, you created code directly in frames of the Timeline that ran automatically when the frame containing the code played. In this lesson, you will get a deeper under- standing of events in ActionScript. Understanding the event model in ActionScript 3. A large part of learning ActionScript is learning what events are available and determining how to respond when an event takes place.
And as you get more comfortable with ActionScript, you can create your own custom events. You write code that tells an object to listen for an event, and you write a function that occurs in response to that event. Unlike in ActionScript 1 and 2, the basic syntax for listening and responding to events is the same throughout ActionScript 3.
However, mastering this syntax can challenge many beginners. The good news is that in Flash CS5, you can use the Code Snippets panel to write the syntax to create basic event listeners. You will then gradually transition to writing your own event listener functions.
Working with event-handling functions Listening to and responding to an event in ActionScript is a two-part process. Another piece of code, called an event-handler function, responds when that event takes place.