Fireworks4极速教程

文 / 5D多媒体 Candy

一、初识Fireworks4.0

　　Fireworks是一个强大的网页图形设计工具，你可以使用它创建和编辑位图、矢量图形，还可以非常轻松的做出各种网页设计中常见的效果，比如翻转图象，下拉菜单等，设计完成以后，如果你要在网页设计中使用，你可以将它输出为html文件，还能输出为可以在photoshop，illustrator和flash等软件中编辑的格式。

文件窗口

　　Fireworks 的文件窗口上有四个标签，可以同时编辑和预览图象，你可以同时预览四种不同的优化设定所产生的效果，选择最理想的一种设定。

工具条

　　工具条上包括各种选择、创建、编辑图象的工具,有的工具按钮的右下角有一个小三角，说明这个工具包含有几种不同的形式，按住这个工具不放就能显示其他的形式。

矢量模式与位图模式

　　Fireworks 可以进行矢量模式与位图模式的编辑，在默认状态下，Fireworks 在打开时是处于位图模式下，你所绘制的图形是作为矢量对象来处理的。当你在编辑它们时，你会看到你是在修改构成矢量图形的路径。

　　你可以打开或是输入位图，可以对构成位图的像素进行编辑，在处于位图状态下时，画布带斜纹的框包围着。

浮动面板

　　Fireworks的浮动面板包括有layer（图层），frames(帧），color mixs(颜色混合），behavor(行为)，optimize(优化)和object（对象）等。

　　在工作中你可能会发现有些面板经常会用到，你可以把工作起来最方便的面板排列方式保存起来，使用菜单命令command ->panel layout,如果下次要调出这种排列方式只要command ->panel layout set的子菜单内选择就行。

　　在工作区的右下角有一排快速启动栏，点击快速启动按钮就可以很迅速的调出相应的浮动面板。

库（Library）

　　库（Library）里储存了可以被重复使用的元素，称为symbol(符号)，你可以创建一个符号或是将已经存在的对象转化为符号。

　　符号分为图象、动画、和按钮三种，要调用符号只要把它拖到画布上就可以了，一个符号可以有多个instance（例图），如果你编辑了符号，那么画布上所有的instance（例图）都会改变。

 

二、做一个按钮

画一个矩形

　　首先我们要在辅助线的帮助下，画一个矩形。

　　1、从菜单上将 View > Guides 的 Show Guides 和 Snap to Guides 选上，这样就可以显示辅助线并且确保对齐到辅助线(Guids)。

　　2、单击工具条上的矩形工具(Rectangle tool) 。

　　3、将矩形工具(Rectangle tool)指针贴近辅助线(Guides)矩形区域的一个角，按下鼠标并拖动到对角上。

渐变填充

　　为了让这个矩形更象一个按钮，我们要给这个矩形进行渐变填充并且加上立体效果。

　　1、打开fill（填充）面板，然后确保矩形仍然处于选中的状态，在fill面板上的Fill Category 下拉菜单上选择Linear（线型渐变）方式。

　　2、然后在Fill name下拉菜单上选择Black，White。

　　3、点击编辑按钮（edit）然后把左边的颜色样本象右边拖一点，使黑白渐变更加暗淡一点。

添加效果（Effects）

　　Effects面板可以给图象和文字加上特别的效果，比如渐变和浮雕。

　　1、如果Effects（效果）面板不可见，从菜单中选择 Window > Effect。

　　2、在Effects（效果）面板最上面的下拉菜单中选择“Bevel and Emboss-Inner Bevel”（渐变和浮雕-内斜面）。

　　3、并且在斜边形状的下拉菜单中选择Sloped，然后把边缘宽度设为4。

　　注意：在加上效果以后如果想修改可以点击Effects面板上的 按钮。

　　要创建一个JavaScript 按钮 ，必须先将物件转化为Symbols(符号),Fireworks中的(符号)是存储在文档的库(Library)中可以重复利用的元素。

转化为Symbols(符号)

　　1、选定这个矩形区域,从菜单中选择 Insert > Convert to Symbol.

　　2、在Name(名称)一栏中填入 MyButton 。

　　3、选择按钮(Button)选项，然后单击“ok”。

　　现在你可以看到，这个按钮被一层绿色所覆盖，并且在左下角有一个小箭头，这层绿色表示这是一个分割区(Slice)。而这个箭头表明这个矩形区域是存储在文档的库(Library)中Symbols的一个例图(Instance)。 然后，你将会使用这个圆形的（behavior control ）动作控制器 来创建一个翻转图象。

　　4、选择菜单 Window > Library可以看到在库(Library)中的按钮：

[1] [2] [3] [4] 下一页