计算机常用工具软件

计算机常用工具软件第1页，共71页，2023年，2月20日，星期四<2>内容提要10.1Fireworks概述10.2文档的基本操作10.3图像的基本操作10.4Fireworks制作实例第2页，共71页，2023年，2月20日，星期四<3>10.1Fireworks概述图像也是网页中不可缺少的部分，使用Macromedia公司开发的Fireworks可以非常方便地处理网页图像。该软件不仅结合了位图以及矢量图形处理的特点，具有处理复杂图像的功能，而且还能为图像创建各种交互式动感效果。网页中的各种图像：产品图片、背景图片、按钮图片、广告图片。各种标志：网站标志、各种小图标。网页动画：各种动画LOGO、动画Banner、动画广告。网页界面设计：网页首页设计、网站内容页面设计。辅助网页制作：导航条、按钮、交换图像、弹出菜单。优化网页图像：减小图像文件大小。第3页，共71页，2023年，2月20日，星期四<4>Fireworks的工作界面Fireworks的工作界面，主要由标题栏、菜单栏、工具栏、工具箱、绘图区域、属性面板和功能面板等组成。第4页，共71页，2023年，2月20日，星期四<5>Fireworks的工作界面标题栏工具栏绘图区域工具箱菜单栏功能面板属性面板第5页，共71页，2023年，2月20日，星期四<6>1）标题栏标题栏位于Fireworks窗口的顶部，显示了当前编辑的文件名称和缩放比率。第6页，共71页，2023年，2月20日，星期四<7>2）菜单栏菜单栏位于标题栏的下方，包括文件、编辑、视图、选择、修改、文本、命令、滤镜、窗口、帮助10组不同功能的指令菜单。单击各主菜单项都会弹出相应的下拉菜单，有些下拉菜单还包括了下一级的子菜单。第7页，共71页，2023年，2月20日，星期四<8>3）绘图区域绘图区域即编辑图像的区域，也被称为画布。它就是通过使用Fireworks的各种工具进行编辑图像的地方。在绘图区域中上方有、、或4个按钮，可以在原始界面和预览界面之间进行切换，单击按钮返回原始界面，单击按钮显示预览界面，单击按钮显示2幅图的预览界面，单击显示4幅图的预览界面。第8页，共71页，2023年，2月20日，星期四<9>绘图区域单击按钮将弹出快速导出的菜单，可以将Fireworks中编辑的图像快速导出为Macromedia公司的其他产品或者是其他图像处理软件的格式。在绘画区域的下方是所编辑图像文档的状态栏，分别用于控制Gif动画的播放、退出位图编辑模式、显示图像的尺寸和控制图像缩放比例。第9页，共71页，2023年，2月20日，星期四<10>4）快捷工具栏快捷工具栏包含图像编辑中经常使用到的一些辅助工具，如新建、打开、保存、导入、导出、打印、撤销、剪切、复制、粘贴等一些功能按钮。第10页，共71页，2023年，2月20日，星期四<11>5）绘图工具栏在绘图工具栏中包含着绘制和编辑图像的各种工具。选择【窗口】→【工具】命令或按【Ctrl+F2】快捷键可以打开或隐藏工具箱，它主要由选择、位图、矢量、网页、颜色和视图6个部分构成。其中各个工具的作用如下。选择工具主要用于选择对象及对选择的对象进行变形操作，每个工具的作用如下。第11页，共71页，2023年，2月20日，星期四<12>绘图工具栏“指针”工具：用于选择或者拖动对象。“选择后方对象”工具：用于选择被其他对象覆盖的对象。“部分选定”工具：可以选择对象组中的某个对象，也可以选择矢量图像中的各个控制点。“缩放”工具：用于缩放对象。“倾斜”工具：用于旋转和倾斜对象。“扭曲”工具：用于扭曲和变形对象。“裁剪”工具：用于对图像进行裁剪。“导出区域”工具：用于将选中的部分导出。第12页，共71页，2023年，2月20日，星期四<13>位图工具位图工具主要用于绘制位图和对位图进行处理。“选取框”工具：用于创建矩形选区。“椭圆选取框”工具：用于创建椭圆或圆形选区。“套索”工具：通过拖动鼠标的方式建立任意形状的选区。“多边形套索”工具：用于创建多边形选区。“魔术棒”工具：将颜色相近的区域创建为选区。“刷子”工具：用于创建具有填充效果的粗线条。第13页，共71页，2023年，2月20日，星期四<14>位图工具“铅笔”工具：通过拖动鼠标的方式创建任意形状的线条。“橡皮擦”工具：用于擦除不需要的区域或者对象。“模糊”工具：用于使编辑的区域或者图像具有模糊的效果。“锐化”工具：用于使编辑的区域或者图像具有锐化的效果。“减淡”工具：用于使编辑的区域或者图像颜色减淡。第14页，共71页，2023年，2月20日，星期四<15>位图工具“加深”工具：用于使编辑的区域或者图像颜色加深“涂抹”工具：用于在图像中沿拖动的方向推移图像。“橡皮图章”工具：用于把图像的一个区域复制或克隆到另一个区域中。“替换颜色”工具：用一种颜色替换另外的一种颜色。“红眼消除”工具：用于除去照片中出现的红眼。第15页，共71页，2023年，2月20日，星期四<16>位图工具“滴管”工具：用于吸取鼠标所在位置的颜色。“油漆桶”工具：利用已设置的颜色填充所选择的区域。“渐变”工具：利用设置的渐变颜色填充所选中的区域。第16页，共71页，2023年，2月20日，星期四<17>矢量工具矢量工具主要用于绘制矢量图形和对矢量图形进行处理。“直线”工具：在画布中绘画出直线。“钢笔”工具：用于绘制直线路径。“矢量路径”工具：用于绘制各种形状的矢量路径。“重绘路径”工具：重新绘制路径。矩形、椭圆和多边形工具：下拉菜单中的选项分别用于绘制相应形状矢量图形。第17页，共71页，2023年，2月20日，星期四<18>矢量工具“文本”工具：用于在图像中插入并编辑文本。“自由变形”工具：可以直接对矢量对象执行弯曲和变形操作。“更改区域形状”工具：主要用于拉伸变形区域指针外圆内的所有选定路径的区域。“路径洗刷”工具：用于更改路径的外观。使用不断变化的压力或速度，可以更改路径的笔触属性。“刀子”工具：能够将一个路径分割成两个或多个路径。第18页，共71页，2023年，2月20日，星期四<19>Web工具Web工具主要用于创建热点切片，每个工具的作用如下。“矩形热点”工具：可以在图像的目标区域周围绘制矩形热点。“圆形热点”工具：可以在图像的目标区域周围绘制圆形热点。“多边形热点”工具：可以在图像的目标区域周围绘制多边形热点。“切片”工具：实现图像的矩形切片切割。第19页，共71页，2023年，2月20日，星期四<20>Web工具“多边形切片”工具：可以实现图像的多边形形状的切片切割。“隐藏切片和热点”工具：实现切片热点视图的隐藏。“显示切片和热点”工具：实现切片热点视图的显示。第20页，共71页，2023年，2月20日，星期四<21>颜色工具颜色工具主要用于设置填充颜色和描边颜色。“笔触颜色”：用于设置描边的颜色。“填充颜色”：用于设置填充的颜色。“设置默认笔触/填充色”：将笔触颜色和填充颜色设置为默认值，即笔触颜色为黑色，填充颜色为白色。“没有描边或填充”：设置没有描边或填充。“交换笔触/填充色”：将笔触颜色和填充颜色进行交换。第21页，共71页，2023年，2月20日，星期四<22>视图工具视图工具主要用于转换屏幕的显示模式。“标准屏幕模式”：将屏幕切换到“标准屏幕模式”显示模式。“带有菜单的全屏模式”：可以用来将屏幕切换到“带有菜单的全屏模式”显示模式。“全屏模式”：将屏幕切换到“全屏模式”显示模式。“手形”工具：用于移动画布查看图像。“缩放”工具：放大或缩小画布的显示比例。第22页，共71页，2023年，2月20日，星期四<23>6）“属性”面板“属性”面板位于绘画区域的下方，用来设置绘图区域中正在编辑的内容的属性。可以选择【窗口】→【属性】命令或按【Ctrl+F3】快捷键打开或关闭“属性”面板，根据当前选择工具和对象的不同，“属性”面板中所显示的选项也会不同。第23页，共71页，2023年，2月20日，星期四<24>7）控制面板在Fireworks中有多个控制面板，一般位于工作界面的右侧。在默认情况下有些面板没有显示，可以选择“窗口”菜单中相应的命令显示或者隐藏这些面板。第24页，共71页，2023年，2月20日，星期四<25>10.2文档的基本操作Fireworks文档的基本操作包括文档的新建、保存、打开和导入的操作。第25页，共71页，2023年，2月20日，星期四<26>1）新建文档在Fireworks中新建文档的方法有以下几种：在开始页中单击“新建”栏中“Fireworks文档”链接。选择【文件】→【新建】命令或按【Ctrl+N】快捷键。单击快捷工具栏中的“新建”按钮。第26页，共71页，2023年，2月20日，星期四<27>新建文档执行新建文档操作后将打开“新建文档”对话框，其各项含义如下。宽度：在文本框中输入画布宽度的数字，并选择相应的单位，包括“像素”、“英寸”和“厘米”三个选项。高度：在文本框中输入画布高度的数字，并选择相应的单位，包括“像素”、“英寸”和“厘米”三个选项。分辨率：在文本框中输入画布分辨率的数字。分辨率越高，则文件就越大，单位包括“像素\英寸”和“像素\厘米”两个选项。第27页，共71页，2023年，2月20日，星期四<28>“新建文档”对话框第28页，共71页，2023年，2月20日，星期四<29>2）保存文档在Fireworks中保存文档有以下两种方法完成：选择【文件】→【保存】命令或按【Ctrl+S】快捷键。单击快捷工具栏中的“保存”按钮。如果文档是第一次保存或选择【文件】→【另存为】命令，则会打开“另存为”对话框。在对话框中可以选择保存文档的位置和输入文件的名称，设置完成后单击按钮进行保存。第29页，共71页，2023年，2月20日，星期四<30>3）打开文档在Fireworks中打开文档有以下两种方法：单击快捷工具栏中的“打开”按钮、选择【文件】→【打开】命令或按【Ctrl+O】快捷键，在打开的“打开”对话框选择要打开的文档，再单击按钮打开。双击Fireworks图标的文档即可打开该文档。第30页，共71页，2023年，2月20日，星期四<31>4）文件的导入在Fireworks中可以导入一幅图像到当前的文档中，有以下几种方法可以导入文档：执行【文件】→【导入】命令或按【Ctrl+R】快捷键。单击快捷工具栏中的“导入”按钮。执行导入操作后，在打开的“导入”对话框中选择需要导入的图像文件，然后单击“打开”按钮即可。第31页，共71页，2023年，2月20日，星期四<32>示例：新建一个Fireworks文档本示例将新建一个Fireworks文档，并在文档中导入一幅图像，然后保存文档，主要练习新建文档、导入图像和保存文档等操作。制作思路：1）启动Fireworks8。2）新建文档。3）导入“鲨鱼.psd”图像。4）保存“鲨鱼.png”文档。●

