第2章绘图及相关工具.ppt

《第2章绘图及相关工具.ppt》由会员分享，可在线阅读，更多相关《第2章绘图及相关工具.ppt（50页珍藏版）》请在三一文库上搜索。

1、1,第二章 绘图及相关工具,韩山师范学院潮州师范分院 沈珊 Email: 手机：13500100903 短号：6903,2,邮箱： 密码： 2010xs 注： Flash CS3安装软、所有Flash课件、练习将传送到以上邮箱，欢迎同学们下载学习。,3,运用FLASH工具箱提供的绘图工具可进行图像的绘制：,4,5,6,2.1工具箱和属性面板简介,2.1.1 工具箱简介：工具箱分为四个区域：,选择工具区,绘图工具区,填充工具区,查看颜色和选项区,7,工具箱的四个区域： （1）选择工具区：包括选择工具、部分选取工具、任意变形工具、渐变变形工具、套索工具。 （2）绘图工具区：主要包括一些基本图形绘

2、制工具，如钢笔工具、文本工具、线条工具、矩形工具、铅笔工具和刷子工具等。,8,（3）填充工具区：填充工具区中的工具主要用来填充矢量对象的颜色，包括墨水瓶工具、颜料桶工具、滴管工具和橡皮擦工具等。 （4）查看颜色和选项区：包括三种类型的属性按钮： 查看按钮：手形工具、放大镜（缩放工具） 颜色按钮：笔触颜色、填充颜色（黑白、没有颜色、交换颜色） 选项按钮：绘制对象、贴紧至对象,9,2.1.2 属性面板简介 “属性”面板可用于设置绘制图形的边框、填充和角度等各项参数。 例如：椭圆工具的“属性”面板，其中各主要选项的功能如下： 线（笔触颜色、高度、样式、端点和接合） 色块（填充颜色） 起始角度、结束角

3、度,10,2.1.3 绘图步骤 1、选中工具箱中的工具； 2、设定属性； 3、进行绘制。,11,小技巧： （1）可以先画出图形，再选取设定其大小和位置等属性。 （2）绘图辅助功能： 显示网格：“视图”菜单“网格”命令“显示网格” 贴紧网格：“视图”菜单“贴紧”命令“贴紧至网格”。该功能可使图形画得较规则，其端点总是相交于网格线的交点。,12,2.2 绘制基本图形,2.2.1 线条工具 线条工具主要用于绘制不同方向和长短的直线。 （1）画线时按住Shift键，可沿水平、垂直或45度方向画直线段。 （2）可通过属性面板设置线条的样式、粗细、颜色、端点和接合。,13,例：打开“1线条工具.fla”，

4、 （1）用线条工具画出3条线段组成一个三角形，采用红色、线宽为8的实线，线的端点为圆角。 （2）改变其接合分别为“尖角”、“圆角”、“斜角”，观察其变化状态。,尖角 圆角 斜角,14,（3）自定义线型：创建更加个性化的线条。 例：新建一个Flash文档，自定义线型，并绘制出一个“井”字，笔触颜色黑色。 线类型-点描；点大小-中；点变化-随机大小；密度-稀疏；粗细-4pts。,15,2.2.2 铅笔工具 铅笔工具：用于绘制不同形状的曲线或直线。 1、铅笔工具的三种绘图模式： （1）直线化：画规则线条，且线条会分段转换成直线、圆、椭圆和矩形等规则线条中最接近的线条。 （2）平滑：画平滑曲线，并将曲

5、线抖动部分忽略。 （3）墨水：徒手模式，绘制接近徒手画出的线条。 2、使用步骤： 选取“铅笔工具“设定铅笔模式设置线条样式拖动鼠标绘图。 3、小技巧：绘制过程中按Shift键，可绘出保持水平或垂直状态的线。,16,例：打开“2铅笔工具.fla”，分别用铅笔工具的三种绘图模式在对应位置上画出螺旋纹（线条样式任选）。,17,2.2.3 刷子工具 刷子工具：用于绘制不同形状的矢量色块。可以产生毛笔效果，给绘制的图形上色。 1. 刷子工具的5种工作模式： （1）标准绘画：普通绘画模式，直接在线条和填充区域上涂刷，后画的处于先画的前面； （2）颜料填充：填充区域绘画模式，在填充区域上和空白区域上涂刷，已

