Flash8第3章图形的绘制与色彩填充.ppt

《Flash8第3章图形的绘制与色彩填充.ppt》由会员分享，可在线阅读，更多相关《Flash8第3章图形的绘制与色彩填充.ppt（90页珍藏版）》请在淘文阁 - 分享文档赚钱的网站上搜索。

1、第第3章章 图形的绘制与色彩填充图形的绘制与色彩填充3.1 图形的绘制图形的绘制 3.2 图形的色彩填充图形的色彩填充 3.3 绘制篮球绘制篮球 3.4 绘制蜻蜓绘制蜻蜓 过关练习过关练习 3.1 图形的绘制Flash 8拥有功能强大的绘图工具，包括铅笔工具、直线工具、椭圆工具、矩形工具、多角星形工具、钢笔工具和刷子工具，使用它们可以创作出完美的几何图形，下面介绍它们的使用方法。3.1.1 铅笔工具要绘制比较随意的线条，铅笔工具是最好的选择。1绘制线条选择工具箱中的铅笔工具，在舞台上单击鼠标并拖动，系统将根据鼠标移动的轨迹产生一条比较随意的曲线，如图所示。图3.1.1 绘制曲线如果在绘制的同时

2、，按住Shift键，将限制所绘线条为垂直或水平方向的直线，如图所示。图3.1.2 绘制垂直或水平直线2设置铅笔属性在使用铅笔工具绘制线条之前，可以通过“铅笔工具”属性面板设置线条的颜色、粗细、样式等属性，如图所示。（1）：设置线条的颜色。单击其右下角的黑色小三角，在弹出的颜色列表中选择即可，如图所示。图3.1.3 “铅笔工具”属性面板（2）：设置线条的粗细。在文本框中直接输入宽度值，或者单击右侧的按钮，在弹出的滑动条中拖动滑块即可，如图所示。图3.1.4 颜色列表 图3.1.5 拖动滑块设置线条的粗细（3）：设置线条的样式。单击它的任意部分，在弹出的“笔触样式”下拉列表中选择即可，如图所示。（

3、4）：自定义线条的样式。单击该按钮，将弹出“笔触样式”对话框（见图），在“类型”下拉列表中选择一种样式，然后设置参数即可。图3.1.6 “笔触样式”下拉列表 图3.1.7 “笔触样式”对话框（5）：设置线条端点的形状。单击其右下角的黑色小三角，在弹出的下拉菜单中选择即可，如图所示。（6）：设置是否启动笔触提示功能。（7）：设置线条在Flash Player中的笔触缩放方式。（8）：设置尖角在接合处的倾斜程度。（9）：设置线条的相接方式。单击其右下角的黑色小三角，在弹出的下拉菜单中选择即可，如图所示。（10）：设置线条在“平滑”模式下的平滑程度。图3.1.8 “端点”下拉菜单 图3.1.9 “接

4、合”下拉菜单3铅笔的绘画模式选择铅笔工具后，单击选项栏中的“铅笔模式”按钮，将弹出一个下拉菜单，其中选项分别对应铅笔的3种绘画模式，如图所示。图3.1.10 “铅笔模式”下拉菜单（1）伸直模式。该模式是系统默认模式，在该模式下，Flash 8会将接近于三角形、椭圆、圆形、矩形和正方形的图形变得更加接近于这些形状。如图所示为绘制接近矩形的图形时，释放鼠标前后的效果。图3.1.11 在“伸直”模式下绘图（2）平滑模式。在该模式下，Flash 8会自动将用户所绘制的线条进行微调，使其更加平滑，如图所示。图3.1.12 在“平滑”模式下绘图（3）墨水模式。在该模式下，绘制的线条将更加接近于鼠标运动的轨

5、迹，几乎不做任何变化，得到的图形类似徒手画，如图所示。图3.1.13 在“墨水”模式下绘图3.1.2 直线工具直线是Flash中最基本的形状，直线工具用于绘制各种不同方向的矢量直线。1绘制直线选择工具箱中的直线工具，在舞台上单击鼠标并拖动，可以绘制任意方向、长度、位置的直线，如图所示。图3.1.14 绘制任意直线如果在绘制的同时按住Shift键，将只能绘制倾斜角度为0，45，90，135等按45倍数变化的直线，如图所示。2设置直线属性在使用直线工具绘制直线之前，可以通过“直线工具”属性面板设置其属性，如图所示。图3.1.15 绘制倾斜角度为45倍数的直线由图可以看到，直线工具的参数与铅笔工具的

