fireworks_8图像制作

《fireworks_8图像制作》由会员分享，可在线阅读，更多相关《fireworks_8图像制作（111页珍藏版）》请在金锄头文库上搜索。

1、第4章 Fireworks 8.0图像制作 1第4章 Fireworks 8.0图像制作 教学内容 4.1 Fireworks8.0简介 4.2 矢量编辑 4.3 文本编辑 4.4 特效和样式 4.5 GIF动画制作 4.6 位图处理 4.7 图像切片 2第4章 Fireworks 8.0图像制作 4.1 Fireworks 8.0简介 4.1.1 Fireworks 8.0简介 n1.简介：Fireworks 8.0是一个功能非常 强大的绘制和处理图片的软件。它主要针 对网页图形设计和制作的，使用它创建和 编辑网页图形，可以对其进行动画处理、 添加高级交互功能以及优化图像等。 3第4章 Fi

2、reworks 8.0图像制作 4.1.1 Fireworks 8.0简介 2. Fireworks常用的文件类型 nPNG：即可移植网络图形，是 Fireworks 的本 身文件格式。 nGIF：是一种很流行的网页图形格式，可用于卡 通、徽标、包含透明区域的图形以及动画。 nJPEG：专门为照片或增强色图像开发的图像格 式。 4第4章 Fireworks 8.0图像制作 4.1.1 Fireworks 8.0简介 n3.新功能 ：在直观、可定制的环境中创 建和优化用于网页的图像并进行精确控制 。对 ActionScript 和 CSS（层叠样式表） 格式的新增支持使 Fireworks 能够

3、更有效 地与 Dreamweaver 和 Flash 一起工作。 n 详见Fireworks 8.0帮助文档。 5第4章 Fireworks 8.0图像制作 4.1.2 Fireworks 8.0工作环境 n标题栏 n菜单栏 n文档窗口 n工具栏 n “工具”面板 n“属性”面板 n其它浮动面板 6第4章 Fireworks 8.0图像制作 “工具”面板 n位于屏幕的左侧，包括选择、位图 、矢量、web、颜色和视图等工具 组。如在“选择”工具中，通过“缩放” 工具、“倾斜”工具和“扭曲”工具来编 辑所选对象，使其变形和扭曲， 7第4章 Fireworks 8.0图像制作 工具面板（续） n工具

4、条上包括各种选择、创建、编辑图像 的工具,有的工具按钮的右下角有一个小三 角，说明这个工具包含有几种不同的形式 ，按住这个工具按钮不放就能显示其他的 形式。 8第4章 Fireworks 8.0图像制作 属性面板 n属性面板显示当前选区的属性、当前工具 选项或文档属性。默认情况下，属性面板 停放在工作区的底部。 9第4章 Fireworks 8.0图像制作 属性面板的基本操作 n通过右击属性面板的标题栏，弹出菜单， n可以将属性面板以半高方式打开，只显示 两行属性，也可以全高方式打开，显示四 行属性。 n同样可以通过单击“属性”二字 或字左侧的小三角 将属性检查器完全折 叠。 10第4章 Fi

5、reworks 8.0图像制作 浮动面板 面板抓取器 标题按钮 选项菜单 标题栏 提示：在网页三剑客中的浮动面板的操作方法基本一致 。 11第4章 Fireworks 8.0图像制作 1.工具栏的组成和基本操作 n通过窗口菜单，调出“主要”工具栏和“修改 ”工具栏 问：在DW中如何调出“文档”和“标准”工具栏？ 12第4章 Fireworks 8.0图像制作 “主要”工具栏 n新建按钮 n打开按钮（打开图片文件） n保存按钮（扩展名为.png） n导入按钮（将外部的图片导入Fireworks ） n导出按钮（导出其他格式的文件，如gif 、jpg等） 13第4章 Fireworks 8.0图像