6、有线条不受影响； （3）后面绘画：底层绘画模式，刷子只能在空白区域涂刷，原有的图形不变； （4）颜料选择：选定区域模式，刷子只有在选择的矢量色块的填充区域内才适用；如果没有选择任何区域，刷子工具将不能在矢量图形上进行绘画。 （5）内部绘画：内部绘画模式，刷子只能在封闭的区域里填色并且起点必须在矢量图内部。,18,2.刷子的大小、形状、颜色 （1）刷子的大小：在工具箱的最下方“查看、颜色和选项区域” 点击“刷子的大小”按钮进行选择设置。 （2）刷子的形状：在工具箱的最下方“查看、颜色和选项区域” 点击“刷子的形状”按钮进行选择设置。 （3）刷子的颜色：在属性面板“填充颜色”按钮进行设置。,19,

7、3.锁定填充：此功能只对渐变填充或位图填充起作用。所产生的色彩看上去好象是先前锁定的色彩的延伸，使填充看起来好像扩展到整个舞台。 例：打开文件“3刷子工具.fla”，设置刷子的填充颜色为红色，分别用5种不同的工作模式在对应的区域中涂刷，并观察其效果。,20,2.2.4 椭圆工具和基本椭圆工具 1、使用方法：选择椭圆工具，拖动鼠标即可绘制椭圆。在拖动鼠标的同时若按住Shift键不放，可绘制正圆。 2、椭圆“属性面板”设置 （1）笔触：颜色、高度、样式、自定义选项； （2）填充颜色：单色填充、渐变填充； （3）起始角度、结束角度：设置扇形的起始； 和结束角度； （4）内径：设置扇形内角的半径； （

8、5）闭合路径：使绘制出的扇形为闭合扇形； （6）重置：恢复角度、半径的初始值。,21,3、基本椭圆工具：绘制后，可使用“选择工具”拖动椭圆上的节点，将其调整为多种形状的图形。 例：利用基本椭圆工具绘制一个扇形。,22,练习：用椭圆工具画圆。 用黑色、笔触高度为4的自定义线(类型-锯齿状；图案-随机点状；波高-强烈；波长-非常短；粗细为4)，紫色的填充色画一个正圆，直径180。 操作提示： （1）在“工具箱”中选择“椭圆工具”，在“属性面板”定义椭圆属性； （2）按住Shift键，拖动鼠标画出正圆，定义其“属性面板”上的“高”“宽”数值都为180。,23,2.2.5 矩形工具和基本矩形工具 1、

9、使用方法与椭圆工具基本相同：选择矩形工具，拖动鼠标即可绘制矩形。在拖动鼠标的同时若按住Shift键不放，可绘制正方形。 2、绘制圆角矩形：在“基本矩形”工具属性面板中设置矩形边角的半径。 3、矩形“属性面板”设置： （1）边角半径：可分别设置圆角矩形4个边缘的角度值，范围-100100； （2）边角半径数字越小，圆角弧度就越小； （3）默认值：直角，0弧度。,24,4、基本矩形工具：绘制后，可使用“选择工具”拖动矩形上的节点，将其进行调整。,25,例：用绿色、线宽为2的虚线，红色填充色画一个宽100，高150的矩形，其边角半径为30。,26,2.2.6 多角星形工具 1、多角星工具的属性面板比

10、椭圆、矩形工具的属性面板多了一个“选项”按钮。 2、多角星形选项：单击“选项”按钮打开“工具设置”对话框，在其中设置形状的样式、边数和顶点大小： （1）样式：多边形、星形； （2）边数：设置多边形或星形的顶点数； （3）星型顶点大小：设置星型顶点的大小。,27,例：用红色、笔触高度为4的虚线绘制一个空心八角星。 操作提示： （1）红色、笔触高度为4的虚线。 （2）空心八角星画法：填充色为空。 多角星选项：样式：星形；边数：8；星型顶点大小：0.5。,28,2.3 绘制路径,2.3.1 钢笔工具：通过绘制精确的路径来确定图形 1、使用方法 （1）绘制步骤：选取“钢笔工具”设置笔触及填充样式 单击

