利用三角函数实现精彩效果.docVIP

利用三角函数实现精彩效果 ( 2004-03-29 ) 作者： xfykzz 一、前言 运用三角函数完成FLASH效果早已有高手做过,而教程方面呢,看到zjs35大哥的椭圆方程后,我决定还是写点儿什么,因为三角函数实在是在FLASH效果中有神奇的作用,短短几行代码就能完成许多炫的效果. 本文将浅析一下如何运用三角函数,最后给出两个效果.其中一个我曾经在一个20行代码大赛中看到过,不过没有见过源文件.我给出的这个可以说是原创的. 二、函数解析 三角函数我们在初中就学过,特别是sin,cos,可以说是最常见的周期函数. 我们所用三角函数作效果,主要也就是这两个函数了. 其中sin函数的完整形式为： Y=A*sin(ψ+ω*x); ψ是相位,ω是角速度,ω=2Π/T,T是周期. 根据正弦函数的图像可以知道,X轴上的某一点是周期性地在平衡位置上下作简谐振动,振幅为A,就根据这一点知识我们就可以做出一个简单的弹性球: _x+=centerX+A*Math.sin((i++)*Math.PI/180); 我们进一步想,如果是一横行的小球(或竖行,小球也可以是别的什么),大家都以某一个正弦公式运动,这种周期性的运动岂不就是美的源泉吗? 各个小球之间不同的只是相位而已. 再进一步想,如果不单单是位置的改变,而是透明度,大小,颜色等属性都发生改变,这种大规模地周期性改变带来的不是一些很神奇的效果了吗? 有规律即是美,三角函数带来的正是它的这种规律性,周期性,只要我们掌握了它的最基本的部分,就可以发挥想象,造出更多的效果了!让我们还是先来看一个例子吧. 三、实例制作步骤 这个例子我们不是拿小球来说话了,因为并不只是小球才能使用三角函数,其它的也可以,比如说字体. 下面的这个字体效果就是充分运用了正弦函数公式,效果预览 可以看到,里面的代码非常简单,关键性的只有一句: _alpha=_xscale=_yscale=(100-_root.A)+_root.A*Math.sin(n+i*pi); 让我们从头讲起,相信讲完之后,您会对如何使用三角函数有进一步认识. 1.在主场景中新建一个动态文本,命名文本框为lab,当然,我还把要显示的字符串欢迎来到闪客帝国,我是xfykzz作为了嵌入字体.嵌入字体也是用AS完成字体效果的一个重要点,粗讲一下:字体属性右边有一个字符...按钮,点击一下,再选中指定范围,在下边的输入框中把欢迎来到闪客帝国,我是xfykzz嵌入,确定即可.至于您打算使用什么字体不要紧,我这里使用的是方正水柱体简体. 2.选中该文本,按F8,把它变成一个MC,名称我这里用的是t,然后在库面板中把链接ID写成t.具体做法是右键单击库面板中该MC,选中链接...,在弹出对话框中选中第一和第四项,确定即可. ?? 3.回到主场景第一帧写代码: tString=欢迎来到闪客帝国,我是xfykzz;//确定要显示的字符串. len=tString.length;//指定变量len装载字符串长度. pi=2*Math.PI/len; //这里是把圆(2*Math.PI)分成len份,因此每一个字占用一份(在下面会用到), //所有的字就占用了整个圆.这里的圆并不是圆圈,而指的是三角函数的一个周期. A=30;//振幅 cenX=50; cenY=100;//中心坐标 n=0;//相位改变因子,通过它的改变达到改变整个曲线的目的. m=2500;//变量,来确定三角函数改变快慢的因子. 这几行是对变量的定义,为了下面书写和以后修改更方便. 下面可以看到,我们改变的不是位置,而是透明度和大小,在上面注释解释的时候借用了用位置的表达方法而已.继续： for(var i=0;i eval(?t?+i)._y=cenY;//定义各个MC的位置,25为间隔. eval(?t?+i)._x=cenX+i*25; eval(?t?+i).lab.text=tString.charAt(i);//把对应的字赋给MC中的文本框. 复制MC,数目与字符串数目一样多. attachMovie(?t?,?t?+i,i+50); 这几句不用多解释吧?继续： _root.onEnterFrame=function(){ for(var i=0;i n+=(_xmouse-cenX)/m; } _alpha=_xscale=_yscale=(100-_root.A)+_root.A*Math.sin(n+i*pi); with(eval(?t?+i)){ 前面的我相信都不难理解,这一段是关键,当然啰,也是挺简单的~onEnterFrame是以帧率执行其中的代码,for循环是对每一个MC执行这一句操作: _alpha=_xscale=_ys