演示例1第32页，共71页，2023年，2月20日，星期四<33>10.3图像的基本操作设置文档的属性就是在对图像的编辑过程中，对绘图文档的大小、颜色以及分辨率等进行调整或者修改。图像的基本概念包括像素、分辨率、颜色深度和Alpha通道等概念。第33页，共71页，2023年，2月20日，星期四<34>像素和分辨率像素是组成位图的最基本单元。可以把像素看成是一个极小的方形的颜色块，每个小方块为一个像素。图像的分辨率是指图像在单位尺寸上所包含的像素数量。图像的分辨率与图像的精细度和图像文件的大小有关。第34页，共71页，2023年，2月20日，星期四<35>颜色深度和Alpha通道颜色深度是指图像中可以显示出的颜色数，在计算机中，通常采用颜色深度这一概念来说明其处理色彩的能力。Alpha通道使用不同灰度值表示透明度的大小，Alpha通道的作用主要用于合成不同的图像，实现混合叠加。第35页，共71页，2023年，2月20日，星期四<36>修改画布的大小在Fireworks中，修改画布的大小是通过在“画布大小”对话框中来完成的。可以通过选择【修改】→【画布】→【画布大小】命令，或者在文档的“属性”面板中单击按钮打开“画布大小”对话框。第36页，共71页，2023年，2月20日，星期四<37>改变画布的背景颜色改变画布的背景颜色是通过在“画布颜色”对话框中完成的。选择【修改】→【画布】→【画布颜色】命令，打开“画布颜色”对话框。第37页，共71页，2023年，2月20日，星期四<38>旋转画布可以选择【修改】→【画布】菜单下的命令对画布进行旋转。菜单中各项命令的含义如下。旋转180°：执行此命令，画布将旋转180°。旋转90°顺时针：执行此命令，画布将顺时针旋转90°。旋转90°逆时针：执行此命令，画布将逆时针旋转90°。第38页，共71页，2023年，2月20日，星期四<39>修剪画布通过Fireworks中的修剪画布命令，可以使画布的大小同绘制图像或者文字的大小相匹配，从而减少文件量。选择【修改】→【画布】→【修剪画布】命令或按【Ctrl+Alt+T】快捷键，修剪画布。第39页，共71页，2023年，2月20日，星期四<40>示例——练习图像的基本操作制作思路：新建一个500×400像素的Fireworks文档。导入“海浪.psd”、“鱼1.psd”、“鱼2.psd”、“鱼3.psd”和“鱼4.psd”共五幅图像。重新设置画布大小旋转画布修剪画布●

