Flash 8
This presentation is the property of its rightful owner.
Sponsored Links
1 / 56

Flash 8 PowerPoint PPT Presentation


  • 94 Views
  • Uploaded on
  • Presentation posted in: General

Flash 8. 蒙板技术 AS2.0 简介 声音处理 视频制作. 第 12 章 蒙板动画技术. 蒙板基本概念 在现实世界中,蒙板是用来有选择地隐藏它后面的东西的,人们看不见蒙板后面的东西。而在 Flash 8 中,蒙板则用来显示它下面的内容。蒙板图层用来定义紧挨在它下面的图层中的可见区域,即人们可以看到蒙板图层中形状覆盖的内容,而这个形状外的东西人们就看不见了. 第 12 章 蒙板动画技术. 遮罩层与被遮罩层 遮罩层提供显示外形,被遮罩层提供显示内容

Download Presentation

Flash 8

An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -

Presentation Transcript


Flash 8

Flash 8


Flash 8

  • 蒙板技术

  • AS2.0简介

  • 声音处理

  • 视频制作


Flash 8

第12章 蒙板动画技术

  • 蒙板基本概念

  • 在现实世界中,蒙板是用来有选择地隐藏它后面的东西的,人们看不见蒙板后面的东西。而在Flash 8中,蒙板则用来显示它下面的内容。蒙板图层用来定义紧挨在它下面的图层中的可见区域,即人们可以看到蒙板图层中形状覆盖的内容,而这个形状外的东西人们就看不见了


Flash 8

第12章 蒙板动画技术

  • 遮罩层与被遮罩层

  • 遮罩层提供显示外形,被遮罩层提供显示内容

  • 遮罩层上的内容在最终的Swf文件中是不可见的,Flash会忽略蒙板(遮罩图层上的形状)的渐变、颜色、透明度以及线条类型等属性。遮罩层只提供显示外形,被遮罩层才提供显示内容


Flash 8

遮罩层与被遮罩层

【例12-1】遮罩层与被遮罩层

知识点:理解遮罩层和被遮罩层的关系

源文件见配书光盘第12章“RedTextMask&Ball.fla”


Flash 8

制作步骤

(1)准备渐变色球。

文件背景设为灰色。将当前图层改名为ball。

在图层ball的第1帧舞台上绘制一个填充色为黑白色放射状渐变、无笔触颜色的圆,。

(2)准备文字。

新建一个图层text。在图层text的第1帧舞台中心输入文字“Flash”,字体为Impact,颜色为红色。将圆和文字左对齐。


Flash 8

(3)制作补间动画。

在图层ball的第10帧和第20帧处插入关键帧,将第20帧处的圆拖到与文字右对齐的位置;

将图层ball的第1帧和第11帧处设置补间为运动。

在图层text的第20帧处插入帧。


Flash 8

(4)设置遮罩。

在图层text处右击鼠标,在弹出的菜单中选“遮罩层”。这样图层text为蒙板层(遮罩层),而图层ball为被遮罩层。


Flash 8

(1)去掉图层text的遮罩属性,将图层text拖到图层ball的下面。

(2)将图层ball设为遮罩层(比较:原来图层text是遮罩层)。


Flash 8

重要概念

遮罩层上的内容在最终的Swf文件中是不可见的,Flash会忽略蒙板(遮罩图层上的形状)的渐变、颜色、透明度以及线条类型等属性。

遮罩层只提供显示外形,被遮罩层才提供显示内容。


Flash 8

静态蒙板

  • 静态蒙板是指用形状作蒙板

    【例12-2】制作静态蒙板

    知识点:填充形状作静态蒙板

    源文件见配书光盘第12章“StaticMask.fla”。


Flash 8

制作步骤

(1)创建新文件,并将当前图层图层1命名为“内容”。导入一幅图片,放在“内容”图层的第1帧。

(2)在“内容”的上方创建新图层,并命名为“蒙板”,在“蒙板”图层第1帧画一个椭圆。

(3)将“蒙板”层设为遮罩层,“内容”层自动变为被遮罩层,两个层被自动锁定。

当蒙板图层被锁定时,蒙板图层中的内容看不到;

蒙板图层没有被锁定时,可以编辑蒙板。


Flash 8

静态蒙板

【例12-3】制作窗外的风景

知识点:

