计算机flashcs4第2章的.ppt

第2章 绘图工具,第2章 绘图工具,2.1 认识绘图工具,认识“工具”面板中的基本绘图工具,2.1 认识绘图工具,认识“工具”面板中的基本绘图工具 “选择工具”：用于选取操作对象或局部变换形状。 “部分选取工具”：用于显示绘制对象的路径或路径的锚点，并可对锚点进行选择、删除、移动，和调节曲线弯曲率等操作。 “任意变形工具”：转动和缩放对象。 “套索工具”：可以在工作区选定一个不规则的像素区域。,2.1 认识绘图工具,认识“工具”面板中的基本绘图工具 “钢笔工具”：绘制直线或平滑流畅的曲线（贝赛尔曲线）。 “线条工具”：可以画出各种各样的线条。 “铅笔工具”：可以画出线条、曲线及各样的图形。 “文本工具”：使用“文本工具”可以在工作区中输入文字。,2.1 认识绘图工具,认识“工具”面板中的基本绘图工具 “椭圆工具”：可以画出椭圆或圆。 “矩形工具”：可以画出矩形或正方形。 “刷子工具”：和铅笔工具一样，不过笔触较大。 “Deco 工具”：是Flash CS4新增加的功能，主要包括“蔓藤式填充”、“网格填充”和“对称刷子”3种绘制效果。,2.1 认识绘图工具,认识“工具”面板中的基本绘图工具 “骨骼工具”：是Flash CS4新增加的功能，用于制作类似于图形链的刚性动画效果。 “墨水瓶工具”：修改由画图工具画出的图形的线的属性。 “颜料桶工具”：修改各种填充色。 “滴管工具”：修改颜料桶的填充色。 “橡皮擦工具”：清除在工作区中画出的图形。文字必须先用Ctrl+B将其打散。,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或Ctrl键，拖动舞台上的圆，复制一个圆形。 (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.2.3 功能讲解,4.补充之“矩形工具” 利用矩形工具可绘制出如下形状： 基本矩形工具与矩形工具的区别同于基本椭圆工具与椭圆工具的区别,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技术点睛,制作如下效果的动画：,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)选择“钢笔工具” ，绘制三角图形，留意三个角上的锚点。,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 技术点睛,2、用钢笔工具绘制曲线 (1)选择“钢笔”工具。 (2)将钢笔工具定位在曲线的起始点A，并按住鼠标按键。此时会出现第一个锚点，同时钢笔工具指针变为箭头。 (3)单击B点，并拖动设置要创建曲线段的斜率，然后松开鼠标按键。一般而言，将方向线向计划绘制的下一个锚点延长约三分之一距离。之后可以调整方向线的一端或两端。 (4)单击C点，并拖动设置要创建曲线段的斜率，然后松开鼠标按键。,2.4.5 技术点睛,3、添加或删除锚点 添加锚点可更好地控制路径，也可以扩展开放路径。但是，最好不要添加不必要的点。点越少的路径越容易编辑、显示和打印。若要降低路径的复杂性，请删除不必要的点。,2.4.5 技术点睛,3、添加或删除锚点 默认情况下，当将钢笔工具定位在选定路径上时，它会变为添加锚点工具，或者当您将钢笔工具定位在锚点上时，它会变为删除锚点工具。 若要添加锚点，请将指针定位到路径段上，然后单击。若要删除锚点，请将指针定位到锚点上，然后单击。 提示：不要使用“Delete”、“Backspace”，或者“编辑”“剪切”或“编辑”“清除”命令来删除锚点；这些键和命令会删除点以及与之相连的线段。,2.4.5 技术点睛,4、调整路径上的锚点 在使用钢笔工具绘制曲线时，将创建平滑点（即连续的弯曲路径上的锚点）。在绘制直线段或连接到曲线段的直线时，将创建转角点（即在直线路径上或直线和曲线路径接合处的锚点）。 默认情况下，选定的平滑点显示为空心圆圈，选定的转角点显示为空心正方形。 若要将线条上的线段从直线段转换为曲线段，请将转角点转换为平滑点。也可以反过来操作。,2.4.5 技术点睛,4、调整路径上的锚点 动手做一做,2.4.5 技术点睛,5、调整线段 若要更改线段的角度或长度，或者调整曲线段以更改曲线的斜率或方向，请调整直线段。 移动平滑点上的切线手柄时，可以调整该点两边的曲线。移动转角点上的切线手柄时，只能调整该点的切线手柄所在的那一边的曲线。,2.4.5 技术点睛,5、调整线段 若要调整直线段，请选择“部分选取”工具 ，然后选择直线段。使用部分选取工具可以将线段上的锚点拖动到新位置。 若要调整曲线段，请选择“部分选取”工具，然后拖动该线段。 注：单击路径时，Flash将显示锚点。使用部分选取工具调整线段会给路径添加一些点。,2.4.5 技术点睛,5、调整线段 若要调整曲线上的点或切线手柄，请选择“部分选取”工具，然后选择曲线段上的锚点。 若要调整锚点两边的曲线形状，请拖动该锚点，或者拖动切线手柄。若要将曲线限制为倾斜45度的倍数，请按住Shift并拖动。若要单独拖动每个切线手柄，请按住Alt。,2.4.6 举一反三,绘制白云（详细步骤参看课本） 动手实做：绘制如图所示的白云。最终效果见资源光盘的“本书范例第2章完成文件白云.fla”。,