Fireworks MX 2004特效插件应用手册
数码时尚
在网站建设过程中，利用Fireworks MX 2004，可以让我们创建从简单图形按钮到复杂变换效果的任何内容。同时，该软件还具有良好的扩展性能，利用各种扩展的特效插件，可以使Fireworks的功能得到无限延伸，让我们制作出酷炫的网页效果来。
一、功能扩展插件应用基础
1.什么是功能扩展插件(Extension)
功能扩展插件是可以添加到Macromedia应用程序中，以改进该应用程序功能的一个软件。
Macromedia的插件主要有3种：Command命令、Object对象和Behavior行为。Command命令用于在网页编辑时实现一定的功能，例如设置表格的样式；Object对象用于在网页中插入元素，例如在网页中插入图片或Quick Time电影文件；Behavior行为主要用于在网页上实现动态的交互功能，例如单击图片后弹出特定的窗口，而具体起来它可以有浏览器类、动态网页类、格式类、导航类、脚本类、表格类、文字类等各种形式的插件。而本文中提到的Fireworks插件以Command命令为主。
Macromedia Exchange(http://www.macromedia.com/cfusion/exchange/index.cfm)站点是多种功能扩展插件的存储库。Macromedia Exchange Web站点上的有些功能扩展插件由Macromedia创建，有些则由其他开发人员创建。如果你在该站点上发现感兴趣的功能扩展插件，可以使用Web浏览器将它下载，然后用功能扩展插件管理器安装在应用程序中。
2.获取并安装功能扩展插件
(1)获取功能扩展插件
若要在程序中应用功能插件，请首先获取你要安装的功能扩展插件。例如，你在 Macromedia Exchange站点上发现感兴趣的功能扩展插件，可以下载该功能扩展插件文件。功能扩展插件文件以MXP为文件扩展名。
单击该功能扩展插件在Macromedia Exchange站点上的链接开始下载。然后将下载得来的功能扩展插件保存在Macromedia应用程序主目录(安装 Dreamweaver、Flash或Fireworks的目录)中的“Extension Manager”子目录中。
(2)安装功能扩展插件文件
单击“开始→程序→Macromedia→Macromedia Extension Manager”菜单项，启动Macromedia扩展管理器。如图1所示。
单击“File→Install Extension (安装扩展)”菜单命令，在出现的对话框中，选择一个以MXP为扩展名的功能扩展插件文件，单击“Install” (安装)按钮。该功能扩展插件即会安装在兼容的应用程序中。例如，某一功能扩展插件是为Fireworks定义的，而当前运行的是Fireworks，则该功能扩展插件将安装在Fireworks中。如果当前没有运行此应用程序，则该功能扩展插件会自动安装到相应程序中。插件安装完成，即会出现在相应的功能菜单中，供你随时调用。
注意：你也可以在正在运行的Macromedia MX 2004程序中启动Macromedia扩展管理器。单击“Commands(命令)→Manager Extension(管理扩展功能)”菜单命令即可。
3.管理功能扩展插件
(1)启用和禁用已安装的功能扩展插件
如果你已经使用扩展管理器安装了大量的功能扩展插件，则可以选择性地启用/禁用功能扩展插件，以便于控制应用程序的性能。
在扩展管理器中，选中要启用/禁用的扩展插件旁的“On/Off(开/关)”列中的复选框。该功能扩展插件旁的开/关列中有选中标记指示该功能扩展插件已启用；无选中标记则表示该功能扩展插件已禁用。当你禁用功能扩展插件时，它会重新打包供以后使用。若要重新启用该功能扩展插件，请在扩展管理器中选中该功能扩展插件旁的开/关列中的复选框。
(2)删除功能扩展插件
在扩展管理器中，从列出已安装程序的下拉列表中选择一个Macromedia应用程序(如 Fireworks)。从已安装功能扩展插件的列表中选择一个功能扩展插件。单击“File→Remove Extension(移除扩展)”菜单命令，在出现的确认对话框中单击“是”按钮即可。
(3)创建并提交新的功能扩展插件
你可以创建自己的功能扩展插件以供他人使用。Macromedia Exchange站点提供了有关编写和测试功能扩展插件的指南。在Exchange站点的“帮助”菜单中，选择“如何创建功能扩展插件”命令，然后按照功能扩展插件开发指南执行操作。
当你完成功能扩展插件的编写和测试后，请在扩展管理器中单击选择“File→Package Extension(将扩展打包)”菜单命令。当你将功能扩展插件打包并准备好向Exchange提交时，选择“File→Submit Extension(提交扩展)”菜单命令即可。
二、图像效果插件
1.Fireworks自带插件
(1)Add Picture Frame(添加图片框)
该特效插件可以为图片增加一个边框。由于边框使用的是图案材质，其材质还可以由自己来定义。
使用方法：单击“Command→Creative→Add Picture Frame”菜单命令即可。
选项说明：“Select a pattern”选择边框图案，“Frame Size”设置边框尺寸。
(2)Convert Color Command(转换颜色命令)
该特效插件包括Convert to Grayscale(转换为灰度图像)，用于将当前文档转换为灰度图像；Convert to Sepia Tone(转换为乌金色调)用于将当前文档转换为乌金色调的图像，仿佛是年代久远的老照片。
使用方法：单击“Command→Creative→Convert to Grayscale/Convert to Sepia Tone”菜单命令即可。
(3)ALT Tag Commands(ALT标记命令)
该特效插件包括Select Blank ALT Tags(选择空白ALT标记)用于选择带有空白ALT标记的切片和热点。Set ALT Tags(设置ALT标记)用于为所有图像渐隐添加ALT标记。
使用方法：单击“Commands→Web”菜单命令，然后从子菜单中选择该命令。
(4)Align panel(对齐面板)
该特效插件提供各种将对象及锚点对齐的方法。
使用方法：单击“Window→Align”菜单命令，打开对齐面板。
2.外挂插件
(1)Color Glow(色彩发光)
该特效插件可以将普通照片转化为艺术照。使用该插件以后，可以给照片增加一种柔和的光晕效果，色彩也变得更加艳丽，充满艺术气息。
下载地址：http://www.macromedia.com/cfusion/exchange/index.cfm
使用方法：安装该插件后，单击“Command→After shape→Color Glow2”菜单命令即可。使用该插件需要首先用选取框工具选择一个区域，然后使用。
选项说明：“Glow fx Amount”用于调节光晕的程度，数值越大柔和程度越高。
(2)Soft Glamour(柔和)
该特效插件可以使图片变得细腻柔和。如果图片中存有瑕疵，也可以用它进行修复。
下载地址：http://www.macromedia.com/cfusion/exchange/index.cfm
使用方法：打开一张位图，选择一个区域，单击“Commands→Aftershape→Soft Glamour”菜单命令即可。
三、矢量形状插件
1.Fireworks自带插件
(1)Add Arrowheads(添加箭头)
该特效插件用于向所选开放式路径添加17种箭头样式中的任意一种。
使用方法：绘制一条直线，单击“Command→Creative→Add Arrowhead”菜单命令。
注意：路径必须是不封闭的，且一次只能给一个路径添加。
(2)Twist and Fade(螺旋式渐隐)
该特效插件是一个简单易用且功能强大的创意性命令，可用来创建一个或多个对象的旋涡状、分散开的图案。
使用方法：创建一个或多个矢量图形，单击“Command→Creative→Twist and Fade”菜单命令。
选项说明：“Options”控制最终输出时的几个参数，可以在此设置不同步数之间的不透明度变化值，可以设置变换效果是否是随机的，或者可以将最终的输出效果转换为符号；“Preview”可以打开已关闭的预览窗口，默认状态下实时预览窗口是打开的；“Steps”重复效果之间的步数；“Spacing”每步之间的间距；“Rotation”每步之间的旋转角度；“Opacity”每个对象的不透明度。
(3)Fade Image(图像渐隐)
该特效插件将所选渐隐图案应用于当前选定的对象。
使用方法：请选择一个对象，单击“Commands→Creative→Fade Image”菜单命令。
(4)Resize Selected Objects(调整所选对象大小)
该特效插件可用于在不使用缩放工具的情况下，对选定对象的大小进行精确的单像素调整。它对每个选定的对象单独进行调整，而使用缩放工具无法实现这一功能。
使用方法：请选择一个对象，然后“Commands→Resize Selected Objects”菜单命令，在出现的对话框中调整即可。
2.外挂插件
(1)3D Objects(3D物体)
该特效插件用于制作简单的3D效果，特别适合用来制作立体字。
下载地址：http://www.macromedia.com/cfusion/exchange/index.cfm
使用方法：选中文字或矢量图，单击“Commands→Creative→3D Objects v2”菜单命令。
选项说明：“Preset Effect”选择预置的效果；“Interval steps”间隔步数；“Total steps”总计步数。
(2)Bend(扭曲)
该特效插件可以对矢量图进行任意变形，例如弯曲、扭曲等，而且还提供了变形控制，让你可以创造出各种奇妙的图形。
下载地址：http://www.projectfireworks.com/lab/bend.1.0.2.mxp
使用方法：选中矢量图形，单击“Commands→Project Fireworks→Bend”菜单命令。
选项说明：“Direction”设置扭曲的方向；“Tension Point”设置牵拉点；“Amount”扭曲的程度；“Apply to”选择扭曲的方向；“Keep original”选中此项，会保留原始图形，新建一个进行变形。
(3)Sector Tool(扇形工具)
该特效插件可以创建一个扇形。
下载地址：http://www.macromedia.com/cfusion/exchange/index.cfm
使用方法：单击“Window→Sector Tool”菜单命令，打开相应的工作面板，从中选取即可。
四、功能扩展插件
1.Fireworks自带插件
(1)Create Shared Palette(创建共享调色板)
该特效插件用于创建一个共享调色板与其他人共享。
使用方法：单击“Commands→Web→Create Shared Palette”菜单命令。
选项说明：“Maximum number of color”最大颜色数。
(2)Layers Commands(层命令)
该特效插件包括Distribute to Layers(分散到各层)用于将所选对象分散到所有图层； Hide Other Layers(隐藏其他层)用于隐藏除当前图层以外的所有图层；Lock Other Layers(锁定其他层)用于锁定除当前正在编辑的图层以外的所有图层。
使用方法：若要使用其中一个命令，单击“Commands→Document”菜单命令，然后从子菜单中选择该命令。
(3)Panel Layout Sets(面板布局设置)
该特效插件包括1024×768、1280×1024和800×600 三个命令。使用这些命令，可按各种显示器尺寸相应排列面板。
使用方法：单击“Commands→Panel Layout Sets”菜单命令，然后从子菜单中选择该命令。
(4)Data-Driven Graphics Wizard(数据驱动的图形向导)
该特效插件将来自XML文件的数据与Fireworks模板文件中内嵌的变量结合起来，基于该模板文件生成多张新图形。
使用方法：单击“Commands→Data-Driven Graphics Wizard”菜单命令。
(5)Reverse Frames(帧逆序)
该特效插件将当前文档中帧的顺序颠倒。
使用方法：单击“Commands→Document→Reverse Frames”菜单命令。.
(6)Reset Warning Dialogs(重置警告对话框)
该特效插件重置所有包含“不再显示”选项的对话框。
使用方法：单击“Commands→Reset Warning Dialogs”菜单命令。
2.外挂插件
(1)Fill Handles Assistant(手柄助理)
该特效插件可以让用户很轻松地精确控制渐变手柄。
下载地址：http://www.projectfireworks.com/lab/fhassistant.1.1.0.mxp
使用方法：选中一个带渐变填充的图形，单击“Commands→Project Fireworks→Fill Handles Assistant”菜单命令。
选项说明：“Start”设置起始点位置；“Handle”设置手柄控制点。
(2)Copy Merged(复制)
该特效插件类似于Photoshop中的合并拷贝功能，可以将选中的对象合并拷贝到剪贴板，并将其转换为位图。
使用方法：单击“Commands→Objects→Copy Merged”菜单命令。
(3)Harmonia(配色)
该特效插件可以令你轻松地搭配出协调的色彩方案。
下载地址：http://www.macromedia.com/cfusion/exchange/index.cfm
使用方法：单击“Commands→Project Fireworks→Harmonia”菜单命令。
选项说明：“Set as fill”设置为填充色；“Set as stroke”设置为笔触色。
五、Fireworks特效插件开发实例
看了上面的插件介绍，你是否也希望自己亲自动手开发一个插件，将一些常用的功能做成插件，可以方便自己的工作，同时也可以将打包完成的插件上传到网络，与大家一起分享。下面，我们以开发Command插件的实例进行讲述。
1.预备知识
Fireworks MX 2004扩展插件可以使用JavaScript程序来进行开发，Fireworks提供了JavaScript API接口，每个基本的功能都可以通过JavaScript API访问。我们可以通过JavaScript语言来编写Commands命令。结合Flash的Action编程强大功能，将Command命令封装到SWF文件中，最后用XML格式封装成标准的MXP格式文件，就可以将开发的插件在Fireworks MX 2004中安装使用了。
在我们开始进行插件开发之前需要掌握一些基本的知识，包括熟练掌握JavaScript知识，JavaScript是插件编写的基础。除此以外，最好还能够详细了解Fireworks的文档对象模型、API接口以及Fireworks提供的对象、属性和方法等。
另外你还需要了解和掌握Flash制作知识，以便制作基本的界面。同时还需要知道基本的Flash Action知识，因为我们的大多数开发过程是在Flash中使用Action进行，了解如何通过Action在两个不同的程序之间传递参数和变量也是非常重要的。
2.目的分析
首先，我们需要确定插件开发的目的。例如制作一种特殊效果，或者提高工作的效率等。所以我们可以将一些经常使用的操作制作成插件，以方便以后使用。
看下面的制作案例：在制作网页和图像处理时，我们经常会使用抽线图效果，给图片增加该特效以后，图片会产生一种明暗相间的效果，看上去典雅而有韵味。该效果的实现并不复杂，但是如果经常使用也会觉得麻烦。所以考虑将这种效果制作成插件，使用时，直接调用即可。
3.制作与分析
(1)实例制作
首先，我们需要将实例制作出来，同时在历史记录面板中记录具体的操作步骤。
启动Fireworks MX 2004，打开需要制作抽线图的图片，使用矩形工具绘制出一个与该图片同样大小的矩形。
在Properties(属性)面板中将矩形的填充背景设置为黑色，将Texture(纹理)设置为“Line-Horiz4”(水平线4)，将纹理量设置为“100”。同时选中“Transparent”(透明)选项。在Layers(层)工作面板中将对象的混合模式修改为“Multiply”(色彩增埴)。最后，在Properties(属性)面板中将其透明度降低为“40”。制作效果如图2所示。
注意：在制作效果时，步骤尽量简单，以免影响后面的程序开发。
(2)代码分析
打开Frames and History(帧和历史记录)工作面板，单击“History”(历史)选项卡，点击下方的“Copy Steps to Clipboard”(复制步骤到剪贴板)按钮，如图3所示。然后打开记事本，将代码粘帖进去。
fw.getDocumentDOM().addNewRectanglePrimitive({left:54, top:45, right:288, bottom:202}, 0);
fw.getDocumentDOM().setFillNColorNTexture({ category:"fc_Solid", ditherColors:[ "#000000", "#000000" ], edgeType:"antialiased", feather:0, gradient:null, name:"Solid", pattern:null, shape:"solid", stampingMode:"blend", textureBlend:100, webDitherTransparent:false }, "#000000", "Line-Horiz 4");
fw.getDocumentDOM().setOpacity(30);
fw.getDocumentDOM().setBlendMode("multiply");
仔细观察上面的代码，我们可以发现，代码每一行均以fw.getDocumentDOM()开头。这是因为，Fireworks的扩展主要是依靠Document对象模型(DOM)进行，使用fw.getDocumentDOM()函数可以获得Document对象模型。每个执行的动作都需要先用fw.getDocumentDOM()获得文档的DOM。
上述代码中，每一句都执行了一项操作。
fw.getDocumentDOM().addNewRectanglePrimitive({left:54, top:45, right:288, bottom:202}, 0);
该代码绘制出一个矩形，left：54、top：45、right：288、bottom：202用于指定矩形的位置和大小。
由于我们需要制作特效插件，所以该矩形的位置是不固定的，需要通过选择对象的位置和大小来确定。所以将实际的数值用变量来进行替换。
fw.getDocumentDOM().addNewRectanglePrimitive({left:Left, top:Top, right:Right, bottom:Bottom}, 0);
下面设置填充效果。由于我们希望将填充的颜色设置为自定义，这里可以将“#000000”更改为变量。
fw.getDocumentDOM().setFillNColorNTexture({ category:"fc_Solid", ditherColors:[ "#000000", "#000000" ], edgeType:"antialiased", feather:0, gradient:null, name:"Solid", pattern:null, shape:"solid", stampingMode:"blend", textureBlend:100, webDitherTransparent:false }, "color", "Line-Horiz 4");
接下来设置透明度。将透明度的数值也更改为变量。
fw.getDocumentDOM().setOpacity(Opacity);
最后一句代码为改变对象的混合模式，不需要另外设置。
fw.getDocumentDOM().setBlendMode("multiply");
3.在Flash中开发
经过上面的分析以后，我们对Command的代码应该已经有所了解了。下面转入到Flash中去进行开发。
首先在Flash中设计出该插件的界面，你可以根据自己的喜好美化界面。由于透明度和颜色需要自己设置，所以，我们可以选择文字工具在Flash中绘制出两个文本框，并且将文本框设置为“Input Text”(输入文本)，在Properties(属性)面板中将两个文本框的Variable(变量名)分别设置为“Opacity”和“Color”。在Opacity()框中输入“30”，Color()框中输入“#000000”。
设置两个按钮，分别为“OK”和“Cancel”，并将其命名为ok_btn和cancel_btn。如图4所示。
(1)制作界面
打开Action(动作)工作面板，切换至“Expert Mode”(专家模式)选项卡，选取第一帧，输入代码。
先创建一个function applyFWCommand()，当单击OK按钮以后执行这个Function。
function applyFWCommand() {
var userSelection = MMExecute("fw.getDocumentDOM().getSelectionBounds();");
if (userSelection == "") {
MMEndCommand(true, "");
MMExecute("alert(′Could not complete your request. Please make a selection.′);");
} else {
var left = MMExecute("fw.getDocumentDOM().getSelectionBounds().left;");
var left = Number(left);
var top = MMExecute("fw.getDocumentDOM().getSelectionBounds().top;");
var top = Number(top);
var right = MMExecute("fw.getDocumentDOM().getSelectionBounds().right;");
var right = Number(right);
var bottom = MMExecute("fw.getDocumentDOM().getSelectionBounds().bottom;");
var bottom = Number(bottom);
var color = (_root.color);
var Opacity = Number(_root. Opacity);
MMExecute("fw.getDocumentDOM().addNewRectanglePrimitive({left:"+left+", top:"+top+", right:"+right+", bottom:"+bottom+"}, 0);");
MMExecute("fw.getDocumentDOM().setFillNColorNTexture({category:'fc_Solid', ditherColors:['#000000', '#000000'], edgeType:'antialiased', feather:0, gradient:null, name:'Solid', pattern:null, shape:'solid', stampingMode:'blend', textureBlend:100, webDitherTransparent:false}, '"+ color +"', 'Line-Horiz 4');");
MMExecute("fw.getDocumentDOM().setOpacity("+Opacity +");");
MMExecute("fw.getDocumentDOM().setBlendMode('multiply');");
MMEndCommand(true, "");
}
}
(2)代码设计
首先，我们需要在代码中加入一个判断，当没有选中任何对象时，会弹出一个警告窗口：
MMExecute("alert('Could not complete your request. Please make a selection.');");
并且执行一个退出的命令，可以关闭并且返回用户的文档。
MMEndCommand(true, "");
否则便执行下面的命令，设置left、top、bottom、right变量，这几个变量是取自图像的属性。Color和Opacity是由用户输入。
在Flash中，每个API函数都可以被Flash API所调用，它们之间是通过以下方法互相传递，即使用MMExecute()函数。例如在Fireworks中的以下命令：
fw.getDocumentDOM().addNewRectanglePrimitive({left:Left, top:Top, right:Right, bottom:Bottom}, 0);
在调入Flash中后需要转换为：
MMExecute("fw.getDocumentDOM().addNewRectanglePrimitive({left:"+left+", top:"+top+", right:"+right+", bottom:"+bottom+"}, 0);");
转换下面的几条命令，最后加入一个退出的命令，使上面的命令执行完毕后可以退出。
上面是单击“OK”按钮执行的Function，单击“Cancel”按钮后执行的Function相对比较简单，只需结束当前命令并返回到用户文档即可。
function cancelFWCommand() {
MMEndCommand(true, "");
}
下面输入单击按钮后分别执行Function的代码：
ok_btn.onRelease = function() {
applyFWCommand();
};
cancel_btn.onRelease = function() {
cancelFWCommand();
};
上面的代码输入完毕，就可以输出为SWF文件了。我们可以放到Fireworks中试一下看看这个代码是否有效。在Flash中单击“File→Expert Movie(导出影片)”菜单命令，将SWF输出到Fireworks的安装目录下的\Configuration\Commands目录中。
启动Fireworks，在“Commands”菜单的下面可以看到刚才输出的命令。如果发现有错误可以使用Debugging函数进行调试。
Fireworks MX中提供了两个调试代码的函数，分别是：
fw.enableFlashDebugging() //允许调试代码
fw.disableFlashDebugging() //结束代码调试
打开刚才的Flash文件，在需要进行调试Action代码前后分别加入这两条函数：
MMExecute ("fw.enableFlashDebugging();");
MMExecute("fw.getDocumentDOM().addNewRectanglePrimitive({left:"+left+", top:"+top+", right:"+right+", bottom:"+bottom+"}, 0);");
MMExecute("fw.getDocumentDOM().setFillNColorNTexture({category:'fc_Solid', ditherColors:['#000000', '#000000'], edgeType:'antialiased', feather:0, gradient:null, name:'Solid', pattern:null, shape:'solid', stampingMode:'blend', textureBlend:100, webDitherTransparent:false}, '"+color+"', 'Line-Horiz 4');");
MMExecute ("fw.disableFlashDebugging();");
重新输出SWF文件，并在Fireworks中执行。当程序执行到该句时会将其结果显示出来。方便我们查找程序运行所存在的问题。
4.插件打包
Fireworks支持标准的MXP插件封装格式，我们可以用插件管理器进行打包。
在Fireworks中打包插件需要准备好SWF文件和相应的MXI文件，上面我们已经输出了一个SWF文件，下面讲一下MXI文件，MXI文件包含了关于插件的说明和相关信息，文件要求为标准的XML格式。打开记事本输入下面的代码：
＜macromedia-extension name="Scanlines" version="1.0" type="Command"＞
＜!-- List the required/compatible products --＞
＜products＞
＜product name="Fireworks" version="6" primary="true" /＞
＜/products＞
＜!-- Describe the author --＞
＜author name="candyz" /＞
＜!-- Describe the extension --＞
＜description＞
＜![CDATA[This command can easy creative Scanlines effect.]]＞
＜/description>
＜!-- Describe where the extension shows in the UI of the product --＞
＜ui-access＞
＜![CDATA[To use Scanlines V1.0, choose Commands > Scanlines.]]＞
＜/ui-access＞
＜!-- Describe the files that comprise the extension --＞
＜files＞
＜file name="Scanlines.swf" destination="$Fireworks/configuration/commands /" /＞
＜/files＞
＜!-- Describe the changes to the configuration --＞
＜configuration-changes＞
＜/configuration-changes＞
＜/macromedia-extension＞
输入完毕，将其保存为Scanlines.mxi。然后将SWF和MXI文件放在同一个目录下，启动扩展管理器。单击“File→Package Extension”菜单命令，在出现的对话框中选择MXI文件，并给插件取一个名字。扩展管理器将自动执行打包的工作，最后会生成一个MXP文件。安装以后即可在“Commands”菜单中使用。