6、制作 新建按钮 n单击该按钮可新建一个png格式的图像文 件。png是Fireworks本身的文件格式。 n当画布尺寸大于图像尺寸时，可以选择“ 修改”“画布”-“符合画布”，去掉周围没 有使用的空间。 14第4章 Fireworks 8.0图像制作 新建按钮（续） 新建文档对话框 1.以象素、英寸或厘米为单位输入画布宽度和高度。 2.以象素、英寸或厘米为单位输入分辨率。 3.在图中为画布选择白、透明或自定义颜色。选中“自定义”选 项按钮时，先单击颜色框，然后从弹出窗口中选择一种自定义 画布颜色。 15第4章 Fireworks 8.0图像制作 打开按钮 n在 Fireworks 中，通过“打

7、开按钮”可以很 容易地打开和编辑矢量和位图图形。 n若要打开文件而不覆盖前一版本，请选择 “打开为未命名”，然后用其它名称保存该 文件。 16第4章 Fireworks 8.0图像制作 打开按钮（续） n打开按钮钮功能等于“文件”菜单单下的“打 开”命令。 n若要打开已有的Fireworks文档时时： 如果打开最近关闭的文档，可选择“文件”-“打开最近的文 件”子菜单中快速打开，此菜单最多可以列出10个最近打开的 文档， 17第4章 Fireworks 8.0图像制作 保存按钮 n功能：保存文档 n若要以gif、jpg、png、tif等格式保存文 档，则可以选择“导出”按钮。 18第4章 Fi

8、reworks 8.0图像制作 举例 n在fireworks 8.0中画一个房子，由三角形 和长方形组成；保存文件名为“房子.png”, 要求导出文件名为“房子. gif”。 n在fireworks 8.0中导入一张明星图片，图 片宽度为400像素，保存件名为“明星 .png”,要求导出文件名为“明星.jpeg”。 19第4章 Fireworks 8.0图像制作 2.文件视图 n文件视图选项卡 n显示比例和动画控制按钮 20第4章 Fireworks 8.0图像制作 4.2 矢量编辑 n计算机图形可以分为两种：矢量图和位图 。 21第4章 Fireworks 8.0图像制作 4.2.1 绘制矢

9、量对象 n使用工具面板上的基本形状工具可以轻松 地绘制直线、矩形、圆等基本图形。基本 形状工具位于工具面板的“矢量”栏上。 22第4章 Fireworks 8.0图像制作 1.绘制直线、矩形和椭圆 （1）从“工具”面板中选择“直线”工具、“矩 形”工具或“椭圆”工具。 （2）在“属性”面板中设置笔触和填充属性 。 （3）在画布上拖动以绘制形状。 对于“直线”工具，按住 Shift 键并拖动可限制只能按 45 的倾角增量来绘制直线。 对于“矩形”或“椭圆”工具，按住 Shift 键并拖动可将形状 限制为正方形或圆形。 23第4章 Fireworks 8.0图像制作 2. 绘制圆角矩形 n（1）从

10、“矩形”工具弹出菜单中，选择“圆 角矩形”工具。 n（2）拖动画布以绘制矩形。 24第4章 Fireworks 8.0图像制作 3.绘制多边形和星形 n选择 菜单项后，鼠标光 标变成“+”，在画布上拖拽便画出多边 形。 25第4章 Fireworks 8.0图像制作 绘制多边形和星形（续） n选中 ，在属性面板中 将多边形选项调节到 选项， 拖拽鼠标，即可绘制各种星形。 26第4章 Fireworks 8.0图像制作 绘制多边形和星形（续） n自动形状是智能矢量对象组，这些对象组 遵循特殊的规则以简化常用可视化元素的 创建和编辑。 打开/关闭螺 旋形 螺旋数 27第4章 Fireworks 8

11、.0图像制作 4.2.2 编辑路径 n1.绘制路径 绘制路径一般使用钢笔工具，路径的形状 是由路径上绘制的点和控制柄决定的，控 制柄是用来控制曲线在定位点处的斜度和 弯曲程度 。 定位点 控制柄 28第4章 Fireworks 8.0图像制作 绘绘制折线线 n在文档窗口指定的位置处，单击鼠标左键 ，然后在目的地再次单击鼠标左键，可在 两点之间绘制直线，多次单击可绘制折线 。 29第4章 Fireworks 8.0图像制作 绘绘制曲线线 n在文档窗口指定的位置处，按住鼠标左键 不放，拖动鼠标，直到显示为所需曲线为 止。 30第4章 Fireworks 8.0图像制作 2.路径编辑 nFirewo

