Using Shared Libraries

That being said, Shared Libraries, managed correctly, can be useful. Imagine you are running a multi-movie Web site that uses cartooning and animation. You've got lots of "zonk,""blap," and "zowie" sounds that are used repeatedly. Wouldn't it be great if someone visiting your site had to download those sounds only one time? Even better, what if you didn't have to include those assets in every single movie? File sizes would go down. Download times would decrease. Everyone would be happy. All you have to do is create a Flash movie with the sounds you need, set up some linkage, and export your SWF. The answer? A Shared Library.

You can do the same thing with symbols and fonts. If you have a logo that is important to the branding of a Web site, you can save that logo in a Shared Library. When the logo changes, or the company name changes, a simple swap of one image in the Shared Library replaces all linked instances of the logo everywhere on the site. Finally, the art director has total control over brandingthat's one happy art director.

If you want to use a Shared Library that already exists, all you have to do is choose File > Open as Shared Library and drag the files that you want to use onto the Stage or into your current movie's Library. You also can create your own Shared Library. Why not try it?

Tip

If you have a file that uses a Shared Library, make sure that the SWF of your file and the SWF of the Shared Library have been uploaded to your server. Without the Shared Library, your Flash movie locks up and doesn't play at all.

Exercise 6.1 Creating a Shared Library

You can use the symbols from a preexisting file to create a Shared Library.

1. Create a new Flash file and choose File > Open as Library. Browse to the logo.fla file in the Chapter_06/Assets folder.

2. Open the Library for your current movie and drag the FigLeaf_logo and FigLeaf_text movie clips from the logo.fla Library into the current Library. You'll notice that the bitmap fl_logo gets transferred as well; don't delete it. It gets used in the FigLeaf_logo movie clip. Close the logo.fla Library.

3. Save your movie as Shared_Logo.fla.

4. Still in Shared_Logo.fla, select the FigLeaf_logo movie clip in the Library. Right-click (Windows) or Control-click (Macintosh), and then choose Linkage (see Figure 6.5) from the pop-up menu to open the Symbol Linkage Properties dialog box.

   Figure 6.5. To set up an item in a Library to be shared, you have to choose to link it by selecting Linkage from the pop-up menu.

   

5. In the Symbol Linkage Properties dialog box, select Export this symbol, name it Logo in the identifier field, and then click OK (see Figure 6.6). Every symbol in a Shared Library must have a unique identifier name.

   Figure 6.6. The Symbol Linkage Properties dialog box is where you establish whether a linked symbol is going to be exported or imported. Every linked symbol in a Library must have a unique identifier name.

   

6. Repeat Steps 4 and 5 for FigLeaf_text, but name it Text in the identifier field. Save your file.

7. Before a Library can be shared, you have to publish the SWF for the file. You can do this either by testing your movie or by selecting File > Publish. Publish your file now.

8. Close Shared_Logo.fla. You can't open a file as Library or Shared Library unless the FLA file is closed.

You imported the symbols you want to share, you set up linkage for them, and you exported the SWF file. Okay, now you have a Shared Library. How do you use it?

Exercise 6.2 Using a Shared Library

Using a Shared Library is very similar to opening any other Flash file as a Library.

1. Open logo.fla from the Chapter_06/Assets folder and use File > Save As to save it to your hard drive. Make sure that you save it to the same directory that contains the SWF for your Shared Library. Open the Library, if it isn't already open.

   Tip

   Do you have to keep your Shared Library SWF file in the same directory as the files that use it? No, but if you don't, you need to be explicit about the path to the Shared Library when you are setting up your linkage properties.

2. Select the FigLeaf_logo movie clip in the Library. Right-click (Windows) or Control-click (Macintosh), and then choose Linkage.

3. Select Import this symbol from URL and name it Logo in the Identifier field. Notice that this name matches the name you gave the same movie clip in the Shared Library (see Figure 6.7). In the URL field, type Shared_Logo.swf, and then click OK.

   Figure 6.7. When you are linking a symbol in a movie to a symbol in a Shared Library, make sure you use the same identifier name for both.

   

4. Repeat Steps 2 and 3 for the FigLeaf_text movie clip, but change the identifier to Text.

5. Save and test your file.