6、参数基本相同，由于它们的功能与设置方法也相同，这里就不再赘述。图3.1.16 “直线工具”属性面板 3.1.3 椭圆工具椭圆工具用于绘制各种椭圆，包括仅有轮廓的椭圆和内部有填充的椭圆。1绘制椭圆选择工具箱中的椭圆工具，在舞台上单击鼠标并拖动，当椭圆的大小和形状满足需要时释放鼠标即可，如图所示。图3.1.17 绘制椭圆如果在绘制之前还设置了椭圆的填充色，则可绘制出内部有填充的椭圆，如图所示；如果在绘制的同时按住Shift键，则可绘制出正圆形，如图所示。图3.1.18 绘制实心椭圆 图3.1.19 绘制正圆形2设置椭圆属性在使用椭圆工具绘制椭圆之前，可以通过“椭圆工具”属性面板设置椭圆轮廓的颜色和

7、粗细、椭圆内部的填充颜色等属性，如图所示。由图可以看到，椭圆工具的参数与直线工具的参数基本相同，只是多了一个“填充颜色”按钮，用户可以单击其黑色小三角，在弹出的颜色列表中选择椭圆的填充颜色。图3.1.20 “椭圆工具”属性面板 3.1.4 矩形工具矩形工具用于绘制矩形、正方形和圆角矩形，与椭圆一样，用户也可以设置矩形的笔触颜色和填充颜色。1绘制普通矩形选择工具箱中的矩形工具，在舞台上单击鼠标并拖动，在确定矩形的轮廓后释放鼠标即可，如图所示。图3.1.21 绘制矩形如果只需要矩形轮廓，不需要其中的填充区域，可以选中矩形的内部，按Delete键删除；如果需要绘制正方形，在绘制的同时按住Shift键

8、即可，如图所示。空心正方形 实心正方形图3.1.22 绘制正方形2绘制圆角矩形选择矩形工具之后，单击选项栏中的“边角半径设置”按钮，将弹出“矩形设置”对话框，如图所示。图3.1.23 “矩形设置”对话框在“边角半径”文本框中输入一个0999之间的数值，单击“确定”按钮关闭对话框后，在舞台上按住并拖动鼠标可以绘制圆角矩形。在允许范围内，边角半径的值越大，绘制出的圆角矩形就越接近于圆形，如图所示。值为10时 值为30时 值为50时图3.1.24 不同边角半径下的圆角矩形 3.1.5 多角星形工具多角星形工具用于绘制多边形和星形，它与矩形工具位于一个工具组中，在矩形工具上按住鼠标左键不放，在弹出的下

9、拉菜单中选择“多角星形工具”选项，即可选择多角星形工具。1绘制多边形选择工具箱中的多角星形工具，在舞台上单击鼠标并拖动即可。在默认情况下，使用多角星形工具绘制出的是正五边形，如图所示。如果要绘制六边形、七边形、八边形等多边形，可以执行以下操作：（1）单击属性面板中的“选项”按钮，弹出“工具设置”对话框，如图所示。图3.1.25 绘制正五边形（2）在“边数”文本框中输入要绘制多边形的边数。（3）单击“确定”按钮关闭对话框，然后在舞台中绘制即可。如图所示分别为六边形、七边形和八边形。图3.1.26 “工具设置”对话框六边形 七边形 八边形图3.1.27 绘制多边形2绘制星形如果在“工具设置”对话框

10、的“样式”下拉列表中选择了“星形”选项，则可绘制星形。在默认情况下，使用多角星形工具绘制出的星形是正五角星，如图所示。图3.1.28 绘制正五角星如果要绘制其他星形，可以执行以下操作：（1）在“工具设置”对话框的“样式”下拉列表中选择“星形”选项。（2）在“边数”文本框中输入要绘制星形的边数，这里输入15。（3）在“星形顶点大小”文本框中输入星形的夹角。（4）单击“确定”按钮关闭对话框，然后在舞台中绘制即可。如图所示为不同夹角效果。夹角为0.5 夹角为0.8图3.1.29 不同夹角下的15边星形夹角为0.13.1.6 钢笔工具钢笔工具是非常重要的绘图工具，使用它可以绘制直线、折线、闭合图形和曲