演示例2第40页，共71页，2023年，2月20日，星期四<41>修剪文档操作方法如下：（1）从“工具”面板中选择“裁切”工具，或者选择“编辑”>“裁剪所选位图”菜单。（2）在画布上拖动鼠标。并调整修剪手柄，直到边框包围要保留的文档区域为止。（3）在边框中双击或者按下Enter键以修剪文档。●

演示例3第41页，共71页，2023年，2月20日，星期四<42>使用标尺、辅助线和网格标尺能够帮助测量、组织和计划作品的布局辅助线是从标尺拖到文档画布上的线条。它们可作为帮助放置和对齐对象的辅助绘制工具网格在画布上显示一个由横线和竖线构成的体系，网格对于精确放置对象非常有用。此外，用户可以查看和编辑网格、调整网格大小以及更改网格的颜色。第42页，共71页，2023年，2月20日，星期四<43>首选参数和快捷键首选参数快捷键第43页，共71页，2023年，2月20日，星期四<44>操作的撤消与重复使用“历史记录”面板可以查看、修改和重复操作文档过程中所进行的动作。在该面板中列出了最近在Fireworks中执行的操作及次序，所列动作个数最多不超过在Fireworks“首选参数”对话框的“撤消步骤”域中指定的数值。第44页，共71页，2023年，2月20日，星期四<45>上机练习：绘制以下图形●

