Flash遮罩特效的综合操练

特效

  关于Flash遮罩的教程很多了,这里结合作者的摸索过程及创意给大家尤其是初学者作一简单讲解。(相关文章:Flash 8:水的形成思路和方法

    一.原理部分--羽化的美眉效果

    flash的遮罩原理在于使用一个图形作为透过光线的区域,当这个图形所在层转为遮罩层时,图形区域下一层的物体可见,而图形区域外的物体不可见。但是再往下一层的物体仍然可见,也就是说,遮罩层只对它下面一层物体起作用。 

    好,下面就步入正题,介绍一个羽化美眉效果,这在photoshop中是很容易实现的。

    1.从图片库中找个漂亮的美眉,导入到舞台上,放在合适的位置,给当前层起个名字,如下图:

    2.新建一层,起名mask,在当前层上用圆形工具画一个树立着的椭圆,椭圆最好不要边框线,填充色任意,这个椭圆正好把美眉挡住,如下图:

    3.将此椭圆选定,按下Ctrl+c, 再新建一层,起名white, 按下Ctrl+shift+v, 这是将椭圆复制到这一层上来,并且与原来椭圆位置相同。

    4.点选mask层,右击将其转为遮罩层,关闭white层就可看到美眉被切割出来的效果,如果位置不满意,解除锁定,重新修改椭圆的位置。

    5.重新点选white层,并选定层上椭圆来修改其填充属性,这里才是最费功夫的环节:打开混色器面板,在填充颜色方式中选放射状,将两个色标的颜色都变成白色,将左边的色标的不透明度改为0,右边的不变, 两色标的位置如下图:

    6.色标设定完后,应该是下图这个样子

    在物体的空白处单击一下,看看美眉是不是露出来了,美眉的周围是不是以白色淡出呢?

    7.用填充变形工具来反复调整渐变色的区域与大小,这要费点事,效果好不好关键在这里。

    8.最后的效果应该是象这样

    二. 进阶部分--跟随鼠标的探照灯效果

    效果:

    有了上面的技术,那么制作一个探照灯效果就只剩下创意和代码编写工作了。具体的制作过程我就不在浪费时间了,估计大家看到我下面的解释及源文件就能理解并自己能作了。

    既然是探照灯效果就应该是黑色背景了,那么为了表现光照的模糊效果,就需要一个椭圆形区域,这个区域的中心是透明的,然后渐变到与背景相同的黑色。这是与上面的例子不同的地方,也算是拟向思维吧!

    1.先来看看层结构,如下图

    最上一层是这个效果需要的控制代码,下来一层是跟随鼠标的圆环,下来是圆环遮罩,下来是圆环经过时发亮的线条,再下来是发暗色的线条,鼠标没有经过时就显示这条线。

    这部分是别人早就做过的东西,这里加上是让大家对遮罩效果有个完整的认识。接下来就是我要重点讲的东西了,shadow层存放产生光照渐变效果的区域,就是上一段说到的东西,这个区域与作为遮罩层motion_mask上的motion_mask电影剪辑形状相同。pic层当然是放置用来照射的目标了。

    2.再看看符号库中的演员

    我有个习惯,就是符号的名字尽量和它所在层的名字一样,这样好知道哪一层是放的什么。还有就是尽量用英文尽量称呼准确,如果符号多的话要编号归类并放在一个能概括它们的文件夹里。这个作品的符号少,且和层名字对应,就不再解释了。需要解释的,一个是light符号,双击打开它仔细看就会发现,它的尖角正好在舞台的中心上,这是很关键的,因为要让它跟着鼠标转动而尾部不动,其原理就在这儿。

    另一个是shadow符号,双击进入会发现舞台上黑乎乎什么都看不见,单击图层1就会看见一个扇形网格出现,再将舞台颜色改个颜色,这下可以看清了,是个放射填充形状。选住这个形状,打开属性面板,点击油漆桶旁边的填充颜色,打开填充颜色面板,将鼠标移到面板左上角的矩形区域中,这个区域就是当前区域的填充方式及颜色,单击就会在混色器面板中看到这个填充方式。这里介绍这么详细是因为我原来怎么也不会调出新打开文件中形状的填充属性,实在是惭愧惭愧!当时修改这个填充方式费了不少时间,点击色标可以看到其值。

    3.再解释一下跟随鼠标所用的代码:

this.onEnterFrame = function() {
  if (_xmouse>620) {
    light._rotation = -60;
    //如果鼠标的x轴位置大于620,探照灯light就转-60度,light是探照灯的实例名
  } else if (_xmouse<80) {
    light._rotation = 30;
  } else {
  //如果鼠标是在80与620之间移动
  mask._xscale = (_xmouse-50)/4+70;
  //motion_mask层上的实例mask的宽度随鼠标的位置变化而变化,
  //所以的数字是我认为比较满意的,大家可以修改看看
  mask._yscale = (_xmouse-50)/4+70;
  //.........................的高度随...................
  shadow._xscale = (_xmouse-50)/4+70;
  //shadow层上的..................宽度..................
  shadow._yscale = (_xmouse-50)/4+70;
  //..............................高度.......................
  light._rotation = -(_xmouse-260)/6;
  //设置light的旋转角度,由鼠标的位置计算而来,
  //并将其范围缩小以求符合实际效果,不然就露陷儿了!
  mask._rotation = -(_xmouse-260)/6;
  shadow._rotation = -(_xmouse-260)/6;
 }
};
    circle和round上的代码就不再解释了,都是来跟随鼠标,贴在鼠标上的。

    三.结束语

    作了半天,这只能算是个小作品,而且也不漂亮,就送给那些和我当年一样开始学习flash的beginers吧!好的作品不仅要有对制作软件的熟练掌握,还要有自己的创意,有时将别人的东西改改,既是一种学习过程,又是一种创造,如果你美术功底好的话,再加上创作热情,初学者一定会变成有成就的闪客的。

    让我们一起成长吧!

时间: 2024-07-28 13:32:11

Flash遮罩特效的综合操练的相关文章

Flash遮罩特效实例精选--百叶窗效果

特效 百叶窗,在日常生活是经常能见到,电脑上的屏保大者有百叶窗效果,我们当然希望能用自己的武器设计自己的百叶窗效果,最终效果如图1所示: 图1 百叶窗效果 由上图可以看出,百叶窗主要使用了遮罩技术,当"百叶窗"被拉下时将打开将打开另一幅画面,具体操作步骤如下: 1.新建一影片,设置影片大小为300pxX300px(单位为像素),背景色为白色,当然设计者可以根据需要另行设置,同时将两幅准备好的图片导入到库中如图2所示: 图2 导入两幅图片 2.新建一图形元件"meng"

Flash遮罩特效实现精美图片过渡

其实本例所讲的重点并不是如何使用遮罩来完成一组图片的过渡,这样的例子太多了-. 本例重点是讲对----"对齐面板"的应用. 前些天在闪技区碰到一闪友问:如何通过复制---粘贴操作快速形成一个等间图形矩阵.那么应用FLASH中的对齐面板就可以.我不知道这位闪友这样作要干什么.但给了我一个思路-所以非常适用初级闪友的学习. Flash版本:flashMX 涉及内容: .对齐面板 遮罩 时间轴的安排等内容 适用范围: 初级 1.打开FLASH,按下ctrl+F8新建一个图符元件.取名为方块.

Flash遮罩制作图片切换特效

  让我们先看看效果: 第一步.打开Flash新建1个图层,用线条工具画一条竖直线,放在相对舞台的左面,第30帧处插入关键帧. 图1 第二步.点击第30帧把竖直线拉到舞台右面. 图2 第三步.点住任意一帧,在属性里面把补间改为形状. 图3 第四步.新建一个图层,和上面一样画一个竖直线,注意的是这次把竖直线从右到左放,然后在属性补间里面选择形状动画. 图4 第五步.新建图层,导入一张图片,相对舞台大小. 图5 第六步.新建图层,在第20帧处插入关键帧,导入一张图片,相对舞台大小,第30帧处插入帧.

用FLASH遮罩效果做图片切换效果

本教程是关于FLASH应用遮罩效果制作好看的图片切换效果.该教程选用FLASH遮罩中最简单的一种作为例子,当然你可以用自己的想象力来做出更多更好的图片动画.希望本教程能带你带来帮助. 让我们先看看效果: 第一步.打开Flash新建1个图层,用线条工具画一条竖直线,放在相对舞台的左面,第30帧处插入关键帧. 图1 第二步.点击第30帧把竖直线拉到舞台右面. 图2 第三步.点住任意一帧,在属性里面把补间改为形状. 图3 第四步.新建一个图层,和上面一样画一个竖直线,注意的是这次把竖直线从右到左放,然

用Flash动画特效制作:文字炸开

flash动画|特效 想必喜欢Flash制作的朋友一定对一些特殊的效果很感兴趣,今天跟大家一起分享下用 Flash6.0 制作"爆炸字体"的方法.其他版本方法和步骤类似. 最终效果: 第一步:打开 Flash6.0 软件→新建一个新的场景 , 然后点菜单栏"修改" →"文档属性" ,将其背景色设为黑色,点击确定. 第二步:按一下 Ctrl+F8, 新建一个元件,名称为 po, 行为为图像,点击确实. 第三步:在元件里用文本用工具输入个"

flash遮罩制作水波荡漾的文字效果

  今天小编为大家分享flash遮罩制作水波荡漾的文字效果,教程真的很不错,很值得大家学习,来看看吧! 遮罩,就好比将下面的图层遮上一块布,然后在这块布上挖出一个洞,露出下面的内容.有意思的是这个洞的形状完全由你设想,可以是形状.可以是线条.也可以是文字--可以是遮罩层的运动,也可以是被遮罩层在运动. 前面用脚本做过一个遮罩实例.这一次是遮罩图层在文字效果方面的应用.利用线性填充色块的运动,使文字产生水波荡漾的效果. 效果图为GIF图片,显示效果较粗糙. 方法/步骤 T键调出文字工具,属性面板中

如何使用Flash遮罩制作图片切换特效

  1.在Flash中新建1个图层,用线条工具画一条竖直线放在相对舞台的左面,第30帧处插入关键帧. 2.点击第30帧把竖直线拉到舞台右面,点住任意一帧,在属性里面把补间改为形状. 3.建一个图层,和上面一样画一个竖直线,这次把竖直线从右到左放,然后在属性补间里面选择形状动画.然后再新建图层,导入一张图片,相对舞台大小. 4.新建图层,在第20帧处插入关键帧,导入一张图片,相对舞台大小,第30帧处插入帧. 5.新建图层,第20帧处插入关键帧,用矩形工具画一个长方形的方块颜色任意,注意一定要和两个

Flash光特效综合分析

特效 在众多绚烂夺目的Flash效果中,最梦幻而神奇的效果应该算是光特效了.光特效是Flash中的终级境界--魔域,常见的有辉光.激光.投射线.集光束等等,这些光特效所带来的是极大的视觉冲击和动感享受.不过,很可惜的是,许多人始终无法掌握光特效的设计要素,或是以为只有通过ActionScript或者依赖别的软件才能完成这些特效.今天,笔者就带大家探索一下光特效的神奇奥秘!效果演示如下:   源文件下载 在Flash中,光亦可分为"点光源","线光源"和"面

Flash视觉特效实例之花样年华

特效    又是一年花落去,又是一岁花开时(呵呵,先感叹一下).本例是通过对遮罩元件进行编程,以及利用颜色技巧来实现一个"遮罩金属字"的效果,如效果图所示.该效果最值得读者学习的是如何用简单的程序使元件产生一定的运动速度.这也是这个简单实例拥有一定魅力的另一原因. 演示效果:(用鼠标移动可以看到动画效果) 点击这里下载源文件 制作步骤:     1.新建一个Flash文档,单击"属性"面板中的"尺寸"按钮,打开"文档属性"面板