flash 8 电子教案第7章.ppt

1、第6章 位图的使用,6.1 位图的基础知识 6.2 导入位图 6.3 处理导入的位图 6.4 跟我学操作 6.5 本章小结 6.6 过关训练,6.1 位图的基础知识,计算机采用位图与矢量图两种形式表示图形，它们的概念与区别已在第1章中做了介绍，这里就不再赘述。下面详细介绍位图的一些基础知识，包括分辨率、颜色模式、颜色深度、Alpha通道和常用的位图格式等。 6.1.1 分辨率 分辨率指单位长度内所含像素的多少，用于衡量位图细节的表现能力，主要包括图像分辨率、设备分辨率、屏幕分辨率、位分辨率、输出分辨率5种类型。,1图像分辨率 图像分辨率指每英寸图像所含的点数或像素数，分辨率的单位为dpi，如1

2、00 dpi就表示图像每英寸长度上含有100个像素点。 在一般情况下，图像分辨率的大小将影响位图的品质，图像分辨率越高位图就越清晰，如图6.1.1所示为位图在两种不同图像分辨率下的对比效果。,图6.1.1 位图在不同图像分辨率下的对比效果,在确定使用的图像分辨率时，应考虑位图最终发布的媒体。如果制作的位图用于计算机屏幕显示，图像分辨率只需满足显示器的分辨率即可，如72 dpi或者96 dpi；如果制作的位图用于打印输出，那么必须使用较高的图像分辨率，如150 dpi或更高，低的图像分辨率会使位图在打印时出现明显的锯齿边缘，如图6.1.2所示。,图6.1.2 低图像分辨率的位图在打印时出现锯齿,

3、另外，位图的大小与其尺寸和分辨率有着密切的关系，即一个尺寸相同的位图，分辨率越高，文件就越大。 2设备分辨率 设备分辨率指每单位输出长度所含的点数或像素数，它与图像分辨率不同，图像分辨率可以更改，而设备分辨率是不可以更改的。例如，常见的显示器、扫描仪和数码相机等设备都各自有一个固定的分辨率。 3屏幕分辨率 屏幕分辨率又叫屏幕频率，如图6.1.3所示为将显示器的屏幕分辨率设置为1 024768像素。,图6.1.3 “显示 属性”对话框,4位分辨率 位分辨率又叫位深，用于表示每个像素所存储信息的位数。例如，一个24位的RGB图像，即表示R，G，B三原色均使用了8位，它们的相加之和为24位。 5输出

4、分辨率 输出分辨率指打印机、复印机等输出设备的分辨率，用于表示输出位图中每英寸的点数。 6.1.2 颜色模式 颜色模式是人们对颜色的描述方法，常见的颜色模式有RGB模式、Lab模式、HSB模式和CMYK模式4种。,1RGB模式 RGB模式又叫加色模式，由红（Red）、绿（Green）和蓝（Blue）3种原色组成的。在RGB模式下，像素由一个24位数表示，其中红、绿、蓝 3种原色各占用了8位，因此，每一种原色都可以表现出256种不同深度的色调，3种原色混合起来就可以生成1 667万种颜色，也就是真彩色。 2Lab模式 Lab模式由一个发光率（Lightness）和两种颜色（a，b）组成，是一种独

5、立于设备的颜色模式，即不论使用何种显示器或打印机，Lab的颜色都不会改变。,目前，Lab模式是所有颜色模式中包含色彩范围最广的模式，它能毫无偏差地在不同系统和平台之间进行切换。 3HSB模式 HSB模式由色相（Hue）、饱和度（Saturation）和亮度（Brightness）组成，可以用底与底对接的两个圆锥体立体模型来表示，其中轴向表示亮度，自上而下由白变黑；径向表示饱和度，自内向外逐渐变高；而圆周方向则表示色相的变化，形成色环。利用HSB模式，用户可以轻松地选择各种亮度的颜色。,4CMYK模式 CMYK模式又叫减色模式，它由青（Cyan）、洋红（Magenta）、黄（Yellow）和黑（

6、Black）4种颜色组成的。 CMYK模式是由纸张上油墨的吸收特性来定义的，白色的光碰到半透明的油墨，一部分光谱被吸收，没有被吸收的光被反射回来进入人的眼睛，从而形成色彩的感觉，因此，CMYK模式经常在打印时被采用。 在处理图像时，一般不采用CMYK模式，因为这种模式的文件较大，会占用较多的磁盘空间和内存。,6.1.3 颜色深度 图像数字化后，能否真实的反映图像的颜色是十分重要的问题，计算机采用了颜色深度这一概念来体现其处理颜色的能力。 颜色深度指每个像素可以显示出的颜色数，它和数字化过程中的量化数（bite）有着密切的关系，因此，颜色深度通常用多少量化数来表示，即量化数越高，每个像素可显示出