11、鼠标设定图形各个锚点的位置； （2）绘制直线：产生一个正方形的拐角锚点； （3）绘制曲线：产生一个圆形曲线锚点和手柄； （4）封闭整个区域（形成多边形）：最后再次单击第一个锚点，即可封闭路径； （5）退出钢笔工具的编辑：按键。,29,例：打开文件“4钢笔工具.fla”，用钢笔工具绘制如下所示图形：,30,例：打开文件“4钢笔工具画曲线.fla”，用钢笔工具绘制曲线，笔触高度、颜色自定，如下所示图形：,31,2、编辑锚点 （1）添加锚点工具：增加锚点，光标下方多一个“+” （2）删除锚点工具：删除锚点，光标下方多一个“-” （3）转换锚点工具：单击鼠标，曲变直；拖曳鼠 标，直变曲。 修改锚点的位

12、置：利用“工具箱”上的“部分选取 工具”。 例：通过编辑修改上例中图形的锚点来改变图形。,32,2.4 图形的笔触与填充,2.4.1 使用颜色 一、颜色的种类： 1、纯色：固定色； 2、渐变色：在两个或多个颜色之间实现颜色 上的过渡； 渐变色具有线性和放射状两种模式： （1）线性：沿直线方向的渐变； （2）放射状：以圆心为中心沿半径方向的渐 变。,33,例：绘制一个椭圆，没有边框线，填充颜色为放射状彩虹渐变。 操作提示： （1）在工具箱中选择“椭圆工具”； （2）设置边框线为空； （3）设置填充颜色为放射状彩虹渐变。,34,二、颜色的管理 1、设置渐变色：在“颜色” 面板中的“颜色” 选项卡中

13、进行设置： （1）渐变色由颜色指针决定； （2）添加颜色指针：在渐变颜色条上单击； （3）修改颜色指针颜色：单击颜色指针，选取合适颜色； （4）修改颜色指针位置：拖曳鼠标； （5）删除颜色指针：选中指针并将其拖出颜色预览条即可。,35,如果我们在电脑上调配的颜色很漂亮，如何将调配好的颜色作为样本添加在“颜色”面板上？,36,2、添加颜色样本 例：添加一种新线性渐变色样本，颜色为：黄-蓝-黄-粉红,并利用该颜色填充图形。 操作提示： （1）在“颜色”面板中的“颜色”选项卡中设置，“类型”为线性。添加、设置颜色指针，颜色为：黄-蓝-黄-粉红。 （2）将该渐变色添加到样本中：在“颜色”面板中的“颜色

14、”选项卡右上角有一个扩展按展，点击后在弹出的菜单中选择“添加样本”命令，则该渐变色添加到“样本”选项卡面板中。,37,2.4.2 墨水瓶工具 1、功能：为形状图形添加边框，也可改变边框的颜色、笔触高度、轮廓线及边框线条的样式。 2、使用方法：选中“墨水瓶工具”设定线的颜色和样式单击要修改的图形。 3、无论线条是否被选中，都可用墨水瓶进行修改；而对填充区域只有在未被选中时，才能使用墨水瓶来改变或增加其轮廓线。 例：打开“5墨水瓶工具.fla”，给场景中的蘑菇的各颜色区域添加黑色轮廓线，线型任选。,38,2.4.3 滴管工具 1、功能：拾取已存在的某种线条、填充样式或图形，并将其应用于下次绘图。

15、2、使用方法：选取“滴管工具”把光标移到需要取色的线条或图形中，单击鼠标即可。 3、注意：使用滴管工具吸取的图形不能是位图图像，必须先将位图打散为矢量图形才能进行颜色的吸取。 例：打开“6滴管工具.fla”，利用滴管工具将提供的样本填充到椭圆区域中。,39,2.4.4颜料桶工具（对某个区域进行填充） 1、功能：颜料桶工具将颜色、渐变、位图填充到封闭的区域中。 2、四种缺口封闭模式 （1）不封闭空隙：只填充封闭的区域，即没有空隙 时才能填充； （2）封闭小空隙：填充有较小缺口的区域； （3）封闭中等空隙：可以填充有一半缺口的区域； （4）封闭大空隙：可以填充有大缺口的区域。 3、三种填充模式：纯