用多个填充形状作蒙板,使用标尺、辅助线

源文件见配书光盘第12章“scenery.fla”。


Flash 8

制作步骤

(1)准备图片。

新建一个文件,尺寸为400×400像素,将图片(尺寸为400×400像素)导入到当前舞台并置于舞台中心。将图层1命名为“scenery”。

(2)准备蒙板。

在scenery图层的上方添加一个图层mask1,在mask图层舞台上画一个160×160像素的正方形。

(3)拖出水平、垂直两根辅助线,定位于x和y方向的200像素的位置。

(4)将正方形复制3个,参照辅助线,将4个正方形均匀分布在舞台上

(5)将mask1图层设置为遮罩层。


Flash 8

(6)准备窗框图片。

在mask1图层的上面添加两个图层,上下图层分别命名为“mask2”和“woodGrain”。

将一幅木纹图片导入到图层woodGrain上第1关键帧的舞台上,并调整图片与舞台居中。

(7)制作木纹窗框蒙板。

在图层mask2第1关键帧的舞台上画一个和舞台尺寸相同大小的灰色方形,用对齐工具将其调整为与舞台同宽同高并与舞台居中对齐。

将图层mask1上的4个小方形原位粘贴到mask2图层的灰色大方形上,将大矩形分割,将4个小方形删除。

(8)将图层mask2设置为遮罩层。


Flash 8

(9)添加修饰效果。

在mask2图层的上面添加图层“putty”。

选中图层“putty”第1帧。将图层mask1上的4个小方形原位粘贴到当前舞台。

单击第1个小方形,在变形面板中分别将4个小方形等比例调整为105%。

将4个小方形的颜色调整为棕色。

再次将图层mask1上的4个小方形原位粘贴到当前舞台,即图层putty的舞台。

复制过来的方形可以将扩大了的方形分割成新形状。删除小方形,剩下空的棕色框。再用直线工具画出水平、垂直中心线,颜色与棕色框一致。


Flash 8

文字蒙板

【例12-4】制作文字蒙板

知识点:用文本作静态蒙板,分离文字,为形状添加笔触颜色

源文件见配书光盘第12章“ClearTextMask.fla”。


Flash 8

制作步骤

(1)准备两个图层,上、下图层分别命名为text和picture。将图片导入到picture图层的第1帧舞台上。

(2)选中text图层的关键帧,输入文字“文本作为蒙板”,字体设为“华文琥珀”(最好选用笔画比较粗的字体),字号为96。

(3)将text层设为遮罩层。


Flash 8

(4)使蒙板轮廓更清晰。

在蒙板图层的上面新建一图层“frame”,将蒙板图层的文字原位复制、粘贴到该层第1帧。将其他层锁定。

添加字体轮廓,方法是:将frame层的文字两次分解,将笔触颜色设为与背景相似的颜色,线条粗细为1或2个像素,用墨水瓶工具单击每个文字,将边框添加到文字上。

(5)去掉文字的填充色。

选中文字的中间部分,按Delete键,使文字只剩下轮廓。这样中间镂空的部分正好用来显示下面图层的内容。


Flash 8

动态蒙板

如果让静止的形状运动起来,就生成了动态蒙板

【例12-5】制作动感欢迎牌

知识点:制作运动补间动画,制作蒙板动画

源文件见配书光盘第12章“welcome.fla”


Flash 8

制作步骤

(1)准备图层。

文件尺寸为600×200。背景色为红色。

准备两个图层,分别命名为mask和flowers。

(2)准备蒙板。

选中mask图层的关键帧,在舞台上输入“欢迎新同学”,字体隶书,字号96(最大号)。在变形面板中将文字尺寸再调整为120%,然后将文字调整到舞台中央。

(3)准备鲜花。

选中flowers图层,导入一幅鲜花图片到舞台。


Flash 8

(4)制作补间动画。

选中鲜花图片,将其转换为影片剪辑floweres。在flowers图层的第20、40、60和80帧处插入关键帧。

将第20、60关键帧上的鲜花影片剪辑向右、向下移动一段距离;

将第40关键帧上的鲜花影片剪辑向下移动一段距离;

将第80关键帧上的鲜花影片剪辑调整到与第1帧相同的位置。

在各关键帧段间设置补间为运动。

(5)制作补间动画。