11、线等。1绘制直线绘制直线可以使用铅笔工具、直线工具，也可以使用钢笔工具，操作步骤如下：（1）选择工具箱中的钢笔工具，将鼠标指针移动到舞台上，在要作为直线的起始位置单击。（2）移动鼠标指针到直线的结束位置，再次单击即可，如图所示。图3.1.30 使用钢笔工具绘制直线2绘制折线选择钢笔工具后，在舞台上单击一次产生一个控制点，单击两次产生一条直线，单击三次、四次或多次则可产生一条折线，如图所示。图3.1.31 使用钢笔工具绘制折线3绘制闭合图形如图所示的折线没有闭合，如果要闭合，将鼠标指针移至起点上，当其呈现形状时，单击鼠标左键即可，如图所示。图3.1.32 绘制闭合图形4绘制曲线如果要绘制曲线，在

12、单击鼠标确定起点后（此时鼠标指针呈现形状），在其他位置按住并拖动鼠标，然后单击鼠标确定第2个点，如此重复操作即可，如图所示。图3.1.33 使用钢笔工具绘制曲线 3.1.7 刷子工具刷子工具与铅笔工具不同，铅笔工具绘制出的是矢量线，而刷子工具绘制出的是矢量色块。1使用刷子工具刷子工具的使用与铅笔工具的使用相同，选择工具箱中的刷子工具，在舞台上单击鼠标并拖动即可，如图所示。图3.1.34 使用刷子工具同样，如果在绘制的同时按住Shift键，将限制所绘线条的方向为水平或垂直，如图所示。图3.1.35 绘制水平或垂直直线2刷子的颜色和平滑度通过“刷子工具”属性面板，只能设置刷子的颜色和平滑度，如图所

13、示。（1）：设置刷子的颜色。单击其右下角的黑色小三角，在弹出的颜色列表中选择即可，如图所示。图3.1.36 “刷子工具”属性面板（2）：设置刷子的平滑度，取值范围为0100。在文本框中直接输入数值，或者单击右侧的按钮，在弹出的滑动条中拖动滑块即可，如图所示。图3.1.38 拖动滑块设置刷子的平滑度图3.1.37 颜色列表3刷子的大小和形状如果要设置刷子的大小和形状，需要用到选项栏中的“刷子形状”和“刷子大小”下拉列表（见图），如图所示为不同形状和大小的刷子效果。“刷子形状”下拉列表“刷子大小”下拉列表 图3.1.39 “刷子形状”和“刷子大小”下拉列表图3.1.40 不同形状和大小的刷子效果不

14、同形状的刷子效果 不同大小的刷子效果4刷子的绘画模式选择刷子工具后，单击选项栏中的“刷子模式”按钮，将弹出一个下拉菜单，其中选项分别对应刷子的5种绘画模式，如图所示。图3.1.41 “刷子模式”下拉菜单（1）标准绘画模式。在该模式下，刷子可以在舞台的任何位置绘图，并且刷子经过的地方将被刷子的颜色所覆盖。（2）颜料填充模式。在该模式下，刷子只能在空白区域和已有的填充区域绘图，不影响矢量线。（3）后面绘画模式。在该模式下，刷子只能在空白区域绘图，不影响原有图形。（4）颜料选择模式。在该模式下，刷子只能在选定的区域内绘图，其操作前提是先用选择工具创建一个选区，如图所示。（5）内部绘画模式。在该模式下

15、可分为两种情况：一种是当刷子的起点位于图形外的空白区域时，刷子只能在空白区域绘图，而不影响图形本身；另一种是当刷子的起点位于图形的内部时，则只能在图形的内部绘图，如图所示。图3.1.42 在颜料选择模式下绘图Flash中的图形由轮廓和填充区域两部分组成，和轮廓颜色相关的工具有墨水瓶工具等；和填充区域相关的工具有颜料桶工具、填充变形工具等。图3.1.43 在内部绘画模式下绘图3.2 图形的色彩填充 3.2.1 颜色的设置颜色在Flash中的应用比较频繁，熟练掌握可以实现各种各样的色彩变换，因此，在介绍色彩填充工具之前，首先来学习颜色的设置。1设置纯色Flash 8预制了多种纯色，用户可以通过如图

