logo
g Text Version
Beauty & Self
Books & Music
Career
Computers
Education
Family
Food & Wine
Health & Fitness
Hobbies & Crafts
Home & Garden
Money
News & Politics
Relationships
Religion & Spirituality
Sports
Travel & Culture
TV & Movies

dailyclick
Bored? Games!
Nutrition
Postcards
Take a Quiz
Rate My Photo

new
European Travel
Action Movies
Bible Basics
Houseplants
Romance Movies
Creativity
Family Travel


dailyclick
All times in EST

Low Carb: 8:00 PM

Full Schedule
g
g Flash and Animation Site

BellaOnline's Flash and Animation Editor

g

Create and Edit Symbols and Instances in Adobe Flash Professional CS3


In the last tutorial, we discussed FlashR symbols, instances and the Library Panel and how to use them together to keep your project assets organized and the size of your project to a minimum. In this tutorial, we will do the following.

1. Create a Flash symbol
2. Add instances of this symbol to the Stage
3. Edit the symbol

To create a symbol for our tutorial, let's draw a simple white circle that will represent a snowflake. We will then convert this circle to a symbol in preparation for animation.

  1. To start a new project, choose Create New, Flash File (ActionScript 3.0) from the Welcome Screen.

  2. We need a dark colored background to represent the sky in order to see the white snowflakes. Go to the Properties Inspector and click on the Size/Document Properties button. Set the Background Color to a dark blue in the Document Properties dialog box.

    Oval Tool
  3. Now we will set up to draw our snowflake. Select the Oval tool from the Tools panel and set the Stroke Color to Null and the Fill Color to white. Click anywhere on the Stage and draw a small oval.

    Selection Tool
  4. Double-click on the snowflake with the Selection tool. From the Menu Bar, click Modify, Convert to Symbol. In the Convert to Symbol dialog box, name the symbol Flake and set the Type of symbol to Movie Clip. Keep the default Registration setting. You will see our new symbol displayed in the Library Preview window. You will also see the icon, Name of our symbol and Type of symbol listed in the Library.

  5. If our symbol is now in the Library, what is left on the Stage? The oval has been changed into the first instance of our symbol. Click on the instance of our symbol on the Stage and you can see the information about the instance displayed in the Properties Inspector.

    Instance of: Flake
    Instance behavior: Movie Clip

  6. To add another instance of the symbol to the Stage, simply drag it from the Library.

Now we will edit the symbol or "master" that is stored in the Library by changing the color of the snowflake.

  1. Click outside of the instance on the Stage to deselect all of the instances of the snowflake.

  2. From the Library Panel, double-click on the icon for our Flake symbol. The Stage will change to display the symbol in the center of the edit workspace. Although this edit workspace is the same background color as our Stage, we are not working on the Stage at this time. To verify this, take a look at the Edit Bar and you will see the icon and name of our symbol.

    This is one of two ways to begin editing a symbol. Let's go back to the Stage and see how to use the other method which is called Edit in Place. To get out of our current edit mode and back to our Stage, click on Scene 1 in the Edit Bar.

  3. To use Edit in Place, double-click on one instance of the snowflake on the Stage. You will notice that the Stage has not disappeared as it did before. When we use Edit in Place, the Stage remains visible and the contents are dimmed. This is a nice feature which allows us to edit the symbol and immediately view the effect that it will have on the scene.

  4. We can change the Fill Color of our Flake symbol to a light gray color in the Properties Inspector. Notice that the change in color is reflected in the Library Preview window and in the Properties Inspector. Click on Scene 1 in the Edit Bar to exit editing and return to the Stage and you will see that both instances of the Flake symbol (both snowflakes) are now a light gray.

  5. We will use this project file again. Click File, Save As and name the Flash file Flake.fla.




Add Create+and+Edit+Symbols+and+Instances+in+Adobe+Flash+Professional+CS3 to Twitter Add Create+and+Edit+Symbols+and+Instances+in+Adobe+Flash+Professional+CS3 to Facebook Add Create+and+Edit+Symbols+and+Instances+in+Adobe+Flash+Professional+CS3 to MySpace Add Create+and+Edit+Symbols+and+Instances+in+Adobe+Flash+Professional+CS3 to Del.icio.us Digg Create+and+Edit+Symbols+and+Instances+in+Adobe+Flash+Professional+CS3 Add Create+and+Edit+Symbols+and+Instances+in+Adobe+Flash+Professional+CS3 to Yahoo My Web Add Create+and+Edit+Symbols+and+Instances+in+Adobe+Flash+Professional+CS3 to Google Bookmarks Add Create+and+Edit+Symbols+and+Instances+in+Adobe+Flash+Professional+CS3 to Stumbleupon Add Create+and+Edit+Symbols+and+Instances+in+Adobe+Flash+Professional+CS3 to Reddit



 



RSS | Related Articles | Editor's Picks Articles | Top Ten Articles | Previous Features | Site Map


For FREE email updates, subscribe to the Flash and Animation Newsletter


Past Issues


print
Printer Friendly
bookmark
Bookmark
tell friend
Tell a Friend
forum
Forum
email
Email Editor


Content copyright © 2014 by Diane Cipollo. All rights reserved.
This content was written by Diane Cipollo. If you wish to use this content in any manner, you need written permission. Contact Diane Cipollo for details.

g


g features
Motion Workspace - Checkbox, Dials and More

Motion Workspace - Menu, Icons and Sliders

The Motion Toolbar Tools

Archives | Site Map

forum
Forum
email
Contact

Past Issues
memberscenter


vote
Poetry
Daily
Weekly
Monthly
Less than Monthly



BellaOnline on Facebook
g


| About BellaOnline | Privacy Policy | Advertising | Become an Editor |
Website copyright © 2014 Minerva WebWorks LLC. All rights reserved.


BellaOnline Editor