7、的颜色数目就越多。,对应不同的量化数，颜色有伪彩色、高彩色和真彩色之分。其中，伪彩色是8位颜色，采用这种方式，每个像素所能显示的颜色数是2的8次方，即256种颜色；高彩色是16位颜色，采用这种方式，每个像素所能显示的颜色数是2的16次方，即65 536种颜色；真彩色是24位颜色，采用这种方式，每个像素所能显示的颜色数是2的24次方，即1 680万种颜色。 颜色深度和文件的大小有着密切的关系，即量化数越高，色彩就越丰富、真实，所产生的文件也就越大。,6.1.4 Alpha通道 Alpha通道常被写做（希腊字母）通道，它使用不同的灰度值来表示透明度的大小，一般情况下，纯白为不透明；纯黑为完全透明；

8、介于白黑之间的灰色表示部分透明。 Alpha通道的作用主要有以下3个方面： （1）用于合成不同的图像，实现混合叠加。 （2）用于选择图像的某一区域，方便修改处理。 （3）利用Alpha通道对基色通道的影响，制作丰富多彩的视觉效果。,注意：并非所有的位图文件都能包含Alpha通道，例如 JPEG文件和GIF文件等，它们不允许包含Alpha通道。 6.1.5 常用的位图格式 下面介绍一些常用的位图格式。 1BMP格式 BMP的英文全称为Bitmap，它是Windows操作系统中的标准位图格式，能够被多种Windows,应用程序所支持。BMP格式的特点，就是包含的图像信息较丰富，几乎不能进行压缩，占

9、用的磁盘空间过大。随着Windows操作系统的流行与丰富的Windows应用程序的开发，BMP格式的文件已被广泛应用。 2GIF格式 GIF的英文全称为Graphics Interchange Format，即图形交换格式，是网络上最常用的图像格式。GIF格式的特点是压缩比高，占用的磁盘空间小，但不支持Alpha通道，不支持24位真彩色。,最初的GIF格式只是简单地用来存储单幅静止图像（称为GIF87a），后来随着技术的发展，可以同时存储若干幅静止图像并形成连续的动画，从而成为支持2D动画的格式之一（称为GIF89a），如图6.1.4所示。 考虑到网络的传输情况，GIF格式还增加了渐显方式，也

10、就是说，在位图传输过程中，用户可以先看到位图的大致轮廓，然后随着传输过程的继续逐渐看清位图的细节部分。,图6.1.4 GIF格式的动画,3JPEG格式 JPEG的英文全称为Joint Photographic Expert Group，是由联合图像专家组开发的图像格式。JPEG格式的特点是所生成的文件比较小，能够完整显示24位的全彩图像，但它采用有损压缩方式去除多余的颜色数据，因此在制作印刷作品时最好不要选择此种格式来保存图像。JPEG格式常用于存储照片级的图像，即存储颜色较为丰富的图像。,4TIFF格式 TIFF的英文全称为Tag Image File Format，它是一种标签图像文件格式

11、，常用于印刷出版，许多多媒体应用程序也接受导入的TIFF图形。TIFF格式的特点是支持24个通道，存储的信息多，但占用的磁盘空间较大。 5PNG格式 PNG的英文全称为Portable Network Graphic，它是Fireworks文件的默认格式。PNG格式的特点是支持透明背景、动画和24位真彩色等。,6.2 导入位图,Flash作为一款矢量动画设计软件，不但具有矢量绘制功能，而且具有导入与编辑位图的功能，下面介绍位图的3种导入方式。 6.2.1 导入到舞台 将位图直接导入到舞台的操作步骤如下： （1）选择“文件”“导入”“导入到舞台”命令，弹出“导入”对话框，如图6.2.1所示。,（

12、2）在对话框选要导入的位图，如选择“244353.jpg”。 （3）单击“打开”按钮即可，如图6.2.2所示。,图6.2.1 “导入”对话框 图6.2.2 导入的位图,在导入位图时，如果该位图是图像序列的组成部分（即文件名以数字结尾，并且该序列中的其他文件都位于相同的文件夹中），系统将弹出如图6.2.3所示的提示框，供用户选择执行何种操作。若要导入图像序列中的所有图像，单击“是”按钮；若仅仅导入选中的图像，单击“否”按钮；若要取消导入操作，单击“取消”按钮。,图6.2.3 提示框,将位图直接导入到舞台之后，在Flash文件的库面板中将自动生成相应的位图对象，以供在其他场景或元件中使用，如图6.

