第2章绘图工具.ppt

第2章 绘图工具,高等教育出版社 高等教育电子音像出版社,第2章 绘图工具,2.1 认识绘图工具,认识工具面板中的基本绘图工具,2.1 认识绘图工具,认识工具面板中的基本绘图工具“选择工具”：用于选取操作对象。“部分选取工具”：用于显示绘制对象的路径或路径的锚点，并可对锚点进行选择、删除、移动和调节曲线弯曲率等操作。“任意变形工具”：转动和缩放对象。“套索工具”：利用“套索”可以在工作区选定一个不规则的区域。,2.1 认识绘图工具,认识工具面板中的基本绘图工具“钢笔工具”：绘制直线或平滑流畅的曲线（贝赛尔曲线）。“线条工具”：可以画出各种各样的线条。“铅笔工具”：可以画出线条、曲线及图形。“文本工具”：可以在工作区中输入文字。,2.1 认识绘图工具,认识工具面板中的基本绘图工具“椭圆工具”：可以画出椭圆或圆。“刷子工具”：和“铅笔工具”一样，不过笔触较大。“Deco 工具”：是Flash CS4新增加的功能，主要包括“蔓藤式填充”、“网格填充”和“对称刷子”3种绘制效果。,2.1 认识绘图工具,认识工具面板中的基本绘图工具“骨骼工具”：是Flash CS4新增加的功能，用于制作类似于图形链的刚性动画效果。“颜料桶工具”：修改各种填充色。“滴管工具”：修改颜料桶的填充色。“橡皮擦工具”：清除在工作区中画出的图形。,2.1 认识绘图工具,认识工具面板中的基本绘图工具“手形工具”：把工作区整体在屏幕上移动。“缩放工具”：把动画放大或缩小。“对象绘制工具”：用于选择绘制图形还是绘制对象。“贴紧至对象工具”：用于完成“吸附”功能。,2.2 绘制月亮,2.2.1 相关知识点椭圆工具基本椭圆工具多角星形工具笔触工具颜料桶工具对象绘制工具,2.2.2 案例解释案例解析要绘制弯弯的月亮，没有现成的绘图工具可以实现，但是在合并绘图模式下，当形状重叠时会自动进行合并和擦除，利用这个技巧，可以绘制出各种不同的形状。,2.2.2 案例解释,步骤：(1)运行Flash CS4，选择“文件”|“新建”命令，在“新建文件”对话框的“常规”选项卡中选择“Flash文档(ActionScript3.0)”选项，再单击“确定”按钮即可打开新文件。(2)在属性面板中，单击“编辑”按钮，将舞台大小设置为550400像素，通过“舞台”选项可以将舞台的颜色设置为蓝色（#000099）。,2.2.2 案例解释,步骤：(3)系统默认的绘图模式为合并绘图模式。选择“椭圆工具”，设置笔触颜色为空，填充颜色为白色。按住Shift键，在舞台上绘制出一个圆。,2.2.2 案例解释,步骤：(4)单击“选择工具”，按下Alt键，拖动舞台上的圆，复制一个圆形。(5)单击Delete键，删除后面的圆，月亮的矢量图绘制完毕。,2.2.3 技术点睛,1.选择对象在工具箱上单击“选择工具”按钮，在对象的外框上单击，即可选择对象的外边框；在对象的内部单击，即可选择内部形状；在对象上双击，即可选择整个对象；在对象外的空白舞台上单击，即可取消选择。在工具箱上单击“选择工具”按钮，在对象外按住鼠标左键，由上至下拉出一矩形区域框住要选择的对象，即可选中该对象。,2.2.3技术点睛,1.选择对象注意：如果要连续选择不同位置的曲线，只要按住Shift键不放，在要选择的曲线上单击鼠标左键即可。如果使用“选择工具”拖曳对象时，同时按下Ctrl或Alt键可以复制对象。“选择工具”还具有改变对象形状的功能。用箭头指向对象边框或对象角点时，鼠标箭头下面多了一个弧形，按住鼠标左键即可改变对象外形。,2.2.3 技术点睛,2.绘制的模式：合并绘制和对象绘制合并绘制：是Flash默认的绘制模式。在此模式下，绘图工具绘制出来的图形都是分离形状，这些形状重叠时会自动进行合并和擦除，如上述月亮的绘制。对象绘制：在对象绘制模式下，用绘图工具绘制出来的图形是独立的对象，这些对象在叠加时不会相互影响。,2.2.3 技术点睛,3.“基本椭圆工具”和“椭圆工具”用于绘制椭圆或圆形图案。在“椭圆选项”中，设置开始角度、结束角度、内径等属性，可以得到如图所示的效果：,2.2.3 功能讲解,3.“基本椭圆工具”和“椭圆工具”“基本椭圆工具”和“椭圆工具”的区别在于：如果选择“基本椭圆工具”，绘制椭圆形状后，还可以修改相关属性。如果选择“椭圆工具”，绘制椭圆形状前就必须设置相关属性。,2.3 绘制花朵,2.3.1 相关知识点“颜料桶工具”的使用“任意变形工具”的使用“渐变变形工具”的使用“线条工具”的使用“铅笔工具”的使用,2.3.2案例解析,步骤：(1)运行Flash CS4，新建一个像素为550400、背景为白色的舞台。(2)绘制花瓣选择“椭圆工具”，设置笔触颜色为空，填充颜色任意。按住鼠标不放，在舞台上绘制一个椭圆。,花朵通常包含了花瓣、花竿、叶子等部分，下面分步骤完成各部分的绘制。,2.3.2案例解析,步骤：(2)绘制花瓣单击“选择工具”按钮，选择该椭圆，通过“窗口”“颜色”命令，打开颜色面板，设置类型为“线性”，选择左色标为橙色（#ff3300），右色标为黄色(#ffff66)，得到线性渐变的填充效果。选择“渐变变形工具”按钮，通过旋转填充将图形填充调整为如图所示的形状。,2.3.2案例解析,步骤：(2)绘制花瓣选择“任意变形工具”按钮，将线性渐变的中心点调整到花瓣的下端位置。,2.3.2案例解析,步骤：(2)绘制花瓣单击“窗口”|“变形”选项，调出变形面板，设置旋转角度为30度，再单击“重置选区和变形”按钮多次，得出如图所示的花瓣。,2.3.2案例解析,步骤：(2)绘制花瓣单击“选择工具”按钮，将所有花瓣全部选中，再选择“任意变形工具”按钮，将其进行缩放，这样一个花瓣就画好了。(3)绘制花竿单击“铅笔工具”按钮，在选项卡中选择“平滑”选项，设置笔触颜色为绿色，笔触大小为2，画一条线段，作为花竿。用“选择工具”指向线段，当指针下方出现弧形时，可拖曳出弧线。,2.3.2案例解析,步骤：(4)绘制绿叶单击“椭圆工具”按钮，设置笔触颜色为绿色，填充颜色为绿色。按住鼠标不放，在舞台上绘制出一个椭圆。单击“选择工具”按钮，将鼠标移动到椭圆的右顶端，当鼠标后面跟了一个弧形时，将鼠标往外拉，拉的过程中同时按下Ctrl键，拉出来的角度比较尖锐。再单击“选择工具”按钮调整叶子的两侧。,2.3.2案例解析,步骤：(4)绘制绿叶单击“直线工具”按钮，选择一种较为浅一点的绿色，绘制叶子的脉络，通过单击“选择工具”按钮调整脉络的弧度，这样一片叶子就绘制好了。按住Alt键，拖动绿色，复制绿叶，然后单击“任意变形工具”按钮调整叶子的大小，最后将花朵与绿叶合成。,2.3.3 技术点睛,1.颜料桶工具“颜料桶工具”可以为封闭区间填充颜色。不封闭空隙：只有填充区域完全封闭时才能填充。封闭小空隙：当填充区域存在小缺口时可以填充。封闭中等空隙：当填充区域存在中等缺口时可以填充。封闭大空隙：当填充区域存在大缺口时可以填充。,2.3.3 技术点睛,2.渐变变形工具“渐变变形工具”是用来调整渐变颜色的渐变方向、对应色的填充位置和缩放渐变色色阶区域的长度的。渐变色的过渡方式有两种：线性和放射性。使用“渐变变形工具”时，。单击需要调整的填充区域，可以看到调整外框有一个圆形手柄和一个方形手柄、渐变色中间也有一个小圆形手柄。调整外框的圆形手柄用来调整渐变方向，方形手柄用来调整渐变量。用鼠标拖曳位于渐变色中间的小圆形手柄，可以移动渐变中心位置。,2.3.3 技术点睛,3.任意变形工具“任意变形工具”主要用于对图形进行缩放、旋转、倾斜、翻转和封套等操作，其对象既可以是矢量图，也可以是位图、文字等。,2.3.3 技术点睛,4.变形面板使用变形面板可以精确地对对象进行等比例缩放、旋转，还可以精确地控制对象倾斜度。功能同“任意变形工具”。除此之外，单击“变形”面板右下角的“重置选区和变形”按钮 可以起到复制矢量图的作用。,2.3.3 技术点睛,5.铅笔工具利用Flash CS4提供的“铅笔工具”，可以绘制出随意、变化灵活的线条或曲线。另外用户还可以对矢量线的宽度、线性、颜色进行调整。,2.3.3 技术点睛,6.线条工具“线条工具”是用来绘制直线的。选择“线条工具”，通过简单地拖曳鼠标即可沿鼠标拖动方向绘制直线。若按住Shift键并拖动鼠标，则可画出特殊角度的直线。在属性面板中可以设置直线的笔触颜色、笔触样式等属性。,2.3.4 举一反三,绘制树木,2.4 复杂形态的绘制,通过前面的案例已经介绍了图形创建工具的使用方法，利用“任意变形工具”可以把规则图形调整为自由形态。使用钢笔工具可以独立绘制精确的矢量线段和矢量图形，也可以编辑修改已创建的矢量对象。用钢笔工具非常适合绘制比较随意的图形。本案例通过汽车绘制，学习钢笔工具的使用方法。,2.4.1 要点导读,相关知识点钢笔工具认识锚点增加和减少锚点转换锚点工具,2.4.2 绘制汽车案例解释,步骤详解：(1)运行Flash CS4，新建像素为550400、颜色为白色的舞台。(2)单击“椭圆工具”按钮，笔触颜色为黑色，填充颜色为灰色（#949494），画出车的轮子。,2.4.2 绘制汽车案例解释,步骤详解：(3)在时间轴面板上，单击“新建图层”按钮，新建图层2，绘制汽车外形。(4)单击“钢笔工具”按钮，绘制三角图形，留意3个角上的锚点。,2.4.2 绘制汽车案例解释,步骤详解：(5)单击“钢笔工具”按键右下角的黑色小三角按钮，在弹出的选项菜单中选择“转换锚点工具”，拖动上方的锚点，绘制出图示的曲线效果。(6)调节右侧的调节柄，进一步美化汽车的外形。,2.4.2 绘制汽车案例解释,步骤详解：(7)单击“钢笔工具”按钮，在路径上单击，增加一个新的锚点，单击“转换锚点工具”按钮，通过调节柄继续调整汽车外形，如图所示。,2.4.2 绘制汽车案例解释,步骤详解：(8)单击“油漆桶工具”按钮，选择填充颜色（#EE1B41）为汽车填充颜色。(9)分别单击“椭圆工具”按钮、“直线工具”按钮以及“选择工具”按钮为汽车添加其他形状和线段，调整外形，并填入如图所示的颜色，完成小车的绘制。,2.4.3 绘制蝴蝶案例解析,步骤详解：单击“椭圆工具”按钮绘制椭圆。单击“选择工具”按钮变换椭圆。,2.4.3 绘制蝴蝶案例解析,步骤详解：单击“直线工具”按钮绘制多条直线，通过单击“选择工具”按钮将直线变为曲线。单击“颜料桶工具”按钮为蝴蝶填充喜欢的颜色。,2.4.3 绘制蝴蝶案例解析,步骤详解：单击“椭圆工具”按钮绘制椭圆，完成蝴蝶左上翅膀的绘制 新建图层，用同样的方法绘制蝴蝶左下翅膀，注意为了便于在后续课程中制作飞舞的蝴蝶，建议用不同的图层放置蝴蝶的不同部分。,2.4.3 绘制蝴蝶案例解析,步骤详解：新建图层，单击“椭圆工具”按钮绘制椭圆，单击“选择工具”按钮改变椭圆的形状，通过直线工具绘制身体横线，并通过单击“选择工具”按钮将直线变为弧线，在不同区域填充喜欢的颜色，完成蝴蝶身体的绘制。,2.4.3 绘制蝴蝶案例解析,步骤详解：新建图层，利用“椭圆工具”、“直线工具”、“指针工具”绘制蝴蝶的眼睛。,2.4.3 绘制蝴蝶案例解析,步骤详解：复制左侧蝴蝶翅膀，选择“修改”|“变形”|“水平翻转”命令，把右翅膀移动到合适的位置，完成蝴蝶的绘制。,2.4.4 绘制人物案例解析,步骤详解：选择“椭圆工具”绘制椭圆，填充脸部颜色（#ff1ebd）,利用“选择工具”变形椭圆为脸部形状。新建图层，利用“直线工具”绘制直线，然后利用“指针工具”将直线变形为曲线，以绘制头发轮廓。,2.4.4 绘制人物案例解析,步骤详解：利用“颜料桶工具”，为头发填充颜色，填入不同的颜色增加层次感。新建图层，分别单击“直线工具”、“椭圆工具”、“选择工具”按钮完成眉毛和眼睛的绘制。,2.4.4 绘制人物案例解析,步骤详解：新建图层，用“直线工具”、“椭圆工具”、“指针工具”完成鼻子和嘴巴的绘制。新建图层，用“直线工具”、“指针工具”、“颜料桶工具”完成身体部分的绘制。,2.4.4 绘制人物案例解析,步骤详解：新建图层，用“直线工具”、“指针工具”完成手臂的绘制。新建图层，用“直线工具”、“椭圆工具”完成脚的绘制。,2.4.5 技术点睛,1.用“钢笔工具”绘制直线使用“钢笔工具”可以绘制的最简单路径是直线，方法是通过单击钢笔工具创建两个锚点。继续单击可创建由转角点连接的直线段组成的路径。,2.4.5 技术点睛,2.用“钢笔工具”绘制曲线若要创建曲线，请在曲线改变方向的位置处添加锚点，并拖动构成曲线的方向线。方向线的长度和斜率决定了曲线的形状。,2.4.5 技术点睛,用“钢笔工具”绘制曲线步骤如下。(1)单击“钢笔工具”按钮。(2)将“钢笔工具”定位在曲线的起始点A，并按住鼠标左键。此时会出现第一个锚点，同时“钢笔工具”指针变为箭头。(3)单击B点，拖动并设置要创建曲线段的斜率，然后松开鼠标左键。一般而言，将方向线向计划绘制的下一个锚点延长约1/3距离。然后可以调整方向线的一端或两端。(4)单击C点，拖动并设置要创建曲线段的斜率，然后松开鼠标左键。,2.4.5 技术点睛,3.添加或删除锚点添加锚点可更好地控制路径，也可以扩展开放路径。但是，最好不要添加不必要的点。点越少，路径越容易编辑、显示和打印。若要降低路径的复杂性，请删除不必要的点。,2.4.5 技术点睛,默认情况下，当将钢笔工具定位在选定路径上时，它会变为添加锚点工具，或者当将“钢笔工具”定位在锚点上时，它会变为删除锚点的工具。若要添加锚点，可将指针定位到路径段上，然后单击。若要删除锚点，可将指针定位到锚点上，然后单击。提示：不要使用Delete、Backspac”，或者“编辑”|“剪切”或“编辑”|“清除”命令来删除锚点，这些键和命令会删除点以及与之相连的线段。,2.4.5 技术点睛,4.调整路径上的锚点在使用“钢笔工具”绘制曲线时，将创建平滑点（即连续的弯曲路径上的锚点）。在绘制直线段或连接到曲线段的直线时，将创建转角点（即在直线路径上或直线和曲线路径接合处的锚点）。默认情况下，选定的平滑点显示为空心圆圈，选定的转角点显示为空心正方形。若要将线条上的线段从直线段转换为曲线段，可将转角点转换为平滑点，也可以反过来操作。,2.4.5 技术点睛,动手做一做,2.4.5 技术点睛,5.调整线段若要更改线段的角度或长度，或者调整曲线段以更改曲线的斜率或方向，可调整直线段。移动平滑点上的切线手柄时，可以调整该点两边的曲线。移动转角点上的切线手柄时，只能调整该点的切线手柄所在那一边的曲线。,2.4.5 技术点睛,5.调整线段若要调整直线段，可单击“部分选取工具”按钮，然后选择直线段。使用部分选取工具可以将线段上的锚点拖动到新位置。若要调整曲线段，可单击“部分选取工具”按钮，然后拖动该线段。注：单击路径时，Flash将显示锚点。使用部分选取工具调整线段会给路径添加一些点。,2.4.5 技术点睛,5.调整线段若要调整曲线上的点或切线手柄，可单击“部分选取工具”按钮，然后选择曲线段上的锚点。若要调整锚点两边的曲线形状，请拖动该锚点，或者拖动切线手柄。若要将曲线限制为450的倍数，可按住Shift键并拖动。若要单独拖动每个切线手柄，可按住Alt键。,2.4.6 举一反三,绘制白云（详细步骤参看教材）动手实做：绘制如图所示的白云。最终效果见资源光盘的“本书范例第2章完成文件白云.fla”文件。,