1、第二章 绘制和导入动画元素 关于位图和矢量图 绘制动画元素 导入动画元素 应用举例绘制狮子 本章小结 习题二 在计算机中,图形的显示方式主要有位图和矢量图两种,像Flash,Freehand,CorelDRAW,Illustrator和AutoCAD等软件,主要采用的是矢量图方式;像Photoshop,Studio和3DS MAX等软件,主要采用的是位图格式。目前,越来越多的应用软件既能处理位图,又能处理矢量图,并把它们加以集成。下面分别对这两种图形格式进行简单的介绍。第一节 关于位图和矢量图 一、位图 在位图中,一幅图像被划分为许多栅格,栅格中的每一点代表图像的像素,其值代表像素的亮度和色彩
2、值,因此位图又称做点阵图。位图图像比较细腻,色彩的变化比较丰富,当把位图放大到一定程度时,会出现失真现象,即马赛克现象,如图2.1.1所示。图2.1.1 位图放大效果 在保存位图时,需要记录每一个像素的位置和色彩数据,显然,栅格的排列越紧密,对应的图像分辨率就越高,图像的质量也就越好,当然所生成的文件也就越大,处理速度也就越慢。二、矢量图 矢量图由一系列的点、线、面组成,当对它放大时,不会出现失真现象,如图2.1.2所示。用矢量图绘制出的图形不是很逼真,无法像位图一样精确地描写自然界的景象,因此,不宜制作色调丰富或色彩变化太多的图像。图2.1.2 矢量图放大效果 三、将位图转换为矢量图 在Fl
3、ash中,可以将没有被分离的位图转换为矢量图,操作步骤如下:(1)选中要转换为矢量图的位图。(2)选择“修改”“位图”“转换位图为矢量图”命令,弹出“转换位图为矢量图”对话框(见图2.1.3),下面对其中各转换参数进行介绍。图2.1.3 “转换位图为矢量图”对话框 1)颜色阀值:设置区分颜色的阈值,其范围为1500之间的整数。如果两个像素的RGB颜色值之间的差值小于阈值,这两个像素将被转换为同一种颜色。因此,阈值越小,颜色转换越多,与源图像的差别也就越小。2)最小区域:设置转换时最小区域的像素数,其范围为11 000之间的整数,其值越小,转换后的图像越精确,与源图像的差别也就越小。3)曲线拟合
4、:设置曲线的平滑程度。4)角阀值:设置转换时如何处理对比强烈的边界,是进行平滑处理还是保留拐点。(3)设置完毕后,单击“确定”按钮,弹出“正在转换位图为矢量图”对话框(见图2.1.4),表示位图正在转换中,需要用户等待一段时间。稍等片刻,完成位图的转换,如图2.1.5所示。图2.1.4 “正在转换位图为矢量图”对话框 注意:等待时间由图形文件的复杂程度所决定,文件越复杂,需要的时间越长。Flash 8具有强大的绘图功能,使用工具箱中的绘图工具可以绘制Flash作品中的插图,从而使动画更加丰富多彩,下面介绍直线、选区、路径、椭圆、矩形、多角星形、任意线条和矢量色块的绘制方法。第二节 绘制动画元素
5、 一、绘制直线 使用直线工具可以绘制各种不同方向的直线。选择直线工具后,在工具箱的选项区中不会出现任何选项,但用户可以通过直线所对应的属性面板对其笔触颜色、笔触高度、笔触样式等属性进行设置。绘制直线的操作步骤如下:(1)选择工具箱中的直线工具 。(2)在属性面板中设置其笔触颜色、笔触高度和笔触样式等属性,如图2.2.1所示。图2.2.1 “直线工具”属性面板 (3)在工作区的某一点处按下鼠标左键作为直线的起点,然后拖动鼠标到另一点释放鼠标,即可在两点之间绘制直线,如图2.2.2所示为使用直线工具所绘制出的不同直线。图2.2.2 使用直线工具绘制直线 二、绘制选区 使用套索工具可以绘制不规则的选
6、区。选择套索工具后,在工具箱的选项区中会出现套索工具的附加选项,包括魔术棒、魔术棒设置和多边形模式(见图2.2.3),用户可根据需要进行选择和设置。绘制选区的操作步骤如下:(1)选择工具箱中的套索工具 。(2)在工具箱的选项栏中设置套索工具的附加选项,然后进行选区的绘制。魔术棒设置魔术棒多边形模式 1)魔术棒:用于快速选择颜色相近的区域,选择魔术棒之后,将鼠标指针移动到某种颜色上,当其变为 形状时单击鼠标左键可以选取与该颜色相近的区域,效果如图2.2.4所示。注意:魔术棒只对处于分离状态的位图起作用。2)魔术棒设置:用于设置魔术棒在选择时,对颜色差异的敏感度和边界的形状。3)多边形模式:用于绘
7、制多边形选区,绘制完成后,双击鼠标结束选取操作,如图2.2.5所示。三、绘制路径 路径是由一系列节点连接起来的线段或曲线,使用钢笔工具可以绘制路径。绘制路径的操作步骤如下:(1)选择工具箱中的钢笔工具 。(2)在属性面板中设置其笔触颜色、笔触高度和笔触样式等属性,如图2.2.6所示。图2.2.6 “钢笔工具”属性面板 (3)在工作区的某一点处单击鼠标定义路径的起点,然后拖动鼠标到另一点处,如果直接单击鼠标左键将绘制直线路径;如果按下鼠标左键并拖动将绘制曲线路径,如图2.2.7所示。提示:连续多次操作可以绘制相对复杂的路径,如图2.2.8所示。四、绘制椭圆形和圆形 使用椭圆工具可以绘制椭圆形和圆
8、形,操作步骤如下:(1)选择工具箱中的椭圆工具 。(2)在属性面板中设置其笔触颜色、笔触高度、笔触样式和填充颜色等属性,如图2.2.9所示。(3)在工作区中按住鼠标左键不放并拖动绘制椭圆。若在绘制的同时按住Shift键并拖动鼠标可绘制圆形,如图2.2.10所示。图2.2.9 “椭圆工具”属性面板图2.2.10 绘制椭圆形和圆形绘制椭圆形 绘制圆形 五、绘制长方形、正方形和圆角矩形 使用矩形工具可以绘制长方形、正方形和圆角矩形,操作步骤如下:(1)选择工具箱中的矩形工具 。(2)在属性面板中设置其笔触颜色、笔触高度、笔触样式和填充颜色等属性,如图2.2.11所示。图2.2.11 “矩形工具”属性
9、面板 (3)在工作区中按住鼠标左键不放并拖动绘制长方形。若在绘制的同时按住Shift键并拖动鼠标可绘制正方形;若在绘制前单击选项栏中的“边角半径设置”按钮,在弹出的“矩形设置”对话框中设置矩形的边角半径,然后在工作区中按住鼠标左键不放并拖动可绘制圆角矩形,如图2.2.12所示。图2.2.12 绘制长方形、正方形和圆角矩形 六、绘制多角星形 使用多角星形工具可以绘制多角星形,操作步骤如下:(1)在工具箱中单击“矩形工具”按钮右下方的小三角,会弹出一个下拉菜单,从中选择选项,即可选择多角星形工具。(2)在属性面板中设置其笔触颜色、笔触高度、笔触样式和填充颜色等属性,如图2.2.13所示。图2.2.
10、13 “多角星形工具”属性面板 (3)在工作区中按住鼠标左键不放并拖动绘制多角星形,如图2.2.14所示。图2.2.14 绘制多角星形 七、绘制任意线条 使用铅笔工具可以绘制任意线条。选择铅笔工具后,在工具箱的选项区中会出现一个“铅笔模式”按钮,单击其右下方的小三角,会弹出一个下拉菜单,包括伸直、平滑和墨水3个选项,用户可以根据需要进行选择,然后进行线条的绘制。绘制任意线条的操作步骤如下:(1)选择工具箱中的铅笔工具 。(2)在属性面板中设置其笔触颜色、笔触高度和笔触样式等属性,如图2.2.15所示。图2.2.15 “铅笔工具”属性面板 (3)单击工具箱选项区中的“铅笔模式”按钮,在弹出的下拉
11、菜单中选择一种绘画模式。1)伸直模式:适用于绘制规则线条,并可将近似于椭圆、三角形、正方形和矩形的图形转换为标准的几何图形。2)平滑模式:适用于绘制平滑曲线。3)墨水模式:适用于绘制接近手工绘制的线条。(4)在工作区中按住鼠标左键不放并拖动绘制任意线条,如图2.2.16所示。八、绘制矢量色块 使用刷子工具可以绘制矢量色块。选择刷子工具后,在工具箱的选项区中会出现刷子工具的附加选项,包括刷子模式、刷子大小和刷子形状(见图2.2.17),用户可根据需要进行选择和设置。绘制矢量色块的操作步骤如下:刷子模式刷子大小刷子形状 (1)选择工具箱中的刷子工具 。(2)在属性面板中设置其填充颜色和笔触平滑度,
12、如图2.2.18所示。图2.2.18 “刷子工具”属性面板 (3)在选项区中设置刷子模式、刷子大小和刷子形状,然后进行矢量色块的绘制。其中,刷子模式用于更改刷子对工作区中动画元素的影响方式,包括标准绘画、颜料填充、后面绘画、颜料选择和内部绘画5种模式,它们的功能如下:1)标准绘画:在该种模式下,新绘制的图形会覆盖同一层中原有的图形,但是不会影响文本对象和导入的对象,如图2.2.19所示。2)颜料填充:在该种模式下,只能在空白区域和已有矢量色块的填充区域内绘图,不会影响矢量线的颜色,如图2.2.20所示。3)后面绘画:在该种模式下,只能在空白区域内绘图,并且不会影响原有的图形,只是从原有图形的背
13、后穿过,如图2.2.21所示。4)颜料选择:在该种模式下,必须先选择一个区域,然后在被选区域内绘图,不会影响原有的矢量线和填充区域,如图2.2.22所示。5)内部绘画:在该种模式下,可以分为两种情况,一种情况为刷子起点位于图形之外的空白区域,当刷子经过图形进行绘画时,从其背后穿过;另一种情况为刷子的起点位于图形的内部,当刷子经过图形进行绘画时,只能影响该图形的内部,如图2.2.23所示。在Flash 8中,除了可以利用工具箱中的工具绘制动画元素外,还可以导入各种现有的动画元素,包括位图、矢量图、图像序列、声音和视频等,下面分别进行介绍。第三节 导入动画元素 一、导入位图和矢量图 Flash支持
14、多种位图和矢量图的导入,在导入之后,Flash自动将它们添加到库面板中,以供其他场景或实例使用。1导入位图 在Flash中,所导入的位图将成为当前图层的单个对象,并且保留其透明度等属性。导入位图的操作步骤如下:(1)选择“文件”“导入”“导入到舞台”命令,弹出“导入”对话框。(2)选中需要导入的位图,例如“FL027.JPG”,如图2.3.1所示。(3)单击“打开”按钮,将位图导入到工作区中,如图2.3.2所示。图2.3.1 选中位图 图2.3.2 导入的位图 2导入矢量图 在Flash中,还可以导入由FreeHand或Illustrator等软件制作的矢量图,它们将成为当前图层中的组合体。导
15、入矢量图的操作步骤如下:(1)选择“文件”“导入”“导入到舞台”命令,弹出“导入”对话框。(2)选中需要导入的矢量图,例如“BIRD027.WMF”,如图2.3.3所示。(3)单击“打开”按钮,将矢量图导入到工作区中,如图2.3.4所示。图2.3.3 选中矢量图 图2.3.4 导入的矢量图 二、导入图像序列 Flash默认与Pic1.jpg,Pic2.jpg,Pic3.jpg或Pic001.jpg,Pic002.jpg,Pic003.jpg以及Pic_001.jpg,Pic_002.jpg,Pic_003.jpg格式相似的文件为图像序列。在Flash中,可以将图像序列导入到当前图层的连续帧中。
16、导入图像序列的操作步骤如下:(1)选择“文件”“导入”“导入到舞台”命令,弹出“导入”对话框。(2)选中需要导入图像序列中的一个图像,例如“h1.jpg”,如图2.3.5所示。图2.3.5 选中图像序列中的一个图像 注意:该序列中的其他图像必须位于同一个文件夹中。(3)单击“打开”按钮,弹出如图2.3.6所示的提示框。若单击“是”按钮,则导入图像序列中的所有图像;若单击“否”按钮,则只导入选中的图像;若单击“取消”按钮,则取消导入操作。图2.3.6 提示框 (4)单击“是”按钮,导入图像序列中的所有图像,如图2.3.7所示。注意:在导入之后,图像序列中的所有图像被自动添加在库面板中,如图2.3
17、.8所示。图2.3.7 导入的图像序列 图2.3.8 库面板 三、导入声音 用户可以把声音当做一个元件(类似于图形、影片剪辑或按钮元件),将它们任意添加到动画中,从而增加动画的表现力。导入声音的操作步骤如下:(1)选择“文件”“导入”“导入到舞台”命令,弹出“导入”对话框,如图2.3.9所示。(2)在该对话框中选择需要的声音文件。图2.3.9 “导入”对话框 (3)单击“打开”按钮,声音文件将以元件的形式显示在库面板中,如图2.3.10所示。图2.3.10 库面板中的声音文件 四、导入视频 Flash 8的视频功能得到了很大的改进,它不仅支持更多的视频格式,而且对导入视频的编辑功能也更加强大。
18、导入视频的操作步骤如下:(1)选择“文件”“导入视频”命令,弹出“导入视频”对话框(一),如图2.3.11所示。(2)单击“浏览”按钮,弹出“打开”对话框,选中要导入的视频文件(见图2.3.12),单击“打开”按钮,返回到“导入视频”对话框(一)。图2.3.11 “导入视频”对话框(一)图2.3.12 选中视频文件 (3)单击“下一个”按钮,在弹出的“导入视频”对话框(二)中设置视频文件的部署方法,如图2.3.13所示。(4)单击“下一个”按钮,在弹出的“导入视频”对话框(三)中设置视频的外观,如图2.3.14所示。图2.3.13 “导入视频”对话框(二)图2.3.14 “导入视频”对话框(三
19、)(5)单击“下一个”按钮,在弹出的“导入视频”对话框(四)中显示视频文件的保存选项,如图2.3.15所示。(6)单击“完成”按钮,弹出“正在加载FLV尺寸”提示框,提示导入进程。(7)稍等片刻,则完成视频文件的导入,如图2.3.16所示。图2.3.15 “导入视频”对话框(四)图2.3.16 导入视频文件 下面根据本章所学的知识来绘制一头狮子,操作步骤如下:(1)选择“文件”“新建”命令,创建一个新的动画文件。(2)选择“修改”“文档”命令,弹出“文档属性”对话框,设置“尺寸”为“550 px400 px”,“背景颜色”为“#9DACBF”,单击“确定”按钮。第四节 应用举例绘制狮子(3)使
20、用铅笔工具绘制狮子的头部轮廓,并用选择工具对其进行修改,如图2.4.1所示。(4)选择颜料桶工具,在属性面板中设置填充颜色为“#FCDB00”,填充狮子的头部,如图2.4.2所示。(5)绘制狮子的毛发轮廓(见图2.4.3),并以值为“#EA891C”的颜色填充,如图2.4.4所示。(6)绘制狮子的眼睛、鼻子和嘴巴,如图2.4.5所示。(7)绘制狮子的身体并以值为“#FCDB00”的颜色填充,如图2.4.6所示。(8)绘制狮子的尾巴,如图2.4.7所示。本章主要介绍动画元素的绘制和导入方法,包括位图和矢量图的组成原理和特点、基本图形的绘制以及各种外部对象的导入。通过本章的学习,要求用户能够熟练使
21、用绘图工具,并掌握对象的导入。本章小结一、填空题1在计算机中,图形的显示方式主要有_和_两种。2在_中,一幅图像被划分为许多栅格,栅格中的每一点代表图像的像素,其值代表像素的亮度和色彩值。3_由一系列的点、线、面组成,当将它放大时,不会出现失真现象。4选择套索工具后,在工具箱的选项区中会出现它的附加选项,包括_、魔术棒设置和多边形模式。习 题 二5在Flash中,所导入的_将成为当前图层的单个对象,并且保留其透明度等属性。6在Flash中,可以将_导入到当前图层的连续帧中。二、简答题1如何将位图转换为矢量图?2Flash默认与哪些格式相似的文件为图像序列?三、上机操作题练习使用绘图工具绘制鼠标效果,如题图2.1所示。