16、所示的颜色列表直接使用。但对于世界上的数百万种颜色来说，这只是其中很少的一部分，如果在列表中没有找到需要的颜色，可以单击列表右上角的按钮，在弹出的“颜色”对话框中自行设置，如图所示。图3.2.1 颜色列表图3.2.2 “颜色”对话框用鼠标在如图所示的颜色区内单击某种颜色，然后在如图所示的色调框中设置亮度，此时，所设颜色将在如图所示的颜色预览框中显示，如果满意，单击“添加到自定义颜色”按钮将其添加至“自定义颜色”区域中即可。图3.2.3 颜色区 图3.2.4 色调框 图3.2.5 颜色预览框当然，用户也可以在颜色预览框右侧的各文本框中直接输入数值设置颜色。（1）：是颜色最明显的特性，并以此命名颜

17、色，例如紫色、红色和黑色等。（2）：用于表示色调的深度，已饱和的颜色又深又浓，未饱和的颜色则比较淡。（3）：用于表示颜色的亮度，并确定它在黑白之间的相对颜色亮度比例。（4）：设置颜色中红色的浓度，取值范围为0255。（5）：设置颜色中绿色的浓度，取值范围为0255。（6）：设置颜色中蓝色的浓度，取值范围为0255。2设置线性渐变色线性渐变色的特点是颜色从起点到终点沿直线逐渐变化，选择“窗口”“混色器”命令，打开混色器面板（见图），在“类型”下拉列表中选择“线性”选项，混色器面板的外观发生改变，如图所示。（1）：设置渐变色的溢出模式，有扩展（默认模式）、镜像和重复3种模式。（2）：设置是否创建S

18、VG兼容的渐变色。图3.2.6 混色器面板 图3.2.7 选择“线性”选项（3）、和：设置当前颜色中红色、绿色和蓝色的浓度。（4）：设置当前颜色的透明度。（5）：即颜色选择器，用于直观地设置颜色。（6）：设置当前颜色的十六进制值。（7）：即渐变色编辑栏，用于设置渐变色的起点颜色和终点颜色。用户还可以在渐变色编辑栏上单击鼠标增加过渡色标，然后移动该色标的位置，调整它所对应颜色在渐变色中的位置，如图所示。图3.2.8 增加和移动色标（8）：即当前颜色样本，用于直观显示创建的渐变色。3设置放射状渐变色放射状渐变色的特点是颜色从起点到终点按照环形模式向四周逐渐变化，打开如图所示的混色器面板，在“类型”

19、下拉列表中选择“放射状”选项，混色器面板的外观发生改变，如图所示。图3.2.9 混色器面板图3.2.10 选择“放射状”选项由于放射状渐变色的设置方法与线性渐变色的完全相同，这里就不再赘述。4设置位图 在Flash 8中，除了可以使用纯色、线性渐变色、放射状渐变色填充图形之外，还可以使用位图填充。使用位图进行填充的前提是：必须有导入的位图，并且已经将其打散。在混色器面板的“类型”下拉列表中选择“位图”选项，即可显示所有打散的位图，如图所示。注意：打散即将位图图像分离成图形，具体方法将在后面的章节做详细介绍。（1）按钮：单击该按钮，弹出如图所示的“导入到库”对话框，用户可以在其中选择需要的位图。

20、（2）：位图选择区，用于直观地选择位图。图3.2.11 选择“位图”选项时的混色器面板 图3.2.12 “导入到库”对话框3.2.2 颜料桶工具颜料桶工具主要用于填充封闭图形的内部区域，也可用于填充不封闭区域，但此时需要通过空隙模式设置填充空隙的大小。1填充封闭区域选择工具箱中的颜料桶工具，按照以上介绍的方法设置需要的填充颜色之后，在封闭图形的内部区域单击鼠标即可，如图所示分别为使用纯色、线性渐变色、放射状渐变色和位图填充的效果。纯色填充 线性渐变色填充 放射状渐变色填充 位图填充图3.2.13 填充封闭区域2空隙模式选择颜料桶工具后，单击选项栏中的“空隙大小”按钮，将弹出一个下拉菜单，其中选

