1、3.1 矢量图与位图 一. 矢量图形 矢量图形使用称为矢量的线条和曲线(包括颜色和位置信息)描述图像。编辑矢量图形时,修改的是描述其形状的线条和曲线的属性。矢量图形与分辨率无关,因此在对图形进行移动、调整大小、更改形状或更改颜色等操作时,不会改变其外观品质。 二.位图图形 位图图形由排列成网格的称为象素的点组成。图像由网格中每个象素的位置和颜色值决定。编辑位图图形时,修改的是象素,位图图形与分辨率有关,放大位图图形会使图像的边缘呈锯齿状. Fireworks 可以创建和编辑矢量图与位图。 3.2 绘制矢量路径 矢量路径的绘制主要包括:直线、曲线、自由路径。一.绘制直线操作步骤:1. 单击工具箱
2、中的线条工具 2. 在“属性”面板中设置笔触属性 3. 在线条的起始位置按下鼠标左键不放,拖至直线终点处,松开鼠标左键,在画布上画出直线。 提示:拖动鼠标的同时按住 Shift 键时可以画出水平、垂直或与水平、垂直方向成45 度角的直线。二.用钢笔工具创建路径操作步骤:1. 单击工具箱中的“钢笔”工具 2. 在“属性”面板中设置笔触属性和填充属性 3. 单击画布上的不同位置,可以画出由线段组成的直线路径。 4. 如果鼠标单击后不松开,而是拖动鼠标,这样画出来的路径就是曲线路径,通过调整曲线的两条控制线可以设定曲线的弯曲度。 5. 中止绘制开放路径:在结束点双击鼠标;中止绘制封闭路径:将鼠标移至
3、起始点上,鼠标指针变为一个小圆圈,单击起始点。 修改路径上的点操作步骤:1. 点击路径节点选定工具 ,选择矢量图形 2. 改变节点执行以下操作: 把角点变为曲线点:选择路径上的一个点,拖曳直到出现点手柄,角点变为曲线点 把曲线点变为角点:将鼠标移至节点,鼠标变为 ,点击节点,曲线点变为角点 3. 增加删除路径上的点,执行以下操作: 增加节点:将鼠标移至路径,鼠标变为 点击鼠标左键 删除节点:将鼠标移至节点,鼠标变为 点击鼠标左键 三.绘制自由变形矢量路径 操作步骤:1. 从“钢笔”工具弹出菜单中,选择“矢量路径”工具 。 2. 在“属性”面板中设置笔触属性 3. 拖动以进行绘制。若要将路径限制
4、为水平或垂直线,在拖动时按住 Shift 键。4. 释放鼠标按钮以结束路径。若要闭合路径,将指针返回到路径起始点,然后释放鼠标按钮。 练习 3-11) 在画布上画出直线,画出水平、垂直或与水平、垂直方向成 45 度角的直线。2) 用钢笔工具创建开放路径、闭合路径、直线与曲线路径。3) 用钢笔工具编辑路径上的点,把角点变为曲线点;把曲线点变为角点;增加与删除路径上的点。 4) 用矢量路径工具绘制自由矢量路径。3.3 绘制矢量形状 使用形状工具可以绘制矩形、椭圆、多边形、星形以及其它特定的几何形状。 形状工具又被分为“基本形状”和“特定形状”。(见右图) 一. 绘制矩形 操作步骤: 1. 单击工具
5、箱中的“矩形”工具 ; 2. 在“属性”面板中设置笔触属性和填充属性; 3. 在画布上要绘制矩形的位置的左上角按下鼠标左键,拖动鼠标直至所需要的大小。 4. 松开鼠标,矩形绘制完成。 提示: 按住 shift 键并拖动鼠标则绘制正方形;按 Alt 键并拖动鼠标绘制的矩形以鼠标起始点为中心点;按住shift+Alt 键则绘制以鼠标起始点为中心点的正方形。二. 绘制椭圆形操作步骤:1. 点击工具箱中的“矩形”工具,在该工具按钮上按下鼠标左键不放,在弹出的菜单中选择椭圆工具。 2. 在“属性”面板中设置笔触属性和填充属性; 3. 在画布上要绘制椭圆的位置的左上角按下鼠标左键,拖动鼠标直至所需要的大小
6、。 4. 松开鼠标,椭圆图形绘制完成。 提示: 按住 shift 键并拖动鼠标则绘制圆形;按 Alt 键并拖动鼠标绘制的椭圆形以鼠标起始点为中心点;按住 shift+Alt 键则绘制以鼠标起始点为中心点的圆形。三. 绘制多边形使用“多边形“工具可以绘制出从三角形到具有 360 条边的任意正多边形。操作步骤:1. 点击工具箱中的“矩形”工具,在该工具按钮上按下鼠标左键不放,在弹出的菜单中选择多边形工具; 2. 打开“属性”面板; 3. 在“属性”面板中,执行下列操作之一来指定多边形的边数: 使用“边”弹出滑块选择 3 到 25 个边。 在“边”文本框中输入一个从 3 到 360 的数字。 4.
7、在画布上要绘制多边形的位置按下鼠标左键,拖动鼠标直至所需要的大小,松开鼠标。提示:若要将多边形的方向限制为 45 度增量,在绘制时按住 Shift 键。 四. 绘制星形使用“多边形“工具可以绘制出从三角形到具有 360 条边的星形。操作步骤:1. 点击工具箱中的“矩形”工具,在该工具按钮上按下鼠标左键不放,在弹出的菜单中选择多边形工具; 2. 打开“属性”面板,从“形状“弹出菜单中选择“星形“。 3. 在“边“文本框中输入星形顶点的数目。 4. 选择“自动“或在“角度“文本框中输入一个值。接近 0 的值产生的角长而细;接近 100 的值产生的角短而粗。 5. 在画布上要绘制星形的位置按下鼠标左
8、键,拖动鼠标直至所需要的大小,松开鼠标。 提示:若要将星形方向限制为按 45 度的增量变化,在拖动时按住 Shift 键。五. 绘制特定形状操作步骤:1. 点击工具箱中的“矩形”工具,在该工具按钮上按下鼠标左键不放,在弹出的菜单中选择需要的自动形状工具 2. 在画布上拖动鼠标绘制形状或在画布上单击鼠标左键以按形状的默认大小放置形状。 3. 将鼠标移至的“自动形状”上菱形的控制点,拖动控制点可以改变形状的某个特定变形属性。 提示:大多数“自动形状”控制点都带有工具提示,描述它们会如何影响自动形状。将指针移到一个控制点上可看到描述该控制点控制的属性的工具提示 练习 3-21)绘制矩形、正方形2)绘
9、制椭圆形、圆形3)绘制多边形4)绘制星形 5)绘制圆角矩形、箭头等特定形状。 3.4 绘制自动形状 使用 Fireworks 的“自动形状”面板可以绘制一些智能形状。 操作步骤:1. 选择窗口 自动形状,显示自动形状面板 2. 将一个自动形状图形从自动形状面板中拖到画布。 3. 拖动控制点来编辑自动形状。 练习 3-31) 绘制自动形状“时钟”2) 绘制自动形状“框”3.5 应用笔触 笔触又称为描边。在 Fireworks 中用户可根据需要选择与设置各种笔触。笔触可以应用到矢量路径、矢量图形或文本上。通过设置笔触属性,可以使下一个绘制的矢量对象具有新的笔触属性;也可以在绘制完对象或路径后对其应
10、用笔触属性。笔触设置选项设置笔触方法: 1. 在画布上选择一个矢量图形或在工具箱中点击矢量图形按钮; 2. 在属性面板上点击“笔触种类”框打开菜单选择需要的笔触类型 ; 3. 推动笔尖大小右边的滑块或直接输入数值设置笔触粗细; 4. 点击笔触颜色框,打开颜色样版(见右下方图),采用以下方法之一选择颜色: 用颜色吸管在颜色预览窗或屏幕上选择一种颜色 直接输入的网页色数值(例:#738EA7) 点击取消笔触按钮,取消笔触 点击自定义颜色按钮打开调色板设置自选颜色 5. 选择笔触应用到路径上的位置; 路径内是指将笔触填充在路径之内 居中于路径将笔触填充在路径之上 路径外将笔触填充在路径之外 6. 要
11、想改变笔触边缘的柔化效果,可以推动“笔触边缘”滑杆。向上推动可以增加路径边缘的柔化程度。 7. 点击笔触纹理框打开菜单可以选择需要的笔触纹理;向上推动滑杆可以增加笔触纹理的强度。 练习 3-41) 设置笔触的种类、笔尖大小2) 设置笔触颜色: 在颜色预览窗中选择一种颜色;打开调色板设置自选颜色。 3) 将笔触边缘柔化4) 对笔触设置纹理 5) 取消笔触3.6 应用填充 Fireworks 内置了种标准填充方式:单色填充、抖动填充(Web 仿色填充)、图案填充和渐变填充。可以改变填充的各种属性,包括颜色,边缘,纹理和透明度。一. 单色填充 单色填充是使用单一颜色对矢量路径、图形或文本进行填充。操
12、作步骤:1. 选择要填充的对象 2. 在填充面板的类别下拉列表中选择“实心” 3. 点击填充颜色框,打开颜色样版,采用以下方法之一选择颜色: 用颜色吸管在颜色预览窗或屏幕上选择一种颜色 点击自定义颜色按钮打开调色板设置自选的颜色 直接输入的网页色数值 4. 选择边缘种类:实边、消除锯齿或羽化(如设置羽化还要设定羽化的程度) 5. 若需要在填充上添加纹理,在纹理下拉列表中选择需要的纹理,并设定纹理强度 二. 抖动填充为了保证颜色在各种类型的浏览器上都能正确显示,Fireworks 提供了 Web 仿色填充,即混合两种 Web 可靠颜色来模拟一种非可靠的 Web 颜色。操作步骤:1. 选择要填充的
13、对象 2. 在填充面板的类别下拉列表 中选择“网页抖动” 3. 点击填充颜色框,打开颜色样版 4. 选择源颜色框,在颜色预览窗上选择一种颜色 5. 选择第一或第二仿色颜色框,在颜色预览窗上选择一种颜色 6. 如果要使用颜色透明,勾选“透明”选项练习 3-51) 设置填充为实心,用颜色吸管从屏幕上其他图形上吸取颜色2) 选择边缘种类:实边、消除锯齿、羽化3) 在填充上添加内置纹理与自设纹理4) 设置抖动填充,混合两种 Web 可靠颜色来模拟一种非可靠的 Web 颜色三. 渐变填充 渐变填充是使用两种或两种以上的颜色按照一定的组合规律来填充对象。设置渐变填充操作步骤:1. 选择要填充的对象 2.
14、在填充面板的类别中的“渐变填充”下拉列表中选择一种要使用渐变填充方案 3. 如果要编辑渐变色,单击“填充颜色”按钮 ,打开“编辑渐变”窗口 添加颜色样本:单击渐变色阶下面的区域 添加不透明样本:单击渐变色阶上方的区域 删除渐变中的颜色:将样本块从“编辑渐变“弹出窗口中拖走 设置或更改颜色样本的颜色:单击颜色样本,从弹出窗口中选择一种颜色 设置或更改不透明样本的透明度:拖动透明度百分比滑块,0 表示完全透明,100 表示完全不透明。 使用预置渐变色方案:打开预置下拉菜单选择 调整填充颜色之间的过渡:用鼠标将颜色样本块向左或向右拖动。 变形和扭曲填充 对渐变填充移动、旋转、倾斜和更改。操作方法:1
15、. 点击工具箱中的 ,选择具有图案填充或渐变填充的对象,该对象上或其附近会出现一组手柄。 2. 拖动这些手柄调整对象的填充。 在对象内移动填充:拖动圆形手柄,或使用“渐变“工具单击填充内的一个新位置 旋转填充:拖动连接手柄的直线 调整填充宽度和倾斜度:拖动一个方形手柄 练习 3-61) 设置填充为渐变填充,选择圆锥形,对渐变填充进行移动、倾斜并调整填充宽度。2) 设置填充为放射性渐变,添加或删除颜色样本。四. 图案填充 图案填充是使用图案位图重复拼接来填充对象。操作步骤:1. 选择要填充的对象 2. 在填充面板的类别下拉列表中选择“图案填充” 3. 在填充图案下拉列表中选择要使用的图案名称 4
16、. 如果要选择外部图案进行填充,从“图案名称“弹出菜单中选择“其它“,定位到要用作新图案的位图文件,然后单击“打开“。 新图案即按字母顺序添加到“图案名称“列表 练习 3-71) 设置填充为图案填充,从内置图案中选择一种图案2) 选择外部图案作为图案填充,调整填充图案的宽度与高度本章要点 绘制矢量路径 1)绘制直线 2)用钢笔工具绘制矢量路径3)用笔刷绘制自由矢量路径绘制矢量形状 使用形状工具绘制矩形、椭圆、多边形、星形以及其它特定的几何形状 绘制自动形状 打开 Fireworks 的“自动形状”面板可以绘制图框、时钟等智能形状 应用笔触 使用属性面板上的笔触选项可以设置矢量图形的笔触颜色、笔尖粗细、笔触种类、笔触边缘、笔触纹理应用填充1) 单色填充2) 抖动填充3) 图案填充4) 渐变填充.