2022年flash制作红旗的教程

1、两种方法方法一：本例综合利用形状补间、动作补间、引导路径、遮罩 等多种动画形式,模拟制作出五星红旗飘动的成效；1、创建 Flash 文档,场景设置保持默认；2、执行 “插入 新建元件 ”命令,做如图 1 所示设置：3、用矩形工具绘制无笔触色,填充色为红色,宽、高比例为 1： 1.5 的矩形,如图 2 所示,并用选择工具将该矩形调成图 3 状：4、复制该图形,并执行 “修改变形垂直反转 ”命令,置于 其右：5、将该图 4 再次复制出一个,并通过对齐面板将其水平中齐和垂直中齐,如图 5 所示：6、选择墨水瓶工具,笔触色任意,在该图形边缘点一下,将 两边及底部的线条删除,选中上边的边线,右键 剪切,

2、点选 按钮, 插入一引导线图层,选中该图层 ,在舞台任意处右键 粘贴到当前位 垂直中齐 ” ,20 帧处插入帧,如图 6 所示：置,用对齐面板将其 “左对齐 “和7、选中图层 1 的图形,右键转换为元件,将其转换为名为 “红 旗”的图形元件,双击该元件,在其编辑区,用对齐面板,将其“水 平中齐 ”和 “垂直中齐 ” ；8、回到名为 “旗帜 ”的影片剪辑元件编辑区,在第 1 帧处用任 意变形工具将中心点移至元件的中心处,并将该图形元件的中心点吸入关键帧,将其水平向右移动,如图 7、图 8 所示：附到引导线上, 20 帧插9、选中引导线图层,插入图层绘制方法：3,在图 层 3 第 1 帧,绘制一黄

3、色五角星；选择多角星形工具,点击属性面板的选按钮,在弹出的对话框中做如图9 的设置：10、将拉出的五角星放置在如图 10 所示的位置：11、右键该五角星,将其转换为图形元件,双击该元件,进入 该元件编辑区,复制出一个星,将其改小,再复制出另外三个小星,摆放好位置,如图 11 所示：12、回到影片剪辑 “旗帜 ”编辑区,选中星元件,选择任意变形工具,将元件编辑中心置于左中处,如图12 所示：13、第 1 帧处依据旗帜形状调整星的角度和宽度,第 7 帧、第 14 帧和第 20 帧插入关键帧,分别在第 7 帧和第 14 帧处再将星的形状和 宽度做适当调整,然后选中该图层,属性中创建补间动画,如图13

4、、 图 14 和图 15 所示14、创建名为 “遮罩红旗 ”的影片剪辑元件,在该编辑区,图 层 1 的第 1 帧处从库中拖出名为 “旗帜 ”的影片剪辑元件 ,用对齐面板将其左对齐和上对齐,40 帧处插入帧；15、插入图层 2,用矩形工具绘制一无笔触色,填充色任意、宽 是旗帜元件的二分之一,高度要高于 “旗帜”元件的矩形,置于如图 15 所示的位置：16、 第 1 帧处用选择工具将该矩形形状做些转变,如图 16 所示：17、20 帧和 40 帧处插入关键帧 ,并在 20 帧处将矩形再次调 所示：整形状,如图 17 18、选中图层2,属性中创建形状补间动画,并右键图层2,选 择“遮罩层 ” ；“遮

5、 罩红旗 ” ,置于旗19、回到主场景,绘制一旗杆,从库中拖出影片剪辑元件杆上方,如图18 所示：OK！测试,存盘！方法二：1、新建 Flash 文档,场景大小可依据需要设置,本例的宽、高均设置为300 像素；帧聘设置为24 像素；进入该2、执行 “插入 新建元件 ”命令,创建名为 “五星红旗 ”的影片剪辑元件；元件编辑区后,再插入三个图层,并做如图1 的名更名：3、选中底图图层的第 1 帧,用矩形工具,绘制一个无笔触色,填充色为红 色,宽、高为 250 170 像素的矩形 ,对齐面板中设置 “左对齐 ”和“上对齐 ” , 如图 2：4、将该矩形复制、粘贴到 “阴影 ”图层,并锁定该图层；5、