13、2.4所示为导入位图前后的库面板效果。,图6.2.4 导入位图前后的库面板,6.2.2 导入到库 将位图导入到库的操作步骤如下： （1）选择“文件”“导入”“导入到库”命令，弹出“导入到库”对话框，如图6.2.5所示。,图6.2.5 “导入到库”对话框,（2）在对话框中选择要导入的位图，如选择“91.jpg”。 （3）单击“打开”按钮，可将位图导入到库中。若要应用导入到库中的位图，直接将其拖动到舞台中即可，如图6.2.6所示。,图6.2.6 应用导入到库中的位图,6.2.3 从外部库中导入 从外部库中导入位图的操作步骤如下： （1）选择“文件”“导入”“打开外部库”命令，弹出“作为库打开”对话

14、框，如图6.2.7所示。,图6.2.7 “作为库打开”对话框,（2）在对话框中选择位图所在的源文件，例如选择“蜻蜓.fla”。 （3）单击“打开”按钮，将打开“蜻蜓.fla”的库面板。若要应用“蜻蜓.fla”中的位图，直接将其拖动到舞台中即可，如图6.2.8所示。提示：除位图外，用户还可以使用外部库中的其他资源，例如元件和声音等，其使用方法与位图基本相同。 提示：除位图外，用户还可以使用外部库中的其他资源，例如元件和声音等，其使用方法与位图基本相同。,图6.2.8 应用外部库中的位图,6.3 处理导入的位图,在Flash中，位图是一种常见对象，用户可以对它进行选择、移动、复制、删除、叠放、对齐

15、、变形和组合等常规操作，其操作方法已在第4章做了详细介绍，这里就不再赘述。下面介绍对导入位图的其他处理，包括将位图转换为矢量图、打散位图、交换位图、编辑位图、重命名位图以及设置位图的属性。 6.3.1 将位图转换为矢量图 在Flash中，不能直接对导入的位图进行编辑，若要进行编辑，必须将其转换为可编辑的矢量图，操作步骤如下：,（1）选中要转换为矢量图的位图。 （2）选择“修改”“位图”“转换位图为矢量图”命令，弹出“转换位图为矢量图”对话框，如图6.3.1所示。 （3）在“颜色阈值”文本框中输入一个1500之间的整数，该值越小，颜色转换越多，与源图像的差别也就越小。,图6.3.1 “转换位图为

16、矢量图”对话框,（4）在“最小区域”文本框中输入一个11 000之间的整数，该值越小，转换后的图像越精确，与源图像的差别也就越小。 （5）在“曲线拟合”下拉列表中设置曲线的平滑程度。 1）像素：最接近源图像。 2）非常紧密：非常密集，图像不失真。 3）紧密：非常密集，图像几乎不失真。 4）一般：一般情况，建议选择该选项。 5）平滑：图像失真。,6）非常平滑：图像严重失真。 （6）在“角阈值”下拉列表中设置转换时如何处理对比强烈的边界。 1）较多转角：图像失真。 2）一般：一般情况，建议选择该选项。 3）较少转角：图像不失真。 （7）单击“确定”按钮，弹出如图6.3.2所示的“正在转换位图为矢量

17、图”对话框，稍等片刻即可完成转换，如图6.3.3所示为转换前后的效果。,图6.3.2 “正在转换位图为矢量图”对话框,图6.3.3 位图在转换前后的效果,注意：使用“转换位图为矢量图”命令只能将没有被分离的位图转换为矢量图。在一般情况下，将位图转换为矢量图可以减小文件的大小。 6.3.2 打散位图 对于位图，打散与矢量转换的结果不同，位图在打散之后仍是位图，但在矢量转换之后将变成矢量图。打散位图的操作步骤如下： （1）选中需要打散的位图。,（2）选择“修改”“分离”命令或按“Ctrl+B”键将其打散，如图6.3.4所示为位图在打散前后的效果。,图6.3.4 位图在打散前后的效果,若要编辑整个打

18、散的位图，用户可以直接单击鼠标将其选中，然后再进行其他操作，例如缩放、旋转等，如图6.3.5所示。,图6.3.5 编辑整个打散的位图,若要编辑打散位图的某个部分，用户可以先用套索工具将其选中，然后再进行其他操作，如图6.3.6所示。,图6.3.6 编辑打散位图的某个部分,6.3.3 交换位图 交换位图指用其他位图替换舞台中的位图，其操作步骤如下： （1）选中需要交换的位图，例如“91.jpg”。 （2）单击属性面板中的“交换”按钮（见图6.3.7），弹出“交换位图”对话框，如图6.3.8所示。,图6.3.7 属性面板,图6.3.8 “交换位图”对话框,（3）在对话框中选择用于交换的位图，例如“

