8.1. Incorporating Graphics Theoretically, you can cut or copy graphic elements from any other program you have open , paste them into Flash, and tweak them. For example, say you've created a drawing in Microsoft Paint. In Microsoft Paint, you can choose Edit  Copy. Then, in Flash, you can choose Edit Paste in Center to transfer the image from Microsoft Paint to your Stage and edit it using Flashs drawing and painting tools. Unfortunately, you can get hit-or- miss results by using the system clipboard in this way. Flash may decide to flatten ( group ) the drawing, limiting your ability to edit it. Flash may also decide to ignore certain effects (such as transparency and gradients) so that the image you paste onto your Stage doesn't quite match the image you cut or copied . A much safer alternative: In your non-Flash program, save your graphic elements as separate files, and then import those files into Flash. Flash lets you import virtually all graphics file formats, including the popular .jpg, .gif, .bmp, and .eps formats (see Table 8-1 for a complete list). Table 8-1. Graphics File Formats You Can Import into Flash | File Type | Extension | Note | | Adobe Illustrator | .eps, .ai, .pdf | Instead of automatically pulling these files in as flat, rasterized bitmaps, Flash lets you set import settings that help preserve the original images' layers and editable text. | | AutoCAD DXF | .dxf | | | Windows Bitmap | .bmp, .dib | If you're running a Mac, you need to have QuickTime 4 (or later) installed on your computer to import Windows bitmap files into Flash. | | Enhanced Windows Metafile | .wmf | Only works on Windows. | | Macromedia Freehand | .fh7, .fh8, .fh9, .fh10, and .fh11 | Instead of automatically pulling these files in as flat, rasterized bitmaps, Flash lets you set import settings that help preserve the original images' layers and editable text. | | Graphic Interchange Format (including animated GIF) | .gif | | | Joint Photographic Experts Group | .jpg | | | Portable Network Graphic | .png | Instead of automatically importing PNG files created Macromedia Fireworks in as flat, rasterized bitmaps, Flash lets you set import settings that help preserve the original images' layers, editable objects, and editable text. | | Flash and FutureSplash (pre-Flash) players | .swf, .spl | | | MacPaint | .pntg | You have to have QuickTime 4 installed before you can import MacPaint files into Flash. | | Portable Document Format (Adobe Acrobat) | .pdf | Instead of automatically pulling these files in as flat, rasterized bitmaps, Flash lets you set import settings that help preserve the original images' layers and editable text. | | Photoshop | .psd | You have to have QuickTime 4 installed before you can import Photoshop files into Flash. | | PICT | .pct, .pict | You have to have QuickTime 4 installed before you can import PICT files into Flash. | | QuickTime Image | .qtif | You have to have QuickTime 4 installed before you can import QuickTime Image files into Flash. | | Silicon Graphics Image | .sgi | You have to have QuickTime 4 installed before you can import Silicon Graphics Image files into Flash. | | Targa | .tga | You have to have QuickTime 4 installed before you can import Targa files into Flash. | | Tagged Image File | .tif, .tiff | You have to have QuickTime 4 installed before you can import TIFF files into Flash. | | Windows metafile | .wmf | Only works on Windows. |
Note: If you're looking for places to find third-party graphics files to import into Flash, check out the box on Section 8.2.2.
8.1.1. Importing Graphics Files Flash lets you import graphics files that you've created with another image-editing program (such as Adobe Photoshop) and then stored on your computer. After you import a graphics file, you can either edit the image it contains using Flash's tools and panels or just add it directly to your animation.
Note: Table 8-1 shows you a complete list of all the different graphics file formats you can import into Flash.
UP TO SPEED
Flash/QuickTime Cross-Pollination | | Since the good old days of Flash 4, Flash has enjoyed a symbiotic relationship with Apple's QuickTime. Back then, you could import a QuickTime movie into Flash, and then add some Flash content (for example, buttons that Web surfers can press to start and stop the QuickTime movie). And you can still import QuickTime movies into Flash 8 and link the two together, as you see on Section 8.3.2.2. But the relationship between Flash and QuickTime goes beyond video integrationit also affects your ability to import media files into Flash. If you have QuickTime installed on your computer, for example, Flash lets you import more types of graphic file formats than it does if you don't have QuickTime installed (see Table 8-1 for details). Fortunately, QuickTime's easy to install. It's free, too. To download a copy, visit www.apple.com/quicktime/download. |
As you see in the steps below, after you've imported a graphics file, Flash stores a copy of the image in the Library panel (Section 1.4.10) so you can add as many instances of the image to your animations as you like. Of course, there's no such thing as a free lunch . Depending on the format of your graphics file (Table 8-1), Flash either pulls the image in as a collection of editable shapes and layerswhich you can work with just as you work with any image in Flashor as a flattened bitmap, which limits your editing choices a bit. "Editing bitmaps" on Section 8.1.2.1 gives you tips for working with flattened bitmaps. To import a graphics file into Flash: -
Choose File Import Import to Stage . The Import dialog box you see in Figure 8-1 appears. -
In the "File name" field, type the name of the file you want to import (or, in the file window, click the file to have Flash fill in the name for you) . To see all the different types of files you can import, click the drop-down box next to "Files of type." -
Click Open . The Import dialog box disappears. Flash places a copy of the image both on the Stage and in the Library (Figure 8-2) unless you chose to import a file with one of the following extensions: .ai, .eps, .pdf, .png, or .fh*. When you import one of those five file types, Flash displays an extra Import settings window that lets you tell it how much editability you want to preserve: whether you want it to convert the original frames into Flash frames or Flash scenes, whether you want Flash to pull in all the frames or just a few, whether you want it to include invisible layers or not, and so on. For example, Figure 8-3 shows you the Import settings windows you see when you import files created with Adobe Illustrator, Fireworks, and Freehand. Figure 8-1. You can import a graphic to the Stage and to the Library, as you see in the numbered steps, or just to the Library (by choosing Edit Import to Library). Either way, you first have to tell Flash which file contains the graphic you want to importand thats exactly what you do here, in the Import dialog box.  Figure 8-2. After you import a bitmap, Flash throws a backup copy of the image into the Library as a convenience so that you can drag another copy onto the Stage if you want to (without having to go through all the trouble of importing the file again). To see the properties of your newly imported bitmap, click the information icon you see here.  -
If you see one of the Import settings windows (Figure 8-3), click to select one or more of the following options, and then click OK . Convert pages to: Scenes/Keyframes . Tells Flash to map multiple pages in the graphics file either to individual scenes in Flash (see Chapter 10) or keyframes. In most cases, keyframes are your best bet. Convert layers to: Layers/Keyframes/Flatten . Tells Flash to keep the layering structure of the original file intact, to place the content of each layer in a separate keyframe, or to flatten the content of all layers onto a single Flash layer, respectively. Which pages to import (All/From/To) . Tells Flash to import the graphic elements on all the pages of a multipage file, or only those elements on the specific pages you specify. Include invisible layers . Tells Flash to try to import all layers, including those marked as hidden in the original editing program. Include Background Layer . Tells Flash to import the layer that, in the original drawing program, is the equivalent of the Stage. Maintain text blocks . Tells Flash to keep the text blocks that it imports editable. Rasterize everything . Tells Flash to flatten all of the elements in the graphics file into bitmap images on one layer, no matter how many layers the file contains. Choosing this option gives you the best shot at importing something that looks close to what it looks like in the original drawing program, although obviously you're sacrificing the ability to edit the image. Rasterization resolution . Only available if you chose "Rasterize everything" (see above), this option tells Flash how high-quality a bitmap you want it to create from the graphics file. Your options are 72, 144, and 300 (the higher the number, the higher the quality). File structure: Import as movie clip and retain layers/Import into new layer in current scene . Tells Flash either to import the graphics file into a new movie clip Timeline or to place it in a single Flash layer on top of any other layers that happen to be in the Timeline, respectively. Objects: Rasterize if necessary to maintain appearance/Keep all paths editable . Tells Flash either to flatten all images onto a single layer so they can't be edited separately or to try to preserve the editability of objects. (Flash may not be able to keep objects editable after it imports them, but you can tell it to do its best.) Text: Rasterize if necessary to maintain appearance/Keep all paths editable . Tells Flash either to flatten all text blocks so that individual letters can't be edited separately, or to try to preserve the editability of the text blocks. (Flash may not be able to keep text blocks editable after it imports them, depending on factors such as the fonts used, but you can tell it to try.) Import as a single flattened bitmap . Similar to "Rasterize everything," this option tells Flash not to preserve the editability of any part of the graphics file and just pull the whole thing in as a single, nonlayered entity. The Import settings window disappears. Flash places a copy of the graphics in the graphics file both on the Stage (or in multiple frames and layers, based on the options you selected above) and in the Library, as shown in Figure 8-2. WORKAROUND WORKSHOP
Importing Unimportable Graphics | | Don't expect perfection when you're importing complex graphicsespecially if you're trying to preserve the ability to edit your graphics in Flash. Flash does the best it can, but there are an awful lot of variables involved, from the specific effects you applied to the graphics to the specific version of the program you used to create them. If the graphics you import into Flash don't look or behave the way they do in the original program, try one or more of the following: -
Ungroup the imported image by selecting it on the Stage and then choosing Modify Ungroup. -
Try using the Clipboard . First, choose Edit Preferences (Windows) or Flash Preferences (Mac) to display the Preferences window. In the Category list, click Clipboard. Then adjust the settings based on what youre trying to import. For example, if you're trying to import an image containing a gradient effect, click the Gradient Quality drop-down list and then choose Best. If you're trying to import a Free-Hand file, turn on the checkbox next to "Maintain as blocks." Then, in the original program, copy your image. Return to Flash and choose Edit Paste in Center. -
Return to the original program and see if you can simplify the image . Reduce the number of colors you're using, as well as the number of layers, and flatten (group) as much of the image as you can. Then try the import process again. |
Figure 8-3. Top Left: When you try to import certain types of vector files into Flash, Flash lets you specify how much editability you're willing to sacrifice for good-quality images. Here, you see the dialog box Flash displays when you try to import a PostScript file created with Adobe Illustrator.
Top Right: This settings window appears when you try to import a file created with Macromedia Fireworks. You'll notice that the options you can set here are very similar to those you can set in the other two.
Bottom: These are the settings Flash offers when you try to import a file created with Macromedia FreeHand. In a perfect world, Flash would do exactly what you tell it, settings-wise; but in real life, Flash isn't always able to import externally created files perfectly in terms of either graphic effects or editability. 
8.1.2. Editing Bitmaps Depending on the graphic file format you import into Flash, you may be able to edit the edited image using Flash's tools, or you may not. If Flash recognizes the image as a vector image, with distinct strokes and fills, you're good to go. Just open the Tools panel, choose a selection, drawing, or painting tool, and get to work. But if the image comes through as a bitmap, you need to do a bit of finagling, because Flash treats bitmaps as big blobs of undifferentiated pixels. (See the box on Section 8.2 for more details.) With bitmaps, Flash's selection tools don't work as you might expect. Say, for instance, you import a scanned-in photo of the Seattle skyline. Flash treats the entire photo as a single entity. When you click the Space Needle, Flash selects the entire scanned-in image. When you try to use the Lasso tool to select the half of the image that contains Mount Rainier, Flash selects the entire image. When you try to repaint the sky a lighter shade of gray, Flash repaints (you guessed it) the entire image. Fortunately, Flash gives you a few options when it comes to working with bitmaps: You can break them apart, you can turn them into vector graphics, or you can turn them into symbols. The following sections describe each option. 8.1.2.1. Turning bitmaps into fills Breaking apart a bitmap image transforms the image from a homogenous group of pixels into an editable fill. You still can't click the Space Needle and have Flash recognize it as a distinct shape (you can only do that with vector art), but you can use the Selection, Subselection, and Lasso tools to select the Space Needle and then either cut it, copy it, move it, repaint it, or otherwise edit it separately from the rest of the scanned-in image. To break apart a bitmap: -
On the Stage, select the bitmap image you want to break apart . Flash displays a selection box around the image. -
Choose Modify Break Apart . Flash covers the image with tiny white dots to let you know it's now a fill. At this point, you can use the Selection, Subselection, and Lasso tools to select portions of the image (something you couldn't do before you broke the bitmap apart). 8.1.2.2. Turning bitmaps into vectors Tracing a bitmap transforms a bitmap into a vector graphic. You can check out the box on Section 8.2 for a rundown of the differences between the two; but basically, turning a bitmap into a vector gives you three benefits: -
It produces a cool, stylized , watercolor effect. -
It reduces the file size associated with the image (but only in cases where the image doesn't contain a lot of different colors or gradients). -
It turns a nonscalable image into a scalable imageone you can "zoom in" on without it turning all fuzzy on you.
Note: The less colors your bitmap contains, the more faithful your bitmap-turned-vector is likely to be to the original. Tracing a bitmap of a hand-drawn sketch done in black charcoal, for example, is going to result in a vector graphic that resembles the original bitmap much more closely than a bitmap trace of a scanned-in photo. (Even photos that look to the naked eye as though they only contain a handful of colors usually contain many, many more at the pixel level.)
To trace a bitmap, select the bitmap you want to turn into a vector graphic, and then select Modify Bitmap Trace Bitmap. Figure 8-4 shows you an example. 8.1.2.3. Turning bitmaps into symbols You can't change the color , brightness, or transparency ( alpha ) of an imported bitmap, but you can change them for a symbol. So if all you want to do is tint or fade a bitmap, you can use a quick and easy fix, and transform it into a symbol. To turn a bitmap into a symbol: -
Select the bitmap, and then choose Modify Convert to Symbol . The Convert to Symbol dialog box appears. -
In the Convert to Symbol dialog box, turn on the radio box next to Graphic and then click OK . In the Property Inspector, click the drop-down list next to Color to set the symbol's brightness, tint, and alpha (transparency) settings.
Note: For the skinny on symbols, check out Chapter 7; for more on color, brightness, and transparency, see Chapter 5.
8.1.3. Importing a Series of Graphics Files At times, you may have a series of graphics files you want to import into Flash. Say, for example, you have a series of images you took with a digital camera showing a dog leaping through the air to catch a tennis ball. If you import all these images into Flash, one per frame, you've got yourself an animation. (How herky-jerky or smooth the animation appears depends on how many images you have; the more images, the smoother the animation.) If you give your graphics files sequential names such as dog_01.gif, dog_02.gif, dog_03.gif, and so on, Flash is smart enough to recognize what you're trying to do, and it imports the entire series in one fell swoop. Figure 8-4. Top: Here's the way a scanned-in image looks as a bitmap.
Bottom: This is how it looks after Flash has traced it (turned it into vector art). With photos, the effect is more arty than realistic, which might be just what you're looking for. Even though the image is now a vector, you can't click to select individual objectssuch as the child or the open bookbecause Flash doesn't recognize meaningful shapes. Instead, it works off pockets of color saturation. 
To import a series of graphics: -
Make sure the names of the files you want to import end with sequential numbers ; for example, file1.bmp, file2.bmp, and file3.bmp . -
Choose File Import Import to Stage . The Import dialog box you see in Figure 8-5 (top) appears. -
In the Import dialog box, click to select the first file in the series, and then click Import . The confirmation dialog box you see in Figure 8-5 (bottom) appears. -
Click Yes . The confirmation dialog box disappears, and Flash imports the series of files. On the Timeline you see one image (and one keyframe) per frame. UP TO SPEED
Vector vs. Bitmap Images | | Flash lets you import and work with two different types of graphics files: vector and bitmap. You can't tell by looking at the imagethe difference is in the structure of the information that makes up the image. Here are the main points: Computer programs, including Flash, store vector graphics (such as the original artwork you create on the Stage) as a bunch of formulas. Vector graphics have the advantage of being pretty modest in size compared to bitmaps, and they're scalable. In other words, if you draw a tiny blackbird and then decide to scale it by 500 percent, your scaled drawing will still look like a nice, crisp blackbird, only bigger. In contrast, computer programs store bitmap , or raster , graphics (such as a scanned-in photo) as a bunch of pixels. Bitmap graphics doesn't refer just to files with the Windows bitmap (.bmp) extension; it refers to all images stored in bitmap format, including .eps, .ai, .gif, .jpg, and .png. (You can find a complete list of the file formats Flash lets you import on Section 8.1.1.) The good thing about bitmap graphics is that they let you create super-realistic detail, complete with complex colors, gradients and subtle shadings . On the downside, bitmaps typically take up a whopping amount of disk space, and they're not particularly scalable: If you scale a photo of a blackbird by 500 percent, it appears blurry because all Flash can do is enlarge each individual pixel: It doesn't have access to the formulas it would need to draw the additional pixels necessary to keep the detail crisp and sharp at five times the original drawing size. Why do you care whether a graphics file is a vector or bitmap? Because you work with imported bitmap files differently in Flash than you do with imported or original vector files. As you see on Section 8.1.2.1, you need to break bitmap images apart before you can crop them in Flash. You also need to optimize the bitmaps you import into Flash if you're planning to reduce the size of your finished animation. (Chapter 14 shows you how.) |
If you check the Library panel (Window Library), you see that Flash has placed each of the image files in the Library.  |