16、色、渐变色、位图。 4、使用方法：选取“颜料桶工具”设置“缺口封闭模式”及填充模式单击闭合区域进行填充。,40,5、锁定填充：选择该选项后，再次填充上的色彩看上去好象是锁定前的色彩的延伸。 扩展知识：下图第一个OK给O字填充了渐变。 第二个OK，用滴管工具吸取O字上的渐变，颜料桶选项点选“锁定填充”。第三个OK，取消“锁定填充”。,41,例：打开“7颜料桶工具.fla”，利用颜料桶工具给人物填充颜色。 操作注意步骤： （1）这里的空隙（缺口）的大、中、小都是相对的，即使所谓的大缺口，实际上也是很小的。 （2）如果空隙太大，必须手动封闭它们。,42,6、位图填充：用某个位图来填充区域。 使用方法

17、： 导入位图选择“修改”/“分离”命令将位图打散用滴管工具汲取其属性单击需要填充的图形进行填充。,43,例：打开“8位图填充.fla”，导入图片“花.jpg”，并将其填充到一个椭圆区域中。 操作步骤： 1、导入图片； 2、选中导入的图像，进行打散（Ctrl+B）； 操作技巧：若图像太大，可在打散后将其 缩小； 3、选中滴管工具，在位图上单击鼠标； 4、单击椭圆区域进行填充。 5、可用“渐变变形工具”修改填充位图的位置、大小形状、旋转。,44,2.4.5 渐变变形工具：调整渐变色的效果 使用方法： （1）选中渐变变形工具； （2）单击渐变填充区域； （3）拖动控制点进行调整； 线性：渐变线（控制

18、点：中心、距离、方向）； 放射状：渐变圆（控制点：中心、长宽、大小、方向）。,45,例：打开“9渐变变形工具.fla”，完成操作。 操作提示： （1）利用渐变变形工具修改立方体的颜 色，使其具有立体感。 （2）渐变色为白-蓝线性渐变 （白 #FFFFFF，蓝#0121B4）,46,2.4.6 橡皮擦工具 ：擦除图形、填充区域、线。 1、五种擦除模式 （1）标准擦除：擦除经过的当前图层上的线和填充，但文字不受影响； （2）擦除颜色：只擦除填充区域，不影响线条； （3）擦除线条：只擦除线条，不影响填充区域； （4）擦除所选填充：只擦除当前选中选中的填充区域，无论线条是否被选中都不受影响； （5）内

19、部擦除：只擦除鼠标拖曳的起始点所在的填充区域，线条不会被擦除。 2、水龙头工具：可一次擦除边线和填充，在线或图形上单击即可直接将其擦除。 3、橡皮擦工具的形状：圆状、方状、从小到大的形状可供选择。,47,例：打开文件“10橡皮擦工具.fla”，分别用5种不同模式的橡皮擦在对应的区域中擦除，并观察其效果。,48,练习： 1、文档大小600*400，背景白色； 2、绘制如下图形 1个矩形，尺寸与舞台一样大，颜色为线性渐变，两渐变色块颜色RGB值分别为（0-153-255）和（0-51-153）； 操作提示：使用“渐变变形工具”调整夜幕颜色为上方深蓝色，下方浅蓝色。 在舞台上半部绘制多个黄色五角星 ，大小任意； 在舞台下半部绘制多个黑色矩形，构成楼群； 在矩形上绘制多个黄色正方形，构成建筑的窗口。,49,50,在邮箱中下载本节课课件及练习，将课件中所有例子全部操作一次。 将最后的练习“星空下的楼群”绘制完毕，以班级座号命名（.fla文件），提交到。 注： Flash CS3安装软件、课件、练习可从如下邮箱中下载： 邮箱： 密码：2010xs,