6、回到底图图层,用选择工具调整形状,分别在20 帧和 40 帧插入关键帧,在 20 帧再次调整形状,如图3、图 4 所示：5、选中该图层,属性中创建“形状补间 ” ；6、再次选中该图层,将鼠标放在被选中的时间帧上,右间“复制帧 ” ,选 中“遮罩层 ”图层的第 1 帧,右键 “粘贴帧 ” ,锁定这两个图层；7、将 “阴影 ”图层解锁,（为便利操作,可将底图和遮罩两个图层隐匿）打开混 色 器 面 板,填 充 色 选 择 线 性,做8、右键该图,选择 “转换为元件 ” ,将其转换名为 “阴影 ”的影片剪辑元件；双击 如图 7 该元件,进入其编辑区,第1 帧处用填充变形工具,将渐变色调整至状：9、在

7、40 处帧插入关键帧,并用填充变形工具将其调整至如图 8 状：10、将播放头放在第1 帧至 40 帧中间的任意处,属性中创建“形状补间 ” ；11、回到 “五星红旗 ”元件编辑区,选中 “阴影 ”元件,属性中将 Alpha 值改为 20%；12、选中 “遮罩层 ”图层,右键,选择 “遮罩层 ” ；13、将编辑好的三个图层锁定；选中“五角星 ”图层的第 1 帧,用多 角星形工具绘制无笔触色,填充色为黄色的五颗星,调整大小和角度（大 星为 56.5 53.9,小星为 16.9 16.1 ）,摆放位置如图 9 所示 : 14、在 40 帧处插入帧；15、执行 “插入 新建元件 ”命令,创建名为 “红

8、旗 ”的影片剪辑元 件,进入该元件编辑区,图层 1 第 1 帧,选用矩形工具,绘制一个无填充 色,笔触颜色为任意色,宽、高为 275 240 的矩形,并在混色器中将笔 触颜色的 Alpha 值修改为 0%；对齐面板中选择 “左对齐 ”和“上对齐 ” ；16、插入图层 2,从库中拖出名为 “五星红旗 ”的影片剪辑元件；属 性中将 x 坐标值修改为 0,y 坐标值修改为 34；17、创建名为 “ ramp”的影片剪辑元 件,在该元件编辑区 ,用矩形工具绘制无笔 触色, 填充色做如图 10 设置, 宽、 高为 275 240 矩形,对齐面板中选择 “上对齐 ”和 “左对齐 ” ,如图 11：18、

9、创建名为 “ dis ” 的影片剪辑元件,在该元件编辑区,将名为 “ ramp”的影片剪辑元件拖入,属性中给该元件取实例名为 ramp ,并用对齐面板 其“左对齐”和“上对齐 ” ；19、回到主场景,新插入三个图层,并分别更名为如图 12 所示：20、在 bg 图层绘制或插入一个背景图；21、在 displace 图层,从库中拖入名为 “ dis ”的影片剪辑元件,放在适当位置,并在属性中取实例名为 displace_mc ；22、在 flag 图层从库中拖入名为 “红旗 ”的影片剪辑元件,并在属性中取实例名为 flag_mc ,放在和 “ displace_mc ”相同位置；23、选中 ac

10、tions 图层第 1 帧,动作面板中输入如下语句：Stage.scaleMode = noScale; displace_mc.createEmptyMovieClipperlin, 1; var ramp:MovieClip = displace_mc.ramp; ramp.swapDepths2; var speed = 8; var channel = 1; var flapX = 50; var flapY = 100; var mode = clamp; var offset = new flash.geom.Point0, 0; var displaceBitmap:flash.

11、display.BitmapData = = new flash.display.BitmapDataramp._width, ramp._height; new var displaceFilter:flash.filters.DisplacementMapFilter flash.filters.DisplacementMapFilterdisplaceBitmap, offset, channel, channel, flapX, flapY, mode; var baseX = 80; var baseY = 0; var octs = 1; var seed = Math.floor

