网页教学网
 当前位置: 网页教学网 >> 动画制作 >> Flash实例教学 >> Flash CS3轻松制作一个简单的弹性跟随鼠标特效
[ HTML ] [ FW ] [ DW ] [ FP ] [ JS ] [ XML ] [ CSS ] [ 图象 ] [ FLASH ] [ .NET ] [ ASP ] [ JSP ] [ PHP ] [ 数据 ] [ 系统 ] [ 安全 ] [ 素材 ] [ 建站 ] [ 主机 ] [ 入门 ] [ 技巧 ]

Flash CS3轻松制作一个简单的弹性跟随鼠标特效

http://www.webjx.com  更新日期:2007-09-21 23:15  出处:网页教学网  作者:闪电儿

这个动画非常简单,只是有一个圆永远跟随鼠标,而且还有弹性!Flash CS3轻松制作一个简单的弹性跟随鼠标特效。

在写教程之前在给大家说说我下载Flash CS3 Professional的过程,我在baidu搜到有下载的地方了!大概是400M以上,但是下载后解压总是出错,一晚上白浪费了!建议大家最好去Adobe官方网站去下载,是单线程的,如果大家网速快就能下载完的!

看下演示吧!

源文件下载:点击这里下载源文件

具体制作说明,使用Flash CS3来实现,用的也是ActionScript 3.0,您如果不懂可以查看本站相关教程。

新建立一个文档(File > New > ActionScript 3.0),然后保存为webjx_com.fla,然后按Ctrl+F3打开属性面板,设置帧频为30fps,document class主类为Sproingdemo。

Flash CS3轻松制作一个简单的弹性跟随鼠标特效

然后设置as,打开文本编辑,把下面代码保存为Sproingdemo.as。

package {
  import flash.display.Shape;
  import flash.display.Sprite;
  import flash.events.Event;
  import flash.ui.Mouse;
 
  public class SproingDemo extends Sprite {
    private var orb1:Shape;
    private var orb2:Orb;
    private var lineCanvas:Shape;
    private var spring:Number = .1;
    private var damping:Number = .9;
 
    // Constructor
    public function SproingDemo() {
      init();
    }
 
    private function init():void {
      // Set up the small orb
      orb1 = new Shape();
      orb1.graphics.lineStyle(1, 0x6633CC);
      orb1.graphics.beginFill(0x6699CC);
      orb1.graphics.drawCircle(0, 0, 10);     
 
      // Set up the large orb
      orb2 = new Orb(25, 0x00CCFF, 1, 0x0066FF);
 
      // Set up the drawing canvas for the line drawn between the orbs
      lineCanvas = new Shape();     
 
      // Add lineCanvas, orb1 and arb2 to this object's display hierarchy
      addChild(orb2);
      addChild(orb1);
      addChild(lineCanvas);     
 
      // Register for Event.ENTER_FRAME events
      addEventListener(Event.ENTER_FRAME, enterFrameListener);     
 
      // Hide the mouse pointer
      Mouse.hide();
    }
 
    private function enterFrameListener(e:Event):void {
      // Set orb1's position to current mouse position
      orb1.x = mouseX;
      orb1.y = mouseY;   
 
      // Spring orb2 to orb1
      orb2.vx += (orb1.x - orb2.x) * spring;
      orb2.vy += (orb1.y - orb2.y) * spring;
      orb2.vx *= damping;
      orb2.vy *= damping;
      orb2.x += orb2.vx;
      orb2.y += orb2.vy;     
 
      // Draw a line between the two orbs
      drawLine();
    }   
 
    private function drawLine():void {
      with (lineCanvas) {
        graphics.clear();
       graphics.moveTo(orb1.x, orb1.y);
       graphics.lineStyle(1, 0x4C59D8);
        graphics.lineTo(orb2.x, orb2.y);
      }
    }
  }
}

然后再建立一个Orb.as,内容如下。

package {
  import flash.display.Shape;
 
  public class Orb extends Shape {
    internal var radius:int;
    internal var vx:Number = 0;
    internal var vy:Number = 0;
 
    // Constructor
    public function Orb(radius:int = 20, fillColor:int = 0x00FF00, lineThickness:int = 1, lineColor:int = 0) {
      this.radius = radius;
      graphics.lineStyle(lineThickness, lineColor);
      graphics.beginFill(fillColor);
      graphics.drawCircle(0, 0, radius);
    }
  }
}

这时要注意上面三个文件一个要保存在同一个目录下,这时就可以测试影片了!

关键词:flash,CS3,AS3.0
推荐给好友】【关闭】【收藏本文
最新五条评论
查看全部评论
评论总数 0
您的评论
用户名: 新注册) 密 码: 匿名:
·用户发表意见仅代表其个人意见,并且承担一切因发表内容引起的纠纷和责任
·本站管理人员有权在不通知用户的情况下删除不符合规定的评论信息或留做证据
·请客观的评价您所看到的资讯,提倡就事论事,杜绝漫骂和人身攻击等不文明行为