将mask图层设置为遮罩层,测试动画,鲜花在欢迎文字后晃动,在欢迎新同学。


Flash 8

动态蒙板

【例12-6】制作“手电筒灯光”效果

知识点:制作运动补间动画,制作蒙板动画

源文件见配书光盘第12章“FlashLight.fla”。


Flash 8

制作步骤

(1)准备图层。

文件为尺寸为550×200。将文档背景色设为黑色。

准备三个图层,从上到下依次命名为mask、light和shadow。

(2)准备蒙板。

选中图层mask第1帧,选择文字工具,字体选为Impact,字号为96,颜色为#CCCCCC,输入文字“FLASH”,并将文字调整到舞台中心。

(3)准备阴影。

选中图层shadow第1帧,将图层mask舞台上的文字原位粘贴到图层shadow的第1帧舞台上,将颜色改为#333333。


Flash 8

(4)准备手电筒灯光。

选中图层light第1帧,用椭圆工具画一个无笔触颜色、黑白放射渐变填充色的正圆。打开混色器面板,将黑色调整为#999999(中灰色,为了模仿灯光中心的暗点),然后对调左右油漆桶的位置,即灰色在中间。最后将圆形转换为影片剪辑。

在图层light的第20和第40帧处插入关键帧,将第20帧舞台上的圆形影片剪辑移动到文字的右边,然后将第1~19和第20~39帧处设置运动补间。

(5)设置遮罩层。

将图层mask设置为遮罩层。


Flash 8

复杂的动画蒙板

利用动画剪辑以及多个被遮罩层,可以制作出更加神奇的动画效果


Flash 8

复杂的动画蒙板

【例12-7】制作放大镜

知识点:设置蒙板,制作运动补间动画,笔触颜色应用渐变色,变形菜单的水平翻转命令,分离文字

源文件见配书光盘第12章“MagnifyingGlass.fla”


Flash 8

制作步骤

(1)制作放大镜镜片。

① 在新建的文件中新建一个影片剪辑mag。

② 在mag编辑窗口的当前舞台上画一个无笔触颜色正圆,填充色选为放射性渐变。