21、项分别对应颜料桶工具的4种空隙模式，如图所示。（1）不封闭空隙模式。在该模式下，当需要填充的区域存在空隙时，将不进行填充操作。图3.2.14 “空隙大小”下拉菜单（2）封闭小空隙模式。在该模式下，当需要填充的区域存在小空隙时，仍可进行填充操作。（3）封闭中等空隙模式。在该模式下，当需要填充的区域存在中等空隙时，仍可进行填充操作。（4）封闭大空隙模式。在该模式下，当需要填充的区域存在较大空隙时，仍可进行填充操作。3锁定填充选择颜料桶工具后，在选项栏中会出现一个“锁定填充”按钮，该按钮用于切换在使用渐变颜色进行填充时的参照点。当“锁定填充”按钮处于未选中状态时，是非锁定填充模式，则刷子经过的所有地

22、方都包含着一个完整的渐变过程，如图所示；当其处于选中状态时，是锁定填充模式，则刷子工具将以整个图形为一个完整的渐变过渡区域，如图所示。图3.2.15 在非锁定填充模式下绘制图形图3.2.16 在锁定填充模式下绘制图形 3.2.3 墨水瓶工具墨水瓶工具主要用于填充图形轮廓的颜色，也可用于更改轮廓的粗细、线型等，常与滴管工具配合使用。选择工具箱中的墨水瓶工具，其属性面板如图所示。由于墨水瓶工具的参数与直线工具的参数完全相同，它们的功能与设置方法也相同，这里就不再赘述。设置完成后，在图形轮廓上单击鼠标即可，如图所示分别为改变图形轮廓颜色、粗细和线型时的效果。图3.2.17 “墨水瓶工具”属性面板改变

23、粗细 改变线型图3.2.18 使用墨水瓶工具填充图形轮廓原图 改变颜色 3.2.4 滴管工具滴管工具用于拾取工作区中已经存在的颜色及样式属性，并将其应用于其他图形。滴管工具没有相应的属性面板，使用也非常简单，只需要在选择滴管工具后，将鼠标指针移动到需要拾取颜色或样式的图形上单击鼠标左键即可。注意：滴管工具在没有经过任何对象时，呈现为形状；当经过线条时，呈现为形状；当经过文本时，呈现为形状；当经过矢量或位图时，呈现为形状，如图所示。经过线条 经过文本 经过矢量图或位图图3.2.19 滴管工具的不同形状3.2.5 填充变形工具填充变形工具用于调整渐变色或填充位图的尺寸、角度及中心点。使用填充变形工

24、具时，被调整对象的周围会出现一些控制手柄，根据填充内容的不同，显示的手柄也将不同，如图所示。线性渐变色 放射状渐变色 位图图3.2.20 不同填充内容时的手柄状态1调整尺寸按住并拖动或形状的手柄，可以单独在水平或垂直方向上调整填充内容的尺寸（即非等比例调整），如图所示；按住并拖动形状的手柄，可以在水平和垂直方向上同时调整填充内容的尺寸（即等比例调整），如图所示。原图 在水平方向上调整 在垂直方向上调整图3.2.21 非等比例调整填充内容的尺寸图3.2.22 等比例调整填充内容的尺寸2调整角度按住并拖动形状的手柄，可以调整线性渐变色、放射状渐变色和位图的填充角度，如图所示为位图填充的角度调整效果

25、。图3.2.23 调整位图填充的角度3调整中心点按住并拖动或形状的手柄，可以移动线性渐变色、放射状渐变色和位图的填充中心点，改变它们的填充角度，如图所示为放射状渐变色填充角度的改变效果。图3.2.24 调整放射状渐变色的填充中心点另外，在调整位图的填充时，用户还可以按住并拖动或形状的手柄，对填充物进行扭曲，如图所示。图3.2.25 扭曲填充的位图 3.3 绘制篮球本例将绘制一个篮球。在制作过程中，将用到椭圆工具、颜料桶工具、选择工具和混色器面板，效果如图所示。图3.3.1 效果图操作步骤如下：（1）启动Flash 8软件。（2）按Ctrl+J键，弹出“文档属性”对话框，设置“尺寸”为“400