演示第45页，共71页，2023年，2月20日，星期四<46>10.4Fireworks制作实例我们将通过实例介绍如何利用Fireworks8制作网页图片，通过它们进一步学习Fireworks8工具和面板的灵活使用。第46页，共71页，2023年，2月20日，星期四<47>路径文字如果希望文本不受矩形文本块的限制，可以绘制路径并将文本附加到它。文本将顺着路径的形状排列并且保持可编辑性。将文本附加到路径后，该路径会暂时失去其笔触、填充以及效果属性。用户随后应用的任何笔触、填充和效果属性都将应用到文本，而不是路径。如果之后将文本从路径分离出来，该路径会重新获得其笔触、填充以及效果属性。第47页，共71页，2023年，2月20日，星期四<48>制作环绕文字以下是制作环绕文字的具体步骤：1．新建宽度为300像素，高度为200像素的文件，背景设为白色。2．选择“工具”面板中的“文本”工具，在工作区输入文本“，字体选择“ArialBlack”，字号为20像素大小，颜色为黑色，如图所示。3．选择“工具”面板“矢量”部分的“椭圆”工具。4．按住“Shift”键，在工作区画一个圆，并在“属性”检查器中设置新的宽度和高度值均为108。第48页，共71页，2023年，2月20日，星期四<49>制作环绕文字5．单击“填充颜色框”图标，在颜色弹出窗口中点击“透明按钮”。6．选中“描边”工具，在“描边种类”中选择“铅笔”|“1象素柔化”。7．按住Shift键，使用“指针”工具同时选择圆和文字。8．打开“文本”菜单，单击“附加到路径”菜单命令，环绕文字效果如图所示。第49页，共71页，2023年，2月20日，星期四<50>制作环绕文字9.如果想旋转文字，选择“工具”面板中的“缩放工具”，出现圆形箭头，就可以旋转文字。10．如果希望文本沿路径的内侧排列，选择“文本”菜单中的“倒转方向”。11．打开另一幅图片，从其中复制徽标到圆的中心位置。12．设置文本的颜色为#FF3300，并可根据内容尺寸重设画布大小。13．单击“文件”菜单中的“保存”，将图像保存为例4.png。●