What? No difference? Well, no, not yet. But you actually are pulling the symbols from the Shared Library and not from the internal Library. You'll be able to tell that this is happening if you make some changes to the Shared Library, which is what you'll do next .

Changing a Shared Library

What if your company changes its logo? Fig Leaf did recently. You've been working with the old logo. Because the old logo and text are in a Shared Library, you can easily import the new Fig Leaf images into Shared_Logo.fla. Don't forget, if you change Shared_Logo.fla, you have to publish it again. Otherwise, the changes you make won't be recognized by any files that link to the Shared Library.

Exercise 6.3 Making Changes to the Shared Library

Making changes to the Shared Library is actually pretty simple. You're going to open the Shared Library and import some new symbols from another Library.

1. Open Shared_Logo.fla.

2. Choose File > Open as Library and browse to the newlogo.fla file in the Chapter_06/Assets folder.

3. Select both movie clips (FigLeaf_logo_new and FigLeaf_text_new) and drag them into the Shared_Logo.fla Library.

4. Close the newlogo.fla Library.

   You need to unlink the old images and set up linkages for the new images. You have to keep the same identifier names that you set up originally, or the files that are dependent on the Shared Library won't be able to find the elements to which they're supposed to link.

5. Select the FigLeaf_logo movie clip in the Library. Right-click (Windows) or Control-click (Macintosh), and then choose Linkage.

6. Select No linkage from the Symbol Linkage dialog box, and then click OK.

7. Do the same thing for the FigLeaf_text movie clip.

8. Select the FigLeaf_logo_new movie clip in the Library. Right-click (Windows) or Control-click (Macintosh), and then choose Linkage.

9. Select Export this symbol and name it Logo in the Identifier field. You'll now be exporting this logo rather than the old logo.

10. Repeat Steps 8 and 9 for the FigLeaf_text movie clip, but set the identifier to Text.

11. Save your file and test your movie to create a new SWF file.

12. Now open the logo.swfmake sure you open the SWF file, not the FLA file. You should see the new text and logo, as illustrated in Figure 6.8.

    Figure 6.8. When you make changes to the Shared Library and republish it, all the movies that link to that Shared Library are updated. Here you can see the new Fig Leaf logo that you added to the Shared Library.

    

You've already seen that the changes are recognized in the SWF file. However, if you open logo.fla, you'll immediately notice that the old logo and text movie clips are still in the file. There's no visible evidence that the items in the Shared Library, to which these elements are linked, have changed. It would be really nice if they would automatically update in the FLA when a change is made in the Shared Library, but, unfortunately , that doesn't happen.

Updating FLA Files

If you want to see the updated elements in the logo.fla file, you'll have to use the Swap Image feature in the Instance panel to make some changes.

The Swap Image feature enables you to swap one symbol on the stage for another one. If you change your mind about using Shared Libraries and you need to update your file, this is a useful little trick. It takes a little bit of work to swap the images, but it's not brain surgery.

Exercise 6.4 Swapping in the Updated Images

Swapping in the new images is a simple process.

1. If you don't have logo.fla open, do it now.

2. In logo.fla, choose File > Open as Shared Library, and then browse to Shared_Logo.fla.

3. Drag copies of the FigLeaf_logo_new and FigLeaf_text_new movie clips into the logo.fla Library.

4. Select the instance of the FigLeaf_logo on the Stage. Open the Instance panel (Window > Panels > Instance) and click the Swap Image button to open the Swap Image dialog box.

5. Select FigLeaf_logo_new, and then click OK. The image on the Stage is updated.

6. Repeat Steps 4 and 5 for the FigLeaf_text.

7. Now you can delete FigLeaf_logo and FigLeaf_text from the logo.fla Library.

8. Save your file.

Note

Because you opened Shared_Logo.fla as a Shared Library in logo.fla, Flash is smart enough to fill out the Linkage dialog box properly. Take a look at the FigLeaf_logo_new movie clip's linkage. It is set to import with the correct identifier from the correct URL.

The elements in logo.fla still are linked to the Shared Library, so any changes you make in the Shared Library still are reflected in the logo.swf file. If you want to break the linkage to the Shared Library, you have to select the elements in logo.fla and choose No linkage in the Linkage dialog box.

As mentioned earlier, you also can create shared font symbols in Flash. You'll take a look at that option next.