26、px300 px”，“背景颜色”为“#FFCC00”，单击“确定”按钮。（3）选择工具箱中的椭圆工具，在属性面板中设置笔触颜色为“黑色”，笔触高度为“1”。（4）在混色器面板的“类型”下拉列表中选择“放射状”选项，如图所示。（5）在颜色定义条中选中左侧的颜色滑块，双击鼠标左键，更改其颜色值为“#FFFFFF”，同样，更改右侧颜色滑块的颜色值为“#FF6600”。（6）移动右侧滑块到如图所示的位置，然后按住Shift键，在舞台中绘制一个圆形。（7）选择工具箱中的颜料桶工具，在所绘圆形的内部单击，调整渐变位置，如图所示。图3.3.2 混色器面板 图3.3.3 移动颜色滑块的位置（8）选择工具箱中的

27、椭圆工具，设置填充颜色为“无”，在如图所示的位置绘制一个空心椭圆。（9）选择工具箱中的选择工具，单击选中圆形以外的空心椭圆曲线（见图），然后按Delete键将其删除，如图所示。图3.3.4 调整渐变位置 图3.3.5 绘制空心椭圆图3.3.6 选中圆形外的曲线图3.3.7 删除圆形外的曲线（10）重复步骤（8）和步骤（9）的操作，另外绘制几条曲线，效果如图所示。3.4 绘制蜻蜓本例将绘制一只蜻蜓。在制作过程中，将用到椭圆工具、铅笔工具、颜料桶工具和钢笔工具，效果如图所示。图3.4.1 效果图操作步骤如下：（1）启动Flash 8软件。（2）按Ctrl+J键，弹出“文档属性”对话框，设置“尺寸”

28、为“350 px300 px”，“背景颜色”为“#白色”，单击“确定”按钮。（3）选择工具箱中的椭圆工具，在属性面板中设置笔触颜色为“无”，填充颜色为“#990000”，在舞台中绘制一个椭圆，作为蜻蜓的头，如图所示。（4）在如图所示的位置绘制另一个椭圆，作为蜻蜓的身体。图3.4.3 绘制蜻蜓的身体图3.4.2 绘制蜻蜓的头（5）选择工具箱中的铅笔工具，在属性面板中设置笔触颜色为“白色”，笔触高度为“0.25”，在蜻蜓的身体中绘制5条直线，将其分为6个部分，如图所示。（6）选择工具箱中的颜料桶工具，从左至右依次填充6个部分为“#990000”，“#CC3300”，“#FF3300”，“#FF66

29、00”，“#FF9900”和“#CC3300”，如图所示。图3.4.4 绘制直线 图3.4.5 填充身体（7）选择工具箱中的椭圆工具，在属性面板中设置笔触颜色为“无”，填充颜色为“黑色”，在舞台中绘制两个椭圆，作为蜻蜓的眼睛，如图所示。（8）选择工具箱中的钢笔工具，在属性面板中设置笔触颜色为“黑色”，在舞台中绘制翅膀的轮廓，如图所示。图3.4.6 绘制眼睛（9）选择工具箱中的颜料桶工具，设置填充颜色为“#FF9900”，填充图形，如图所示。（10）选中轮廓线，按Delete键删除，如图所示。图3.4.7 绘制翅膀的轮廓 图3.4.8 填充图形 图3.4.9 删除轮廓线（11）重复步骤（8）（1

30、0）的操作，绘制翅膀的另外一个部分，如图所示。（12）选中翅膀，按Ctrl+D键直接复制，如图所示。（13）选中所复制的翅膀，选择“修改”“变形”“垂直翻转”命令，将其垂直翻转，如图所示。图3.4.10 绘制翅膀的其他部分（14）选择工具箱中的选择工具，移动所复制的翅膀，效果如图所示。图3.4.11 复制翅膀 图3.4.12 垂直翻转翅膀过关练习填空题1_工具用于填充封闭图形的内部区域，也可用于_，但此时需要通过空隙模式设置填充空隙的大小。2_工具用于填充图形轮廓的颜色，也可以用于更改轮廓的_、_等，常与滴管工具配合使用。选择题1矩形工具用于绘制（）。（A）矩形 （B）正方形（C）圆角矩形 （D）菱形2在Flash 8中，用户可以使用（）填充图形。（A）纯色 （B）线性渐变色（C）放射状渐变色 （D）位图简答题1简述线性渐变色的特点。2简述放射状渐变色的特点。上机操作题1练习绘制一只小鸟。2练习绘制一条金鱼。