演示例4第50页，共71页，2023年，2月20日，星期四<51>蒙版效果Fireworks8中的蒙版能够隐藏/显示对象或图像的某些部分，可以使用蒙版技术在对象上实现许多种创意效果。用矢量对象创建蒙版时，矢量对象的路径轮廓可用于剪贴或裁剪其它对象。当位图对象用作蒙版时，其像素的亮度或者其透明度会影响其它对象的可见性。第51页，共71页，2023年，2月20日，星期四<52>文本蒙版文本蒙版是一种矢量蒙版。应用文本蒙版的方式与使用已有对象应用蒙版的方式一样：只需将文本用作蒙版对象即可。应用文本蒙版的常用方法是使用其路径轮廓，但也可以使用其灰度外观产生遮罩效果。第52页，共71页，2023年，2月20日，星期四<53>文字蒙盖图像效果1．打开一幅原始图像（C:\Windows\Web\Wallpaper\Bliss.bmp）2．使用“汉仪大黑简”字体输入文字“天高任鸟飞”，设置大小为96像素。3．将文字的颜色改成白色，并为文字增加投影效果。设置投影的距离为7像素，颜色为白色，不透明度、柔化和角度均采用默认值。第53页，共71页，2023年，2月20日，星期四<54>文字蒙盖图像效果4.同时选中文字和图片，使用菜单命令中的“修改”|“蒙版”|“组合为蒙版”命令。5．选择“修改”|“画布”|“修剪画布”菜单命令设置画布大小。6．在“属性”面板中将默认导出选项设为“JPEG-较高品质”。7．使用“文件”|“导出”菜单命令将图像保存为例5.jpg。●

演示例5第54页，共71页，2023年，2月20日，星期四<55>网页按钮按钮是网页中的重要元素，以下通过实例讲解如何利用Fireworks8制作按钮。1．创建300×200像素新文档，绘制一个矩形，修改属性检查器面板中的矩形圆度值为100，将矩形四角转换成圆角样式。2．将矩形宽度设为150，高度设为48，并用颜色#FF6600填充。3．为此圆角矩形增加效果，单击属性检查器中增加效果按钮，弹出效果快捷菜单，然后选择“斜角和浮雕”|“内斜角”命令，设置斜角边缘形状为平坦，宽度为7像素，其它参数采用默认值，效果如图所示。第55页，共71页，2023年，2月20日，星期四<56>网页按钮4．选择“滤镜”|“调整色彩”|“曲线”菜单命令，打开曲线对话框修改图像的光影层次效果。用鼠标指标拖动曲线生成波浪形状，色彩可形成带有金属质感的效果。需要说明的是：在曲线调整之前，色彩的添加没有任何意义，因为在曲线编辑中会打乱色调。第56页，共71页，2023年，2月20日，星期四<57>网页按钮5.选择“滤镜”|“色彩调整”|“色相/饱和度”菜单命令，为按钮上色。6．在制作好的按钮造型上，使用文本工具输入文字“BACK”，调整字体类型和大小，也可调整圆角矩形大小，并使二者居中对齐。7．使用滴管工具吸取按钮中间色调，并为字体填充该色。选择效果菜单中的“斜角和浮雕”|“内斜角”命令，为字体添加凹陷的立体化效果。属性设置如图所示。第57页，共71页，2023年，2月20日，星期四<58>网页按钮8．在属性面板上调整字体的透明度为85，使文本的凹陷效果显得更加自然逼真。9．为按钮添加投影，设置距离为7像素，不透明度为32%，其他参数采用默认值。●

