第2章 绘图工具的应用 l lFlash绘图的基本知识 l l绘制和调整线条 l l绘制几何图形 l l“刷子工具”的使用 l l“文本工具”的使用 2.1 Flash绘图的基本知识 2.1.1 Flash中图形的类型 图形有位图和矢量图两种类型之分严格地说,位图被称为图像,矢量图被称为图形它们之间最大的区别就是位图放大到一定比例时会变得模糊,而矢量图则不会 位图是由许多色块组成的,每个色块就是一个像素,每个像素只显示一种颜色,是构成位图的最小单位位图可以逼真细腻地表现自然界的景物,主要用于保存各种照片、广告设计作品等制作Flash动画时,偶尔会使用位图作为素材 在Flash中绘制的图形属于矢量图形,它是Flash动画的最主要组成元素矢量图形记录的是图形的几何形状、线条粗细和色彩等从表现形式看,矢量图形由轮廓线和填充两部分组成,也可以只有轮廓线没有填充,或只有填充没有轮廓线 由填充和轮廓线组成 由轮廓线组成 由填充组成 2.1.2 Flash中的两种绘图模式 Flash 8.0提供了合并绘制模式和对象绘制模式两种绘图模式,下面分别介绍。
1.合并绘制模式 合并绘制模式是Flash默认的绘图模式,在该模式下绘制的图形是分散的,两个图形之间如果有交接,便会自动合并在一起,此时移动一个图形会改变另一个图形 在合并绘制模式下绘图 2.对象绘制模式 在对象绘制模式下绘制出的图形会自动组合成一个整体对象,这样两个图形叠加时互不影响,不会自动合并或改变图形形状 要在对象绘制模式下绘图,需要在选中绘图工具后,按下工具箱选项区的“对象绘制” 按钮;若要返回合并绘制模式只需再次单击“对象绘制” 按钮,使其弹起即可 对象绘制模式下绘制的图形 2.1.3 绘制图形的常见思路 在Flash中绘制图形的常见流程如下 l l想好所要绘制的图形形状,或者使用笔在纸上绘想好所要绘制的图形形状,或者使用笔在纸上绘制出图形的草图制出图形的草图l l使用使用“ “线条工具线条工具” ” 、、“ “铅笔工具铅笔工具” ” 、、“ “钢钢笔工具笔工具” ” 、、“ “椭圆工具椭圆工具” ” 、、“ “矩形工具矩形工具” ” 等绘制出图形的大致轮廓线。
等绘制出图形的大致轮廓线l l使用使用“ “选择工具选择工具” ” 或或“ “部分选取工具部分选取工具” ” 调整轮廓调整轮廓线形状l l在在“ “混色器混色器” ”面板中调制需要填充的颜色,使用面板中调制需要填充的颜色,使用“ “颜料桶工具颜料桶工具” ” 为图形的不同区域上色为图形的不同区域上色l l再次对图形的细微处进行调整再次对图形的细微处进行调整2.2绘制和调整线条 2.2.1 “线条工具”的使用——绘制钻石 1.新建一个Flash文档,在“属性”面板中将舞台背景颜色设为黑色 选择“贴紧至对象”按钮 2.单击工具箱中的“线条工具” (或按快捷键【N】)将其选中,并单击工具箱选项区中的“贴紧至对象” 按钮 设置“线条工具”属性 3.打开“属性”面板,将“笔触样式”设为“实线”,“笔触高度”设为“3”,“笔触颜色”设为淡青色(#00FFFF) 单击此按钮,可在打开的“笔触样式”对话框中更精确地设置线条属性 绘制水平线段 绘制钻石边线 4.将光标移动到舞台中,按住鼠标左键并向右横向拖动,松开鼠标后即可绘制一条水平线段 。
5.选择“视图”>“标尺”菜单项显示标尺,然后拖出一条水平辅助线和一条垂直辅助线,接着以横线的端点为起点,参照水平辅助线绘制两条斜线;再以斜线端点为起点,参照垂直辅助线绘制两条相交的斜线 绘制内部连线 6.使用“线条工具” 在水平辅助线下方绘制一条水平线段,然后在钻石边线和内部水平线段的端点之间绘制连线2.2.2 铅笔工具”的使用——绘制火焰 利用“铅笔工具” 可以模拟用铅笔在纸上绘画的效果,绘制出任意形状的线条和图形选择“铅笔工具”的绘图模式 1.新建一个Flash文档,在“属性”面板中将舞台背景颜色设为黑色 2.单击工具箱中的“铅笔工具” (或者按快捷键【Y】)将其选中,然后单击工具箱选项区中的模式按钮,从弹出的下拉列表中选择“平滑”模式设置“铅笔工具”的属性 3.在“属性”面板中,将“笔触颜色”设为红色(#FF0000),“笔触高度”设为“3”,“笔触样式”设为“实线” 绘制火焰 4.将光标移动到舞台中,然后按住鼠标左键并拖动,绘制一条曲线 5.继续使用“铅笔工具” 绘制其余的曲线“铅笔工具” 的3种绘图模式各有特点,在绘图时应根据不同的需要进行选择。
另外,在使用“铅笔工具” 绘图的同时按住【Shift】键,可绘制垂直或水平的线条 伸直 平滑 墨水 2.2.3 使用“选择工具”调整线条——制作翅膀 “选择工具” 是一个调整图形形状的“魔术师”,使用它可以方便地将图形调整为动画需要的任何形状,例如将直线调成曲线、改变曲线的弧度、改变线条节点位置等翅膀素材 1.打开素材文档 调整翅膀上方端点 2.单击工具箱中的“选择工具” (或按快捷键【V】)将其选中,然后将光标移动到左侧翅膀的上方端点,当光标呈 形状时,按住鼠标左键并向上拖动,松开鼠标后可改变线条端点的位置;利用相同的方法调整右侧翅膀的上方端点 调整线条弧度 制作第1根羽毛 3.将光标移动到左侧翅膀上边线的中间位置,当光标呈 形状时,按住鼠标左键并向内稍微拖动,松开鼠标后可调整线条弧度。
4.参照步骤3的操作调整左侧翅膀右边线的弧度 5.参照步骤3的操作调整左侧翅膀左上方斜线的弧度,制作出翅膀的第1根羽毛 调整翅膀的其他羽毛 6.参照步骤3的操作调整左侧翅膀左上方斜线的弧度,制作出翅膀的第1根羽毛 光标呈 形状后,在按住【Ctrl】键的同时拖动线条,可以在一段线条上添加一个节点使之成为两根连接着的线段,从而在调整线段弧度时制造出更多的变化此外,在使用其他工具编辑图形时,按住【Ctrl】键,可快速切换到“选择工具” 通过拖出节点改变图形形状 2.2.4 “钢笔工具”和“部分选取工具”的使用——绘制桃心 使用“钢笔工具” 可以绘制直线线段和曲线,并且可以精确调整曲线的曲率;使用“部分选取工具” 可以调整曲线的形状钢笔工具” 和“部分选取工具” 配合使用,可以绘制出任何形状的图形设置笔触颜色、填充颜色 1.新建一个Flash文档, 选择“钢笔工具” ,然后 将“笔触颜色” 设为深红色(#990000);将“填充颜色” 设为红色(#CC0000)设置笔触高度和笔触样式 2.在“属性”面板中,将“笔触高度”设为“3”,“笔触样式”设为“实线” 。
创建第1个锚点 创建第2个锚点 创建第3个锚点 3.将光标移动到舞台上,单击创建一个直线锚点 4.将光标移动到第1个锚点左上方,然后按住鼠标左键并向右上方拖动,创建一个曲线锚点,此时第1、2个锚点之间会出现一条曲线路径 5.将光标移动到第2个锚点的右侧,然后单击创建一个直线锚点,由于第2个锚点是曲线描点,所以第2、3个锚点之间会出现一条曲线路径 创建第4个锚点 创建封闭路径 6.将光标移动到第3个锚点的右侧,然后按住鼠标左键并向右下方拖动,创建一个曲线锚点 7.将光标移动到第1个锚点上,当光标呈 形状时单击,即可创建一个封闭路径,此时系统会以设置好的填充颜色填充封闭路径从以上操作可以看出,两个曲线锚点之间,或直线锚点与曲线锚点之间会生成曲线路径另外,两个直线锚点之间将生成直线路径 绘制直线路径 钢笔工具光标形状的含义 使用“钢笔工具” 绘制路径时,鼠标光标会随着所处位置的不同而发生变化,不同的光标样式代表着不同的含义。
将光标移至路径上,当光标呈 形状时单击,可增加一个锚点将光标移至曲线锚点上,当光标呈 形状时单击,可将曲线锚点转换为直线锚点,若在直线锚点上按住鼠标左键并拖动,可将直线锚点转换为曲线锚点将光标移至锚点处,光标呈 形状时,单击可删除该锚点 移动锚点 8.使用“部分选取工具” 选中桃心,然后将光标移动到下方锚点上,按住鼠标左键不放并向右拖动 调整曲线路径弧度 9.单击右上方的曲线锚点会出现曲线调节杆,通过拖动曲线调节杆可以调整曲线路径的弧度 10.调整完毕后,选择除“钢笔工具” 和“部分选取工具” 以外的任意工具,即可将路径转换为线条2.3 绘制几何图形 2.3.1 “矩形工具”的使用——绘制窗户 使用“矩形工具” 可以绘制出矩形、正方形和圆角矩形 设置“矩形工具”属性 1.新建Flash文档,并选择“矩形工具” ,在“属性”面板中,将“笔触颜色”设为黑色,“填充颜色”设为棕色(#993300),“笔触样式”设为“实线”,“笔触高度”设为“1” 绘制矩形 2.将光标移动到舞台中,然后按住鼠标左键不放并拖动,松开鼠标后即可绘制出一个矩形 。
调整边线弧度 拖出辅助线 3.选择“选择工具” ,将光标移动到矩形上方边线处,并调整其弧度4.选择“视图”>“标尺”菜单项显示标尺,然后从左侧标尺处拖出两条垂直辅助线 绘制青色矩形 绘制中间矩形 5.选择“矩形工具” ,将“填充颜色”设为淡青色(#00FFFF),然后根据辅助线的位置在棕色矩形内部绘制三个矩形,作为窗户的玻璃6.将“填充颜色”设为棕色(#993300),然后在三个青色矩形的中间位置绘制矩形 删除线段 绘制垂直线段 7.选择“选择工具” ,单击中间矩形的上下边线将其选中,然后按【Delete】键删除8.选中“线条工具” ,在窗户的中间位置绘制一条垂直线段在使用“矩形工具” 绘图的同时按住【Shift】键,可绘制正方形。
选择“矩形工具” 后,在工具箱选项区单击“边角半径设置” 按钮,可在打开的对话框中设置矩形边角半径,绘制圆角矩形 绘制圆角矩形 2.3.2 “椭圆工具”的使用——绘制小青蛙 利用“椭圆工具” 可以绘制出正圆和椭圆设置“椭圆工具”的属性 1.新建一个Flash文档,选择“椭圆工具” ,然后在“属性”面板中,将“笔触颜色”设为黑色,“填充颜色”设为绿色(#009900),“笔触样式”设为“实线”,“笔触高度”设为“1” 绘制椭圆 绘制小青蛙的眼睛 2.将光标移动到舞台中,按住鼠标左键不放并拖动,松开鼠标后即可绘制一个椭圆 3.将“填充颜色”设为白色,然后在绿色椭圆左上方按住【Shift】键并拖动,绘制一个正圆,作为小青蛙的左眼,以同样的方法在绿色椭圆右上方绘制一个大小相同的正圆,作为小青蛙的右眼 绘制眼珠 绘制鼻孔 4.将“填充颜色”设为黑色,然后在按住【Shift】键的同时在左眼的右下方绘制一个较小正圆,作为左眼眼珠,再在右眼的左下方绘制一个较小正圆,作为右眼眼珠 。
5.在绿色椭圆中间位置绘制两个并列的椭圆,作为小青蛙的鼻孔 绘制小青蛙的嘴6.使用“线条工具” 在绿色椭圆偏下位置绘制一条水平线段,然后使用“选择工具”调整线段的弧度,作为小青蛙的嘴 若想绘制没有填充色的矩形或椭圆形,只需将“矩形工具” 或“椭圆工具” 的“填充颜色”设为“空” 即可将填充色设为“空” 2.3.3 “多角星形工具”的使用——绘制流星 使用“多角星形工具” 可以绘制多边形和星形选择“多角星形工具” 1.新建一个Flash文档,在工具箱中的“矩形工具”上按住鼠标左键不放,在展开的列表中选择“多角星形工具”设置“多角星形工具”属性 “工具设置”对话框2.在“属性”面板中,将“笔触颜色”设为橙黄色(#FF9900),“填充颜色”设为“空” ,“笔触样式”设为“实线”,“笔触高度”设为“3”3.单击“属性”面板中的“选项”按钮 ,在打开的“工具设置”对话框中将“样式”设为“星形”,其他选项保持不变绘制五角星 绘制线段 4.将光标移动到舞台中,然后按住鼠标左键不放并拖动,绘制一个五角星 。
5.选择“线条工具” ,以五角星的右侧边线为起点绘制两条斜线,再在两条斜线间绘制一条连线 调整线段弧度并删除多余线段 6.使用“选择工具” 调整两条斜线和连线的弧度,然后选中斜线间五角星的边线,按【Delete】键将其删除2.4 “刷子工具”的使用——为房顶添加积雪效果 利用“刷子工具” 可以绘制任意形状、大小及颜色的填充区域舞台中的小房子 1.打开素材文档 “刷子工具”的“属性”面板 选择刷子大小和形状 2.选择“刷子工具” ,然后在“属性”面板中,将“填充颜色”设为白色 3.在工具箱“选项”区选择刷子大小以及形状 选择涂色模式 4.单击工具箱“选项”区的“刷子模式” 按钮,可在展开的下拉列表中选择涂色模式,本例选择“颜料选择”模式选择该模式,“刷子工具”绘制的图形将覆盖原图的线条和填充色 选择该模式,“刷子工具”绘制的图形只覆盖原图填充色,不覆盖线条 选择该模式,“刷子工具”绘制的图形只是从原图穿过,不会在原图上绘画 选择该模式,“刷子工具”绘制的图形只覆盖原图被选取部分,对没被选取的区域,没有任何影响 选择该模式,“刷子工具”只能在起始笔触所在的填充区中涂色,但不影响线条 不同的涂色模式其作用也不相同,在使用“刷子工具” 绘图的过程中,应根据实际需要进行选择 标准绘画 颜料填充 后面绘画 颜料选择 内部绘画 为屋顶添加积雪效果 5.使用“选择工具” 单击选中屋顶的填充色,然后选择“刷子工具” ,在屋顶上按住鼠标左键并拖动,绘制积雪效果。
2.5 “文本工具”的使用 2.5.1 文本的类型 可在Flash中输入的文本有静态文本、动态文本和输入文本3种类型,它们的作用各不相同 l l静态文本:静态文本:静态文本:静态文本:在创作文档时确定文本内容和外观,最终出现在创作文档时确定文本内容和外观,最终出现在动画中的文本与在制作动画时设置的样式没有任何变化在动画中的文本与在制作动画时设置的样式没有任何变化l l动态文本:动态文本:动态文本:动态文本:在动画播放时可以动态更新的文本,如股票报在动画播放时可以动态更新的文本,如股票报价等l l输入文本:输入文本:输入文本:输入文本:在动画播放时让用户输入的文本,如表单或调在动画播放时让用户输入的文本,如表单或调查表等动态文本和输入文本通常都需要结合查表等动态文本和输入文本通常都需要结合FlashFlash脚本脚本使用 2.5.2 创建文本 输入文本 利用“文本工具” 输入文字并创建文本的方法有以下两种单击工具箱中的“文本工具” ,然后将光标移动到舞台中要输入文字的位置并单击,即可输入文字,输入完毕后,选择工具箱中的其他工具,输入的文字会变为一个整体,我们称其为文本。
输入固定宽度的文本 如果要输入固定宽度的文本,可选中“文本工具” ,在舞台中按住鼠标左键并拖动,拖出一个文本框(用来确定文本的宽度),然后可在文本框中输入文字在该方式下,输入的文字达到文本框边缘时会自动换行2.5.3 设置文字样式 输入文字时,经常需要设置文字的大小、颜色和字体等样式,以使其符合动画的要求我们既可以在选择“文本工具” 后,先设置文字样式,然后再输入文字;也可以输入文字后,再设置它的样式,这两种方式的最终效果是一样的选中文本 1.输入一段文字,使用“选择工具” 单击文本将其选中,被选中的文本周围会出现一个蓝色的方框设置文本字体 2.在“属性”面板中,单击“字体”下拉按钮,在弹出的列表中可以为文字选择一种字体,如选择“隶书” 设置文本大小 3.在“字体大小”编辑框中输入数字(或单击其右侧的三角按钮 ,在弹出的调节杆中拖动滑块),可改变字体大小设置文本颜色 4.单击“文本(填充)颜色”按钮 ,可在弹出的“拾色器”对话框中选择文本的颜色,例如选择蓝色(#0000CC) 选中个别文字 改变字体样式 5.如果要对个别文字进行设置,可选择“选择工具” ,然后双击文本进入文本编辑模式。
在编辑模式下,按住鼠标左键并拖动,可选中拖动轨迹中的文字,被选中的文字以白字黑底显示6.将“字体大小”设置为“25”,再单击“切换粗体”按钮 加粗字体,单击“切换斜体”按钮 倾斜字体要退出文本编辑模式,只需使用“选择工具” 在舞台其他位置单击即可 设置文字对齐方式 设置文本格式 7.单击 这几个按钮可设置文字对齐方式,分别为左对齐、居中对齐、右对齐和两端对齐,例如将光标定位在“消逝”两字的所在行,然后单击“居中对齐”按钮 将这两字居中对齐8.单击“编辑格式选项”按钮 ,可在打开的“格式选项”对话框中设置文本格式,例如进入文本编辑状态后,将光标放在第二行,打开“格式选项”对话框,将“缩进”选项设为“50px” 改变文字间距 9.在“字母间距” 编辑框中输入数字可改变文字间距,比如单独选中“消逝”两字,再将“字母间距”设为“30” 选择文本的排列方式 10. 单击“改变文本方向”按钮 ,可在弹出的下拉列表框中选择文本的排列方式,例如选中整个文本后,选择“垂直,从左向右” 设置文字上下标 11.单击“字符位置”选项 右侧的下拉按钮 ,可在弹出的下拉列表中设置所选文字的样式,分别为“正常”、“上标”和“下标”。
上标 下标 选择文字表现方式 链接文字 12.单击“字体呈现方法”右侧的下拉按钮 ,可在弹出的下拉列表中设置文字在动画中的表现方式,通常选择“动画消除锯齿”或“可读性消除锯齿”选项13.选中文本后,在“URL 链接” 编辑框中输入网址,可以将文字链接到相应网站2.5.4 美化文字 1.安装外部字体 要制作漂亮的文字效果,最基本的是要有相应的字体支持当系统自带的字体无法满足要求时,我们可以安装外部字体目前比较常用的字体库有:方正字库、长城字库、文鼎字库和汉仪字库等,用户可从网上下载这些字库或购买字库光盘 汉仪咪咪体简 方正黄草简体 2.为文字添加滤镜特效 利用“滤镜”面板可以为文字添加滤镜特效,从而制作出各种特殊效果的文字 选中文本和打开“滤镜”面板 选择“斜角”滤镜 1.使用“选择工具” 单击选中要添加特效的文本,然后打开“滤镜”面板。
2.单击“滤镜”面板中的“添加滤镜”按钮 ,从弹出的列表中选择一种滤镜,本例选择“斜角”滤镜 设置“斜角”滤镜的参数 添加了滤镜特效后的文本效果 3.选中滤镜后,可以在“滤镜”面板中对该滤镜的参数进行设置 4.添加了“斜角”滤镜后的文本效果 3.分离和变形文字 在Flash中输入的文本是一个整体,不方便对单个文字进行编辑,也无法使用“选择工具” 等调整文字形状 分离并调整文本形状 通过按【Ctrl+B】组合键,可以将选中的文字分离成单个文字,此时可单独移动每个文字的位置 再按一次【Ctrl+B】组合键,可以将单个文字分离成矢量图形,这样便可以使用“选择工具” 调整文字形状了综合实例1——绘制打鱼小船 打鱼小船 首先利用“铅笔工具” 绘制海浪,然后利用“线条工具” 和“选择工具” 绘制小船的船身、船帆和海鸥,最后使用“铅笔工具” 绘制云彩综合实例2——小兔玩具 小兔玩具 首先使用“椭圆工具” 绘制小兔头部和身体轮廓,并使用“选择工具” 进行调整,然后使用“线条工具” 绘制小兔身上的线脚,使用“矩形工具” 绘制小兔前面的玩具箱,最后使用“多角星形工具” 和“钢笔工具” 绘制流星,并利用“文本工具” 输入文字。