12、Math.random*50; var stitch = true; var fractal = true; var gray = false; var noiseBitmap:flash.display.BitmapData = new flash.display.BitmapData500, 1; noiseBitmap.perlinNoisebaseX, gray; baseY, octs, seed, stitch, fractal, channel, var shift:flash.geom.Matrix = new flash.geom.Matrix; onEnterFrame =

13、 function shift.translatespeed, 0; with displace_mc.perlin clear; beginBitmapFillnoiseBitmap, shift; moveTo0, 0; lineToramp._width, 0; lineToramp._width, ramp._height; lineTo0, ramp._height; lineTo0, 0; endFill; displaceBitmap.drawdisplace_mc; flag_mc.filters = displaceFilter; ; onMouseDown = functi

14、on displace_mc._visible = true; flag_mc._visible = false; ; onMouseUp = function 制作飘动的五星红旗displace_mc._visible = false; flag_mc._visible = true; ; onMouseUp; 测试,存盘为语句添加的注释：本实例使用名为 perlin noise 的方法, perlin noise 用于在一个做为 旗帜影片剪辑的置换图内创建数个随机波,即使用随机杂点的像素填充图像,使该旗帜看上去就像真的在飘动一样；注： perlin noise 又叫做 gradient n

15、oise, 是科学家 Ken Perlin 在 1983 年独立争论出来的一种图象噪声（有的译作“柏 林噪音 ” ,也有的译作 “培林乱数 ” ）,即通过一组特定的点（例如模型顶点 ,象素地址等 生成相应的随机变量；/在 displace_mc 中创建一个实例名为 辑,以绘制 perlin noise perlin 的空影片剪displace_mc.createEmptyMovieClipperlin, 1; /变量 ramp 斜面）是已存在于 该影片剪辑用于设置旗帜由左至右displace_mc 中的影片剪辑,perlin noise 的缓动成效var ramp:MovieClip = di

16、splace_mc.ramp; ramp.swapDepths2; /将 ramp 置于 perlin noise 上 /*50% 的红色在置换图内并非被置换了,当连续向右/移动时 ramp 由 50% 到透亮,使 制作飘动的五星红旗 15 / 全局变量 var speed = 8; /noise 以此速度提升（引起飘动）var channel = 1; /红色 - 红色用于置换图素 /置换变量 var flapX = 50; /沿 X 轴置换图素的幂 var flapY = 100; /沿 Y 轴置换图素的幂 var mode = clamp; /锁定图象,使源图不行见perlin nois

17、e 仍可看到/影片剪辑旗帜内有一不行见的边界,用于给定延长超越旗 帜边界的范畴var offset = new flash.geom.Point0, 0; /置换图偏移量/为置换物创建包含置换斜面大小在内的位图数据对象,并 应用该对象的置换滤镜var displaceBitmap:flash.display.BitmapData = new flash.display.BitmapDataramp._width, ramp._height; var displaceFilter:flash.filters.DisplacementMapFilter = new 制作飘动的五星红旗16 flas

18、h.filters.DisplacementMapFilterdisplaceBitmap, offset, channel, channel, flapX, flapY, mode; /PERLINNOISE 变量 var baseX = 80; /x 轴 noise 的大小 var baseY = 0; /y 轴 noise 的大小 var octs = 1; /用于 noise 的 noise 函数var seed = Math.floorMath.random*50; /用于 noise 的随机速度 var stitch = true; /通过修正来遮挡 noise 以使其易于循环 v

19、ar fractal = true; /使用不规章碎片形的 noise var gray = false; /由于有红色通道而不使用灰色区域/为 noise 创建位图数据对象并应用perlinNoise. 由于是沿y 轴循环 ,因此只需1 象素高 .其长度取决于产生noise 的变形 . 借助于修正而开头梯度的填充,就可使 noise 作连续的环状运动 . var noiseBitmap:flash.display.BitmapData = new flash.display.BitmapData500, 1; 制作飘动的五星红旗17 noiseBitmap.perlinNoisebaseX, baseY, octs, seed, stitch, fractal, channel, gray; /由于 noise 只被创建一次并仅仅为旗帜成效作环状运动而 使用了开头位图填充 ,变换的矩阵就可使 noise 连续地运动 . var shift:flash.geom.Matrix = new flash.geom.Matrix; /