③ 编辑放射性渐变,在渐变色编辑条上,将右边的油漆桶的黑色改为灰色(#CCCCCC),在靠近左边白色油漆桶处单击一下,添加一个油漆桶,然后将其拖到中间偏右的位置。

将左边白色油漆桶颜色的Alpha值调整为0%,中间的油漆桶颜色的Alpha值调整为20%。右边油漆桶的Alpha值保持100%不变。


Flash 8

(2)制作放大镜镜框。

仍然在mag编辑窗口,选择椭圆工具,将填充色选为无色,笔触颜色选择放射性渐变色,笔触高度选为20。在混色器面板的渐变色编辑条上,将右边油漆桶颜色调整为灰色(#666666),在右边油漆桶附近再增加两个油漆桶,将两个油漆桶的颜色值分别调整为白色和灰色。

(3)制作放大镜手柄。

仍然在mag编辑窗口,插入一个图层,将新图层拖到原有图层的下面。

选择直线工具,笔触高度选为40,颜色选为线性渐变色,在舞台上拉出一条线段,调整其到合适位置。


Flash 8

(4)准备文字。

回到主场景,将当前图层改名为text。在当前的舞台上输入一段文字。将文字两次分离,使文字成为形状,将其转换为影片剪辑text。

(5)准备放大的文字。

在text图层的上面插入一个新图层bigtext 。将库中的text影片剪辑拖到舞台上。

用变形面板将文字影片剪辑调整为150%,然后调整与舞台水平、垂直居中对齐。

(6)准备蒙板。

在图层bigtext的上面插入一个新图层mask 。

在mask图层舞台上画一个与放大镜片相同大小的圆并转换为影片剪辑mask。


Flash 8

(7)制作蒙板补间动画。

在时间轴的20、22和45帧处插入关键帧。

将各帧上的蒙板影片剪辑移动到相应位置,然后将各关键帧设置为运动补间,以便模仿放大镜移动的效果。

(8)制作放大镜补间动画。

① 在图层mask的上方插入一个新图层magGlass。将库中的放大镜影片剪辑mag拖到当前图层舞台,将其调整到镜片与蒙板重叠的位置。

② 在magGlass图层的时间轴的20、22和45帧处插入关键帧,调整各帧上的影片剪辑位置,制作与蒙板补间动画相同的运动补间动画。

(9)设置遮罩层。

选中mask图层,将其设置为遮罩层。


Flash 8

蒙板实例

【例12-8】制作水波纹效果

知识点:与混合效果结合制作蒙板动画,用分离形状制作环形图形,用黑箭头工具调整形状,复制图层,制作不可见按钮,制作形状补间动画

源文件见WaveOnCar_ shape.fla


Flash 8

制作步骤(略)


Flash 8

调整环形


Flash 8

蒙板实例

【例12-9】制作神奇的蒙板

知识点:制作形状补间动画、蒙板动画,用分割图片制作环形图案,使用变形面板


Flash 8

制作步骤

(1)新建一个文件,将图层1改名为“bigpic”,导入一张比舞台尺寸稍微大一些的图片,尺寸的大小最好符合如下公式:图片尺寸×90%=舞台尺寸(Flash文档尺寸)。

(2)在图层1的上面添加一个图层,用矩形工具画一个无边框的矩形条,长度要大于舞台的宽度。复制出若干个矩形条,均匀分布于舞台。

(3)在第20帧插入关键帧,将舞台上的矩形组用变形工具旋转90°,宽度适当放大,使其覆盖住舞台的两边。


Flash 8

(4)在第40帧插入关键帧,将第1帧的图形原位粘贴到第40帧。

(5)在第60帧插入空白关键帧,画几个同心椭圆环。

(6)在第80帧插入关键帧,将第1帧上的图形原位粘贴到第80帧。

(7)将各个关键帧之间设置形状渐变。


Flash 8

(8)添加一个图层,将其拖到所有图层的下面,将该层设为普通层。将库中的位图拖到新图层的舞台上,居中对齐,将图片缩小为90%。


Flash 8

蒙板实例

【例12-10】制作图片切换效果

知识点:制作蒙板动画,制作运动补间动画


Flash 8

制作步骤

(1)准备3张图片,尺寸均为800×600。

① 新建一个文件,将准备好的3张图片导入到文件的库中。

② 将当前图层命名为picture1。在picture1图层的上方插入一个新图层,将其命名为picture2。

③ 在picture1和picture2图层的第31帧处插入1个关键帧,在第60帧处插入1个普通帧。将第1张和第2张图片分别拖到picture1图层第1帧和第31帧的舞台上,将第2张和第3张图片分别拖到picture2图层第1帧和第31帧的舞台上,并将这些图片与舞台左上角对齐。

④ 将文档尺寸调整为与内容匹配。


Flash 8

(2)制作蒙板一。

① 在picture2图层的上方插入一个新图层mask。

选中mask图层第1帧,在舞台上用矩形工具绘制一个无笔触颜色(填充色任意)、尺寸为800×100的矩形,将矩形与舞台左上角对齐。然后将其转换为影片剪辑mask1。

② 在mask1编辑窗口,插入5个图层,将当前图层的第1帧,复制到该5个图层的第1帧。

③ 选中图层2舞台上的矩形,向下移动100个像素,使其位于与图层2矩形向下相邻的位置。

④ 用同样的方法,将矩形复制到其他4个新图层的关键帧舞台上,并将矩形向下移动,使所有矩形覆盖住舞台上的图片。


Flash 8

(3)制作蒙板一动画。

① 在各个图层时间轴的第10帧处插入关键帧。

② 选中图层1的第1个关键帧,将矩形移动到舞台的左边外面。然后为第1~9帧设置形状补间。

③ 用同样方法为图层3和图层5制作矩形由左向右移动的形状补间动画。

④ 再选中图层2的第1个关键帧,将矩形移动到舞台右边外面。然后为第1~9帧设置形状补间。


Flash 8

⑤ 用同样方法为图层4和图层6制作矩形由右向左移动的形状补间动画。

这里,奇数图层上的矩形是由左向右移动到舞台中央,而偶数图层上的矩形是由右向左移动的。

⑥ 为了使蒙板动画更富有变化,可以将各图层第1帧上的矩形移动到不同位置,使得矩形以不同速度移动到舞台中央。

⑦ 最后在影片剪辑mask1中插入一个图层并在最后一帧添加stop();命令。


Flash 8

(4)制作蒙板二动画。

① 选中主场景mask图层的第31关键帧,画一个正圆,并将其转换为影片剪辑mask2。

② 在影片剪辑mask2编辑窗口,在当前图层的第10帧插入关键帧。将第10帧舞台上的圆的直径调整为350,将第1帧上的圆调整为15。为第1帧设置形状补间。

③ 再插入若干个图层,制作相同的形状补间动画,并调整各图层第1帧和第10帧舞台上圆的位置,使所有第10帧上的圆覆盖舞台背景中的图片。

④ 最后在影片剪辑mask2中插入一个图层并在最后一帧添加stop();命令。


Flash 8

蒙板实例

【例12-11】制作一个旋转的地球

知识点:用套索工具的魔术棒处理位图,使用标尺、辅助线,无限连续播放的图片的定位和播放,制作双面球,制作蒙板动画、运动补间动画


Flash 8

制作步骤

(1)新建一个背景色为蓝色的文件,新建一个影片剪辑元件“ball”,将ball的图层1改名为“left2right”,将准备好的地图图片导入到left2right图层的第1帧。

(2)将地图图片分离。

选择套索工具→魔术棒工具,在地图的白颜色背景色区域单击一下,按删除键将地图的背景色删除,依次单击白色区域,将所有背景色都删除。

(3)删除掉背景色后,选择黄色填充色将地图填充为黄色。


Flash 8

(4)选中地图并将其组合成组。将地图复制、移动到原来地图的左边,使两个地图相连,然后选中两个地图图形,再次复制,调整好4张地图各自的位置,使4张图连接在一起。将4张地图全部选中,转换为图形元件“maps”。


Flash 8

(5)在left2right图层的第30帧插入关键帧,将第30帧处的图片向右移动。可以借助于辅助线确定移动的最终位置。

方法:在第1帧将辅助线对齐图中的一点,比如最右边地图东、西半球的中间位置,将第30帧的图片移动到最左边的地图东、西半球的中间位置与辅助线相重叠的位置。为了保证精确对齐图片,可以在第29、30帧处反复拖动播放头,检查是否有图片晃动的感觉,如果没有,说明两个关键帧上的图片已经精确地定位在正确的位置了。

定位好图片后,在两个关键帧之间设置运动渐变


Flash 8

(6)left2right图层的上方添加一个新图层,命名为“ball1”,在ball1图层的第1帧画一个无笔触颜色、填充色为黑白放射性渐变色的球,其高度应该与地图高度一致。

将ball1图层设置为遮罩层。这是地球转动的正面所显示的效果。


Flash 8

(7)填加两个图层,分别命名为“ball2”和“right2left”,将right2left拖到left2right的下面,将ball2拖到right2left的下面。

将ball1图层的球复制并原位粘贴到ball2图层。将left2right图层第30帧上的maps元件复制并原位粘贴到right2left图层的第1帧,再将其水平翻转。在right2left图层的第30帧插入关键帧,将第30帧上的图形向左移动,用第5步的方法将第30帧的maps元件定位,并设置运动渐变。


Flash 8

(8)将图层right2left设置为遮罩层。这是地球的背面所显示的效果。


Flash 8

(9)添加两个新图层,命名为“light1”、“light2”,在两个图层上运用制作彩色球的方法,制作一个水晶球。


Flash 8

(10)将图层light1(即放置正面着光球的图层)拖到所有图层的上面,将light2图层(即放置反光球的图层)拖到所有图层的下面。利用属性面板,调整light1和light2图层上的球的尺寸和位置,大小与ball1图层上的球相等,位置对齐ball1图层上的球。

下面是调整水晶球与ball1图层上的球的方法:

① 选中ball1图层的球,打开属性面板,记下它的宽度、高度、x、y的值。

② 选中light1图层的水晶球,在属性面板中的宽度、高度、x、y各个数据框中填入刚刚记下的数据,输入完数据后按回车键,对象自动按照属性面板上的值确定对象的位置和尺寸。

用同样的方法将light2图层上的水晶球设置好。

(11)回到场景1,将ball影片剪辑拖到舞台上。


Flash 8

实训11

  • 模仿例12-7,制作一个望远镜的效果。

  • 设计制作一个利用几何形状的形变动画作蒙板的动画。

  • 利用蒙板技术制作一个老电影倒计时动画,


  • Login