Flash实用技巧:动感星形遮罩

动感|技巧

  本例的这个效果做起来就比较简单,我们只需要做的是把两个图片放在不同的图层,然后,上面的图片做一遮罩层,遮罩层最终能覆盖上面整个图片,图像切换完成了。

    具体做法如下:

    1.新建一FLASH文档,创建三个图层。

    2.导入两个图片(最好大小一样),分别放在下面的两个图层,让上面图片刚好能覆盖下面的图片。

    3.在第三层里画一小正方形,转换为元件MC,命名为MASKFIELD,实例名一样。

    4.双击MASKFIELD,进入编辑状态,让元件的原点跟正方形的左上顶点重合。

    5.把正方形转为MC,命名为MASK,实例名一样。

    6.双击MASK,进入编辑状态,让元件的原点跟正方形的左上顶点重合。

    7.在正方形所在图层的第十五帧(帧数可以自己把握)插入一关键帧,然后,对第一帧的正方形进行一些变形(这可以发挥你们的创意与想象力,不过对初学者来说,建议该帧的图形不要完全盖住原来的正方形,否则可能会看不到效果。

    8.在第一帧与第十五帧之间创建形状补间动画,在第十五帧添加AS:stop();

    9.回到主场景,把MASKFIELD所在的图层设为遮罩层。

    10.测试影片,现在可以看到下面图像有一部分被切换成上面的图象了。所以,下一步,就是要复制多个MASK,以实现整个图像最终被切换的效果。

   11.关闭测试窗口,继续做。

    12.我们看到,正方形出现的先后顺序没什么规律,这是因为笔者用了随机函数。所以,再插入一图层,写定义随机变量的代码。又因为这是个二维空间,所以最好定义二维数组。

    13.假设正方形的边长为25,图像为400*300,则加代码:

var maxhor=400/25
var maxver=300/25
//这里没采用变量,是防止形变过程影响宽度和高度.
var order=new Array();
for(var hor=0;hor<=maxhor-1;hor++){
  order[hor]=new Array();
  for(var ver =0;ver<=maxver-1;ver++){
    order[hor][ver]=maxver*hor+ver
   }
}//首先对每个方格设置一个索引,用它来控制出场顺序.
//但是该出场顺序是从上到下,从左到右有序出来的,所以要再定义一个随机数组.
for(var hor=0;hor<=maxhor-1;hor++){
 for(var ver=0;ver<=maxver-1;ver++){
  tempvalue=order[hor][ver]
  randhor=random(maxhor)
  randver=random(maxver)
  order[hor][ver]=order[randhor][randver]
  order[randhor][randver]=tempvalue
 }
}
//这是常用的产生随机数组的算法,是一套相对固定的模式.至于打乱顺序的原理如何,自己测试一下就可以体会出来.
//下面定义一个控制出场的最终数组INDEX,利用前面的随机数组来生成.
var index=new Array()
for(var hor=0;hor<=maxhor-1;hor++){
 for(var ver=0;ver<=maxver-1;ver++){
        index[order[hor][ver]]=hor+"_"+ver
  
 }
}

时间: 2024-10-02 07:05:16

Flash实用技巧:动感星形遮罩的相关文章

动感星形遮罩-通过遮罩的形状改变而实现的图片切换

动感|形状 这个做起来就比较简单,我们只需要做的是把两个图片放在不同的图层,然后,上面的图片做一遮罩层,遮罩层最终能覆盖上面整个图片.图像切换完成了.这个比较简单,我们只要三个图层就能解决问题.两层图像,上面再加一个遮罩上面图形(就是切换后的图形)的遮罩层.效果实例: 具体做法如下:1.新建一FLASH文档.创建三个图层.2.导入两个图片(最好大小一样),分别放在下面的两个图层.让上面图片刚好能覆盖下面的图片.3.在第三层里画一小正方形,转换为元件MC,命名为MASKFIELD,实例名一样.4.

FLASH实用技巧之太阳系制造

技巧     太阳系效果主要是通过引导线.遮罩技术来实现的,其中使用到洋葱皮命令,渐变运动的使用方法及一些常用设计技巧.这些设计方法与技巧对大家以后设计自己的Flash作品会大有帮助的.就实例本身而言也是很有实用价值的. 演示效果: 点击这里下载源代码 设计步骤:     实例场景的大小为600px×200px,背景为黑色.帧频在10-20fps之间,以播放效果流畅为准.     一.制作地球     1. 按快捷键Ctrl+F8打开"创建新元件"面板,创建一个名为"地图&q

制作Flash动画技巧之遮罩效果解析

flash动画|技巧 一.最近无意中发现了这一效果,以前也曾经看到多次,却没有在意,以为原理就是这么简单,最近发现,其实不是想像的那么简单呦,原来事情换一种角度来看会发现有不一样的收获. 1.  新建一文件黑色背景,在图层1中画几条线,转换成元件1, 2.  再新建图层2,画一个白色放射状圆形转成元件2,再创建一段补间动画.让小球动起来. 3.  选中图层1,右键单击出现菜单,选择"遮罩层". 现在发布一下影片,看看效果-- 发现屏幕一片黑,没有出现任何东西! 难道是做错了吗?原因是什

《众妙之门——网站UI设计之道(修订版)》一1.3 制作有效用户界面的实用技巧

1.3 制作有效用户界面的实用技巧 我们已经讨论过什么是用户界面,用户界面应该具备什么样的特点,以及我们可以使用的构建用户界面的工具,现在让我们看一些可以应用在你的网络应用或网站上的实用技术. 1.3.1 使用空白来构建联系 空白指在各种内容元素之间的空白区域,比如标题.正文和按钮.当在不同元素间建立联系时,空白是一个非常重要的工具.通过缩小元素之间的空白,能够把一些相关的项目组成一组.增加这些分组之间的空白能够更加强调这些分组与其他内容之间的联系.使用空白,我们可以分组相关的控件,也可以构建页

谷歌浏览器你不知道的5个实用技巧

对于一款浏览器软件来说,能够快速.安全.稳定的浏览网页自然是最重要的,正如Chrome浏览器在介绍中所描述的一般.不过,如果这样你就满足了,那就太没追求了,别看Chrome浏览器的界面非常简洁,它可以实现的功能可远不止那么简单. 连邦免费下载 谷歌浏览器你不知道的五个实用技巧 Chrome浏览器自动更新 使用最新版的Chrome浏览器可以获得最稳定的浏览体验,所以及时升级就显得格外重要.由于Chrome浏览器的版本更新较快,人送外号"版本帝",所以很多用户都觉得用Chrome要经常下载

2345好压解压文件的几个实用技巧

  相信很多网友都非常熟悉2345好压的文件压缩跟压缩包解压功能,那您知道可以使用2345好压在文件压缩的过程中的一些使用技巧吗?比如说:一个大的压缩包内有很多文件,只需要解压其中的几个文件夹的时候,该怎么操作呢?一起来看看今天小编为大家整理的2345好压解压文件的几个实用技巧! 一:如何设置所有的压缩包都解压到指定目录: 电脑上的压缩包多如牛毛,每个压缩包解压后都会产生一个文件夹,何不让将这些压缩包都统一解压到一个目录下呢?其实这很容易,只要你打开好压主程序--工具--设置--"压缩标签栏&q

CSS实用技巧及常见问题

个人总结的一些css实用技巧及必须得注意的事项: 1.注释须知:html中注释不能这样写: 复制内容到剪贴板 代码: <div></div><!--------这是错误写法-------><div></div><!--=======这是正确写法========-->这种写法,FF中会忽略其下面的内容详见:http://www.bluebirdsky.cn/article.asp?id=153.2.CSS注释切记在/*之后及*/之前空一

Flash动画技巧:人侧面走路动画制作

flash动画|技巧 人的动作是复杂的,但却有规律可寻.人的走路的运动规律:出右脚甩动左臂(朝前),右臂同时朝后摆.上肢与下肢的运动方向正好相反.另外,人在走路动作过程中,头的高低也必然成波浪形运动.当迈开步子时,头顶就略低,当一脚着地,另一只脚提起朝前弯曲时,头就略高.由此以有前辈们总结了,人走路可以用五幅画组成一个完步. 附件: 走路图1 走动画01  走动画02  01  02  走动画03  03

Flash动画技巧之如何掌握引导层

flash动画|技巧     问题:作移动渐变动画的时候,使用了引导层.但是我的元件为什么没有按照引导线去运动,而是从开始帧的位置直接移动到结束帧的位置? 解决思路:      引导层的作用是限制元件的移动轨迹.如何来实现呢,我们必须把元件运动的开始帧放到引导线的一端,结束帧放到引导线的另一端,这样引导线才可以根据自身的形状来限制元件的移动.出现上述问题的朋友很多,其实原因很简单,就是在放置元件的过程中没有与引导线粘合,导致无法之作出效果. 具体步骤:      1.运行Flash MX 200