Flash教程:用AS3代码表现倾斜角与斜率_Flash教程

编辑Tag赚U币
教程Tag:暂无Tag,欢迎添加,赚取U币!

推荐:Flash AS3制作交互式3D旋转动画效果
效果演示: 使图标具有交互性: 当鼠标单击某个图标时使之旋转,并让图标显示在屏幕的最前面。 //定义旋转的最终角度 var endAngle:Number = 90; //保存已经旋转的角度 var tempAngle:Number = 0; //保存旋转的状态 var isRotating:Boolean = true; //注册图标的单击事

   演示:

  坐标中的两点可以确定一条直线,直线与线段不同,线段有长度,而直线是没有长度的。通过两点可以确定一条直线,通过角度和一个定点也能确定一条直线。

  直线与X轴正半轴所成的角称直线的倾斜角,当倾斜角不等于90度时,倾斜角的正切称为直线的斜率。图:

Flash教程:用AS3代码表现倾斜角与斜率  模板无忧

  其中角a就是直线的倾斜角,而斜率就是直角三角中对边BC与邻边AB的比值,即正切值。正切值通过Math类的tan()方法可以得到。

  给定A点和C点的坐标,可求得角a的角度值。

  求角a的正切值的算法:

  (C.y - A.y) / (C.x - A.x);

  下面的代码求直线的斜率:

  (C.x == A.x)?Infinity:(C.y - A.y) / (C.x - A.x);

  代码先判断两点的横坐标是否相等,如果相等,说明直线垂直于x轴,这时不存在斜率,所以给斜率一定特殊值Infinity。

  例:

  1、新建Flash文档,取名存盘。

  2、创建影片剪辑,图层1用椭圆工具绘制一个圆,填充色和大小根据需要定。插入图层2, as层,输入代码:

  //注册鼠标按下事件侦听器

  this.addEventListener(MouseEvent.MOUSE_DOWN,startDragFunc);

  //注册鼠标释放事件侦听器

  this.addEventListener(MouseEvent.MOUSE_UP,stopDragFunc);

  //定义接收按下事件的函数

  function startDragFunc(e:MouseEvent);

  {

  //开始拖动

  e.target.startDrag();

  //更新显示

  e.updateAfterEvent() ;

  }

  //定义接收释放事件的函数

  function stopDragFunc(e:MouseEvent);

  {

  //停止拖动

  e.target.stopDrag()

  }

  3、返回场景1,在图层1的第一帧拖入两个影片剪辑,在属性面板中输入剪辑的名字,p1 、p2。

  4、插入图层2,选择文本工具,创建静态文本,字体大小15 、字体自定。输入:斜率:在右面创建动态文本,名:k_txt。在下面再次创建静态文本,输入:倾斜角:右面创建动态文本,名:a_txt。

  5、插入图层3,as层。输入代码:

  //导入数学函数

  include "Math2.as";

  //创建两个点

  var A:Point=new Point()

  var B:Point=new Point()

  //创建用于绘制箭头的容器

  var arrow_shape:Shape=new Shape();

  this.addChild(arrow_shape);

  stage.addEventListener(Event.ENTER_FRAME,loop);

  function loop(e:Event):void

  {

  //清除绘图

  arrow_shape.graphics.clear();

  //在两点间绘制箭头

  drawArrow(arrow_shape.graphics,p1.x,p1.y,p2.x,p2.y);

  //设置点A的值

  A.x=p1.x;

  A.y=p1.y;

  //设置点B的值

  B.x=p2.x;

  B.y=p2.y;

  //根据点A和点B创建直线

  var line:Line=new Line(A,B);

  //把斜率保存两位小数,并转换为字符串显示出来

  k_txt.text=line.K.toFixed(2);

  //把倾斜角取整后显示

  a_txt.text=line.angle.toFixed();

  }

  上面的代码把弧度和角度转换等函数放在Math2.as文件中,通过include导入Math2.as文件就可以使用这些数学函数。Math2.as文件中添加了绘制箭头的函数drawArraw()。

  5、测试影片,看一下效果。如果需要输出p2的x、y坐标添加代码:

  x_txt.text = p2.x;

  y_txt.text = p2.y;

  界面上添加静态文本和动态文本就不用细说了吧,如果不需要显示斜率注释掉。

分享:Flash cs3鼠绘教程:动画技巧之绘制猴子
猴子 效果演示: 讨论: http://www.missyuan.com/viewthread.php?tid=417576 写实效果的关键在阴影中。同样的2.5D 动画技巧在这儿被使用,不过这次绘制的一个渐变图形加强了一个更加令人满意的三维效果。 1. 首先在第一帧放入角色的四分之三的角度。让我们把它叫做A点

来源:模板无忧//所属分类:Flash教程/更新时间:2014-10-10
相关Flash教程