12、rks 提供了多种编辑矢量对象的方 法。 n（1）使矢量对象弯曲和变形 n（2）使用刀子工具 n（3）路径的基本操作 31第4章 Fireworks 8.0图像制作 （1）使矢量对象弯曲和变形 使用“自由变形”工具可以直接对矢量 对象执行弯曲和变形操作，而不是 对各个点执行操作。 利用“自由变形”工具绘制苹果。 32第4章 Fireworks 8.0图像制作 操作步骤： n新建一个文件，在画布中绘制一个椭圆，单击“自由变形 ”工具，在其属性面板中设置光标的半径大小为40像素 ，在画布中按下鼠标，可以看到鼠标变成了一个红色的 圆，用这个红色的圆拖动路径变成苹果的样子。 n为苹果添加一个小小的柄，

13、选择“更改区域形状”工具， 在其属性面板中设置光标的半径大小为10像素，强度为 80，然后从苹果的内部来拖动路径，按住鼠标左键向上 拖。 n选择“油漆桶”工具，对苹果进行为由白色到红色的放射 性渐变填充。 n选中苹果，单击“滤镜”按钮并在弹出的菜单中选择“阴影 和光晕”，单击“投影”按钮， 使苹果更有立体感。 33第4章 Fireworks 8.0图像制作 （2）使用“刀子”工具 n“刀子”工具能够将一个路径切成两个或多 个路径。 34第4章 Fireworks 8.0图像制作 操作步骤： n在图中绘制三个正圆分别以黑色和白色填 充。 n选中大圆，选中“刀子”工具，进行纵向沿 圆心的切割，使之

14、被切成两个半圆 n修改右半圆的填充颜色为白色。 n绘制一黑一白两个小圆放在图中。 35第4章 Fireworks 8.0图像制作 （3）路径的基本操作合并 n可以将多个路径对象合并成单个路径对象 。 n选择两个或多个路径，然后选择“修改” “组合路径”“合并” 。 36第4章 Fireworks 8.0图像制作 （3）路径的基本操作联联合 n联合路径是指将多个对象混合后，以所有 对象的外部轮廓作为路径，生成一个新的 对象。 n选择“修改”-“组合路径”-“联合” 。 37第4章 Fireworks 8.0图像制作 （3）路径的基本操作交集 n相交路径是指将所有选中对象的相交部分 的外部轮廓作为

15、路径，生成一个新的对象 。 n选择“修改”-“组合路径” -“交集 ”。 38第4章 Fireworks 8.0图像制作 （3）路径的基本操作打孔 n打孔路径是指用上层对象的轮廓剔除下层 对象的内容,生成一个新的对象。 n选择“修改”-“组合路径” - “打孔 ” 。 39第4章 Fireworks 8.0图像制作 制作标记图形 n使用的主要菜单： “编辑“ “克隆” “修改”“变形”“数值变形” “修改“”组合为路径“”打孔“ “修改”“组合为路径” “联合” “修改”“变形” “水平翻转” 40第4章 Fireworks 8.0图像制作 操作步骤 n新建文件，宽度为600，高度为600，单位为象素，背景 色为白色。 n用工具箱中的矩形工具，在编辑区拖画出一个长和宽都 是100象素的正方形，填充色为浅蓝色（0099CC）。 n选中该正方形，“编辑“ “克隆”，克隆出一个，选中克 隆出的正方形，“修改”“变形”“数值变形”，在弹出 的对话框中设置为“调整大小”，把长和宽都设为60象素 。然后同时选中这两个一大一小的正方形，“修改”“ 组合路径”“打孔”。这样，得到了一个边框为20象素 的镂空正方形。 n选中这个镂空正方形，“修改”