Flash AS3.0打造漂亮的水汶实例教程
作者 佚名技术
来源 服务器技术
浏览
发布时间 2012-07-07
AS3.0 实例教程之水汶效果 在这个教程中,我们将用到置换图滤镜(DisplacementMapFilter)和BitmapData类的的杂点功能(perlinNoise),这两个家伙常常给我们带一些令人兴奋的效果,它们今天的合作为我们创造了一个漂亮的的水汶,看看下面的动画,应该还不错吧。 现在我开始来构建这个漂亮的水汶: 即然是水汶,我想首先要找一张含水的图片吧,百度一下吧,河道,湖泊,水池,你喜欢就行。 1. 新建一AS3.0文档,将帧频设为30,将你刚百度到的图片导入到库中,点右键,在属性面板中将“使用JPEG导入品质”前的钩钩去掉,这样做图片的体积就会大大地减小哦。 2. 新建一个影片剪辑元件,将图片拖到舞台上,设置图片的大小,你想设多大呢?反正我是按默认的550x400.图片在大小与文档大小一样大哈。点击对齐面板,相对于舞台居中对齐。 3. 回到主场景,将MC拖到舞台上,居中放置,为它设置一个实例名称,我用的是”pic”图层上锁。 4. 新插入一图层,将图片(注意是图片不是MC哈),拖到舞台上,打开对齐面板,宽高匹配,居中对齐。现在第1,2层的图像是完全重合的,请确认是这样的。选择图片,点击 修改>分离,将水面部分选出,删除。可以将第1层隐藏,看看删除后的效果。 如下图: 5. 新建一层用来写代码,打开动作面板,输入下列代码: 1. var bmp:BitmapData = new BitmapData(550,400); 2. var zh:DisplacementMapFilter = new DisplacementMapFilter(bmp,new Point(0,0),1,2,10,600); 3. var p1:Point = new Point(); 4. var p2:Point = new Point(); 5. var zdxg:Array = [p1,p2]; 6. addEventListener(Event.ENTER_FRAME ,ld); 7. function ld(e:Event):void { 8. zdxg[0].x += 0.2; 9. zdxg[1].y += 0.1; 10. bmp.perlinNoise(168,5,2,4,true,true,2,true,zdxg); 11. pic.filters = [zh]; 12. } OK,测试影片,一个漂亮的水汶效果立即出现在你的眼前。 代码分析: 首先声明了一个与图片一样大的BitmapData类实例bmp,用来作为置换图滤镜的参数。 var bmp:BitmapData = new BitmapData(550,400); 然后声明一个置换图滤镜zh,将bmp作为参数。 var zh:DisplacementMapFilter = new DisplacementMapFilter(bmp,new Point(0,0),1,2,10,600); 接下来声明了两个点,并将这两个点放到到一个叫zdxg的数组中,这个数组将用于bmp产生杂点的参数。 var p1:Point = new Point(); var p2:Point = new Point(); var zdxg:Array = [p1,p2]; 然后,在ENTER_FRAME事件中调用ld函数。 addEventListener(Event.ENTER_FRAME ,ld); ld函数,动态改变两个点的位置,然后使bmp应用杂点功能,在每一帧的间隔产生不同的杂点效果,使置换滤镜效果产生变化,最后让影片剪辑pic,应用滤镜,实现水汶效果。 function ld(e:Event):void { zdxg[0].x += 0.2; zdxg[1].y += 0.1; bmp.perlinNoise(168,5,2,4,true,true,2,true,zdxg); pic.filters = [zh]; } 关键词: |
凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务,公司网站:http://www.lingzhong.cn 为了给广大客户了解更多的技术信息,本技术文章收集来源于网络,凌众科技尊重文章作者的版权,如果有涉及你的版权有必要删除你的文章,请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息,谢谢! |
你可能对下面的文章感兴趣
关于Flash AS3.0打造漂亮的水汶实例教程的所有评论