| Macromedia Flash is a vector-based animation tool that has taken the Web by storm in the last several years . Dreamweaver lets you use Flash text and buttons in your pages without ever having to open Flash itself, or even know much about it. You can also place Flash movies and elements (a new Flash file type) into a Dreamweaver document, them modify them from within Dreamweaver. -
To edit a Flash movie, launch Flash directly from the Design view via the Edit button on the Property inspector. -
To change a Flash element's parameters, use the Parameters button on the Property inspector. (The parameters that will be available for you to modify are set in advance, and [we hope!] documented for you, by the component's creator.) In another example of Dreamweaver-to-Flash integration, you can update links in Flash files from the Dreamweaver site window. Open the Site Map view; choose View, Show Dependent Files; then change the links that appear beneath the SWF file icons. Dreamweaver automatically updates the SWF when you make such a change, and will offer to update the source Flash document (FLA) the next time you open it. CAUTION Some users have reported problems updating links in SWFs created outside Dreamweaver, as opposed to Flash buttons created in Dreamweaver. Test your changed links to ensure that they work.
As with Fireworks integration, Flash integration works best if you enable Design Notes in your Dreamweaver site, and save any Flash movies to the site folder when you're working in Flash MX 2004. File Types and Object Properties Two primary types of Flash objects are available for your use in Dreamweaver MX 2004, whether or not you have Flash MX 2004 installed: text and buttons. This section takes a closer look at these popular Web page additions. Understanding Flash File Types Four Flash file types are important to know about. Table 12.1 shows these file types and explains their purposes. Table 12.1. Flash File Types | File Type | File Extension | Purpose | | Flash Document | .fla | The source file for any Flash project. This file type requires Flash MX to open so you can export the file as an .swf or .swt file for delivery to Web browsers. | | Flash Movie | .swf | This is a Web-ready compressed version of the .fla file. You can view this in a browser with the proper support, but you can't edit the file in Flash. The .swf file type is used when you create Flash buttons and text in Dreamweaver MX. | | Flash Template | .swt | These templates provide a means for you to make modifications to an .swf file. In Dreamweaver MX, this file type is used to create and modify buttons, which are then saved as .swf files for use on a Web page. | | Flash Component | .swc | Flash components , also called elements, are movies designed with customizable parameters that you can edit from within Dreamweaver without launching Flash. Download some from Macromedia Exchange, then insert them via the Flash Elements tab on the new Insert bar. |
Flash Object Properties Certain properties are available for you when working with Flash text and Flash buttons, as well. When you insert a Flash object into your document, you can select the object and set specific properties for that object. The following properties are common to both text and buttons: -
Name ” Identifies the button or text object so it can be used with scripts and behaviors. -
Width ” Specifies the width of the object in pixels, picas, points, inches, millimeters, centimeters, or percentages. -
Height ” Specifies the object's height. You have the same measurement options available as for width. -
File ” The location and filename of the Flash object. You can browse for the file or, if you know the path , simply type it into the available field. -
Edit ” Click this button, and the Flash object dialog box opens so you can modify your Flash button or text. -
Reset Size ” Use this feature to reset the object to its actual size. (Resized Flash objects may look bad!) -
Vertical Spacing ” Specifies, in pixels, the amount of whitespace above and below the object. -
Horizontal Spacing ” Specifies, in pixels, the amount of whitespace to the left and right of the object. -
Quality ” The higher the quality of an object, the better it will look. However, high-quality Flash objects ” especially complex ones ”take longer to load and require more processing power to work well. Available settings are Low, which is good for speed with a lower-quality appearance, and High, which opts for appearance over speed. Auto Low emphasizes speed but delivers higher quality wherever possible. Conversely, Auto High emphasizes quality and speed but opts for speed over quality if achieving both is not possible. -
Scale ” Specifies how the movie will display. One option is Default , which makes the full object appear within the area defined by the width and height attributes. In this instance, the aspect ratio remains intact, preventing distortion. If you choose No Border , borders will be cropped. Exact Fit means that the object will fit into the exact width and height you determine, even if that's not its original size. -
Align ” Specifies the object's alignment. -
Background Color ” Specifies a background color for the object. -
Play/Stop ” Allows you to preview your work. If you're in the preview, you can click the button, which will now be labeled Stop, to stop the preview. -
Parameters ” To add or modify object parameters, click this option to open the Parameters dialog box. Inserting Flash Text Flash text is a Flash movie with only text in it that can be inserted into your Web pages in Dreamweaver. The advantage of Flash text is that you have more control over the typographic choice and quality because of the inherent nature of vector graphics. Vector type tends to be smoother and crisper, which improves readability. Note that you do not need to have Flash MX 2004 installed to create Flash text in Dreamweaver MX 2004. To insert a Flash text object, follow these steps: - Open a previously saved document, or save any new document or a document in progress.
- Place your cursor where you'd like the text object to appear.
- Select the Media drop-down menu on the Insert bar's Common tab. You can click the Flash Text icon, shown in Figure 12.7, or drag and drop it onto the page where you'd like the text object to appear. Alternatively, you can select Insert, Media, Flash Text. The Insert FlashText dialog box appears (see Figure 12.8).
Figure 12.7. The Media menu on the Insert bar's Common tab contains three important icons relative to Flash objects: Flash, Flash Button, and Flash Text. 
Figure 12.8. The Insert Flash Text dialog box contains numerous styling options. 
- Add text into the text box labeled Text.
- Modify the text as per your needs.
- Customize a name for the Flash object file in the Save As field.
- Click Apply or OK.
The Flash text is now inserted into your document. Adding Flash Buttons If you'd like to get a little more adventuresome and add Flash buttons to your page, Dreamweaver MX 2004 makes it remarkably easy to do so ”as easy as adding and modifying Flash text. Some of the advantages of Flash buttons include smoother text, built-in mouseovers, and other effects. Do the following to insert a Flash button object: - As with Flash text, make sure the file with which you are working is updated and saved.
- Place your cursor where you'd like the button object to appear in the document.
- Select the Media drop-down menu on the Insert bar's Common tab. You can click the Flash button icon or drag and drop it onto the page where you want the button object to appear. Alternatively, you can select Insert, Media, Flash Button. The Insert Flash Button dialog box appears (see Figure 12.9).
Figure 12.9. The Insert Flash Button dialog box provides everything you need to create a Flash button in Dreamweaver MX. 
- In the dialog box, browse to find the button style you'd like. Several styles are available, and you can get more from the Macromedia Exchange site by clicking the Get More Styles button found on the right side of the dialog box.
- In the Button Text area, type in the text you want to appear on the button.
- Customize the text style by using the Font and Size options. As with Flash Text objects, you can make a Flash button object a link.
- You can select a background color for your button. As soon as you are happy with your choices, name your file and click Apply or OK to insert the button.
Dreamweaver MX now creates the button and inserts the Flash button object into the document. Previewing, Editing, and Resizing Flash Buttons and Text As you are working with Flash buttons and text objects, being able to preview their features is helpful. You can do this easily in Dreamweaver. You can also easily make additional edits and sizing changes to your objects, perfecting them as you work on your page. Previewing Flash Buttons and Text To preview your Flash button or text object, make sure you're in Design view, select the Flash object, then click the Play button in the Property inspector. The Flash button or text object is now active, and you can test it out (for example, to see a rollover effect). Click Stop at any time to end the preview. NOTE Dreamweaver MX does not let you edit a Flash object while in preview mode.
Editing Flash Objects Here are several ways to open a Flash button or text object for editing: In the case of a Flash text object, the Insert Flash Text dialog box appears. If you are working with a button, the Insert Flash Button dialog box appears. In the case of a Flash movie, Flash MX 2004 itself launches for editing. You can now make any required modifications to the object. Resizing Flash Objects Resizing Flash objects is easy and can be accomplished in Design view. First, select the object; then use the visual resize handles. In many cases, preserving the object's aspect ratio (its width and height relationship) is required. To do this, be sure to hold down the Shift key while resizing. CAUTION Not preserving an object's aspect ratio can result in a distorted or blurry display of that object.
If, at any point, you want to return the object to its original size, simply click the Reset Size button in the Property inspector. |