19、15.jpg”。 （4）单击“确定”按钮后可进行交换，如图6.3.9所示。,图6.3.9 位图在交换前后的效果,6.3.4 编辑位图 要编辑导入到Flash中的位图，可以直接在Flash中启动外部图像编辑程序（如Fireworks）进行编辑，而不必离开 Flash，操作步骤如下： （1）选中需要编辑的位图。 （2）单击属性面板中的“编辑”按钮（见图6.3.10），启动默认的外部图像编辑程序Fireworks 8，并在其中打开位图，如图6.3.11所示。,图6.3.10 属性面板,图6.3.11 在外部图像编辑程序Fireworks 8中打开位图,（3）编辑位图，例如更改其透明度，如图6.3.1

20、2所示。 （4）保存文件并关闭外部图像编辑程序Fireworks 8， Flash 8中的位图将被自动更新，如图6.3.13所示。,图6.3.12 在Fireworks 8中更改位图的透明度 图6.3.13 Flash 8中的位图自动更新,6.3.5 重命名位图 用户可以在库面板中对位图进行重新命名，其操作步骤如下： （1）选择“窗口”“库”命令，打开库面板。 （2）选中需要重命名的位图，单击鼠标的右键，在弹出的快捷菜单中选择“重命名”命令，使位图名称处于可编辑状态。 （3）在可编辑框中输入新的名称，然后在可编辑框外单击鼠标即可，如图6.3.14所示。,图6.3.14 重命名位图,提示：对于库

21、面板中的其他元素，例如元件、声音、视频等，用户可以用同样的方法进行重命名。 6.3.6 设置位图属性 通过设置位图属性，可以了解位图信息、预览效果、更新位图以及压缩位图等，设置位图属性的操作步骤如下： （1）选择“窗口”“库”命令，打开库面板。 （2）在库面板中选择要设置属性的位图，单击鼠标右键，在弹出的快捷菜单中选择“属性”命令，弹出“位图属性”对话框，如图6.3.15所示。,图6.3.15 “位图属性”对话框,在“位图属性”对话框中除了显示位图的名称、存放路径、创建时间、尺寸和预览效果外，还包括以下几个重要的参数选项。 1）允许平滑：选中该复选框，可消除位图边缘锯齿。 2）压缩：设置位图文

22、件压缩方式，额“照片（JPEG）”和“无损（PNG/GIF）”两个选项。若选择“照片（JPEG）”选项，则以JPEG格式压缩位图；若选择“无损（PNG/GIF）”选项，则以不损失位图质量为前提进行压缩。,3）使用导入的JPEG数据：选中该复选框，使用位图本身的参数数据。 4）更新：单击该按钮，更新导入的位图。 5）导入：单击该按钮，弹出“导入位图”对话框，用户可以导入一个新的位图。 6）测试：单击该按钮，可以预览设置后的位图属性。 （3）设置完毕后，单击“确定”按钮，关闭“位图属性”对话框。,6.4 跟我学操作,操作内容：制作“卡片”效果。 操作步骤：（1）选择“文件”“新建”命令，创建一个新

23、的动画文件。 （2）选择“文件”“导入”“导入到舞台”命令，弹出“导入”对话框，导入一幅位图到舞台中，如图6.4.1所示。 （3）选中位图，选择“修改”“分离”命令，将其打散，如图6.4.2所示。,图6.4.1 导入位图 图6.4.2 打散位图,（4）在位图以外的位置单击鼠标左键，取消位图的选中状态。 （5）选择工具箱中的椭圆工具，在属性面板中设置笔触颜色为“白色”，填充颜色为“无”，在如图6.4.3所示的位置绘制一个椭圆。 （6）选中椭圆及椭圆以外的部分，按“Delete”键将它们删除，如图6.4.4所示。,图6.4.3 绘制椭圆 图6.4.4 删除椭圆及椭圆以外的部分,（7）选择工具箱中的

24、矩形工具，在属性面板中设置笔触颜色为“无”，填充颜色为“粉红色”，在舞台上绘制一个矩形，然后选择工具箱中的选择工具，将剩余的位图部分移动到矩形上，如图6.4.5所示。 （8）选择工具箱中的文本工具，在属性面板中设置字体为“隶书”，字体大小为“20”，文本颜色为“红色”，然后在矩形的上面输入文本“年年岁岁花相似 岁岁年年人不同”，如图6.4.6所示。,图6.4.5 移动位图 图6.4.6 输入文本,（9）设置字体大小为“50”，在矩形的上面输入文本“祝你快乐”。 （10）单击属性面板中的“滤镜”标签，打开“滤镜”选项卡，如图6.4.7所示。,图6.4.7 “滤镜”选项卡,（11）选中文本“祝你快乐”，单击“添加滤镜”按钮，在弹出的下拉菜单中选择“投影”命令，为其添加“投影”滤镜效果。此时，属性面板如图6.4.8所示。,图6.4.8 “投影”滤镜的设置选项,（12）选中“挖空”复选框，将投影作为背景，挖空投影上面的文本，如图6.4.9所示。 （13）至此，完成卡片