演示例6第58页，共71页，2023年，2月20日，星期四<59>制作弹出菜单当用户将鼠标移动到某些网页对象上时，浏览器中将显示弹出菜单。用户可以将URL链接附加到弹出菜单项以便于导航。例如，可以使用弹出菜单来组织与导航栏中的某个按钮相关的若干个导航选项，也可以根据需要在弹出菜单中创建任意多级子菜单。第59页，共71页，2023年，2月20日，星期四<60>弹出菜单以下是创建弹出菜单的实例。1．利用绘图工具栏中的钢笔工具绘制菜单背景样式，设置填充色为#FFFF66，没有边框线，并输入文字“David的个人网站”，并将字体设置为“华文行楷”。2．绘制一个88×25的矩形，设置填充色为#FFCC33，边框线颜色为#FFFF66。选择效果快捷菜单中的“斜角和浮雕”|“凹入浮雕”命令为矩形添加立体效果，设置宽度为2像素，其他参数采用默认值。3．按住Alt键移动立体矩形，将其复制4个，为制作按钮做准备。4．将制作好的零部件水平排列整齐，在第一个立体矩形上输入相应文字，形成静态按钮，也就做好了网页的水平菜单条。第60页，共71页，2023年，2月20日，星期四<61>弹出菜单5．单击Web工具箱中的“矩形热点”工具，为其中一个按钮绘制热区。6．选择“修改”|“弹出菜单”|“添加弹出菜单”命令，为指定的按钮设置下拉菜单。7．在打开的“弹出菜单编辑器”对话框中，包含4个选项卡。在“内容”选项卡的“文本”栏输入弹出菜单内容，“链接”栏中输入此菜单项超级链接的URL对象，“目标”栏中可选择浏览器打开链接的方式。如果要创建子菜单项，只需点击“缩进菜单”按钮即可。第61页，共71页，2023年，2月20日，星期四<62>弹出菜单8．创建了基本菜单和可选子菜单之后，即可在“弹出菜单编辑器”的“外观”选项卡上，对文本进行格式设置，对“滑过状态”和“弹起状态”应用图形样式，并选择垂直或水平方向。9．“高级”选项卡提供了用于控制以下各项的附加设置：单元格大小、边距和间距，文字缩进，菜单消失延时，以及边框宽度、颜色、阴影和高亮等。10．在“位置”选项卡中设置弹出菜单和子菜单的位置。当“网页层”可见时，用户还可以通过在工作区中拖动弹出菜单的轮廓来调整其位置。11．回到设计页面中，可以发现在热区下方出现弹出菜单的外轮廓样式，并与热区以线相连，但看不到弹出菜单的实际面貌，如图13-25所示。此时可拖动弹出菜单轮廓，调整其位置。●

演示例7第62页，共71页，2023年，2月20日，星期四<63>网页切片切片就是将一幅大图像分割为一些小的图像切片，然后在网页中通过没有间距和宽度的表格重新将这些小的图像无缝隙的拼接起来，成为一幅完整的图像。当网页上的图片文件较大时，浏览器下载整个图片需要花很长的时间，切片的使用使得整个图片分为多个不同的小图片分开下载，这样下载的时间就大大地缩短。在目前互联网带宽并不高的情况下，运用切片来减少网页下载时间且又不影响图片的效果，不能不说是一个两全其美的办法。第63页，共71页，2023年，2月20日，星期四<64>切片优点除了减少下载时间之外，切片还具有以下一些优点：制作动态效果：利用切片可以制作出各种交互效果。优化图像：完整的图像只能使用一种文件格式，应用一种优化方式，而对于作为切片的各幅小图片我们就可以分别对其优化。创建链接：切片制作好之后，就可以对不同的切片创建不同的链接，而不需要在大的图片上创建热区。更新网页的某些部分：切片使用户可以轻松地更新网页中经常更改的部分。第64页，共71页，2023年，2月20日，星期四<65>网页切片示例1．打开设计好的网页图像2．选择工具箱Web组中的“切片”工具，在图像的“学习经历”位置上按下鼠标左键并拖动绘制一个矩形区域，当矩形大小适当时释放鼠标，这样就生成了