三角函数在Flash动画中很有用,下面列举一下其有用的用法,注:myCircle是舞台上的一个圆形实例。
1,让某一物体做圆周运动。
this.addEventListener(Event.ENTER_FRAME,handleEnterFrame);
var angle = 0;
function handleEnterFrame(event:Event):void{
myCircle.y = 200 + Math.cos(angle)*180;
myCircle.x = 200 + Math.cos(angle)*180;
angle += 0.1;
}
var angle = 0;
function handleEnterFrame(event:Event):void{
myCircle.y = 200 + Math.cos(angle)*180;
myCircle.x = 200 + Math.cos(angle)*180;
angle += 0.1;
}
这样,myCircle将围绕中心点(200,200)做半径为180的圆周运动;
与此类似,椭圆运动,只是让x,y可变化的长度不一样即可。如下示例:
this.addEventListener(Event.ENTER_FRAME,handleEnterFrame);
var angle = 0;
function handleEnterFrame(event:Event):void{
myCircle.y = 200 + Math.cos(angle)*180;
myCircle.x = 200 + Math.cos(angle)*90;
angle += 0.1;
}
var angle = 0;
function handleEnterFrame(event:Event):void{
myCircle.y = 200 + Math.cos(angle)*180;
myCircle.x = 200 + Math.cos(angle)*90;
angle += 0.1;
}
2,让物体指向鼠标方向:
this.addEventListener(Event.ENTER_FRAME,handleEnterFrame);
var angle = 0;
function handleEnterFrame(event:Event):void{
myCircle.rotation = Math.atan2(mouseY-myCircle.y,mouseX-myCircle.x)*180/Math.PI;
var angle = 0;
function handleEnterFrame(event:Event):void{
myCircle.rotation = Math.atan2(mouseY-myCircle.y,mouseX-myCircle.x)*180/Math.PI;
}
这里,myCircle换为其他有菱角的物体效果更明显。
3,呈对角方向移动:原理是x、y每次变化都一致,所以每次都是myCircle.x = myCircle.y
this.addEventListener(Event.ENTER_FRAME,handleEnterFrame);
var angle = 0;
function handleEnterFrame(event:Event):void{
myCircle.y = 180 + Math.sin(angle)*180;
myCircle.x = 180 + Math.sin(angle)*180;
angle += 0.1;
}
var angle = 0;
function handleEnterFrame(event:Event):void{
myCircle.y = 180 + Math.sin(angle)*180;
myCircle.x = 180 + Math.sin(angle)*180;
angle += 0.1;
}
4,无规律运动,给x、y的角度变化大小分别设定一个值,这样x跟y变化也变得无规律,显示出来就是整个屏幕中无规律移动:
this.addEventListener(Event.ENTER_FRAME,handleEnterFrame);
var anglex = 0;
var angley = 0;
function handleEnterFrame(event:Event):void{
myCircle.y = 180 + Math.sin(anglex)*180;
myCircle.x = 180 + Math.sin(angley)*180;
anglex += 0.1;
angley += 0.2;
}
var anglex = 0;
var angley = 0;
function handleEnterFrame(event:Event):void{
myCircle.y = 180 + Math.sin(anglex)*180;
myCircle.x = 180 + Math.sin(angley)*180;
anglex += 0.1;
angley += 0.2;
}
5,画正旋波:
this.addEventListener(Event.ENTER_FRAME,handleEnterFrame);
var anglex = 0.5;
var angley = 0;
var xpos = 0;
var ypos = 0;
this.graphics.lineStyle(1,0,1)
this.graphics.moveTo(0,180);
function handleEnterFrame(event:Event):void{
xpos += anglex;
angley += 0.05;
ypos = 180+Math.sin(angley)*180;
this.graphics.lineTo(xpos,ypos);
}
var anglex = 0.5;
var angley = 0;
var xpos = 0;
var ypos = 0;
this.graphics.lineStyle(1,0,1)
this.graphics.moveTo(0,180);
function handleEnterFrame(event:Event):void{
xpos += anglex;
angley += 0.05;
ypos = 180+Math.sin(angley)*180;
this.graphics.lineTo(xpos,ypos);
}
其实就是让x每次变化1像素,y按正旋值变化。
上面的都是针对物体x、y进行变化的,也可将这些应用在rotation、scaleX、scaleY等属性上,可得到另外一些很有用的图形变化。