GTween的JavaScript版本

GTween介绍

GTween是ActionSctipt 3的补间动画库，GTween适用于任何对象的任何数值属性。GTween.js是将GTween转换成JavaScript代码而来的。未来会实现GTweener和GTweenTimeline以及一些插件。 采用requirejs实现模块化，使用r.js和almond编译成了不需要requirejs也可以运行的环境。

快速上手

var GTween=require("com/as3long/motion/GTween");
//AllEase里面包含了GTween中的30中缓动效果
var AllEase=require("com/as3long/motion/easing/AllEase");
//初始化GTween使其开始触发定时器
GTween.staticInit();
//使用方法
GTween.create(target,5,{value:1024},{ease:AllEase.Back.easeInOut,onComplete:function(){}});

DEMO

http://as3long.github.io/blog/demo/gtween/index.html

API

模块

GTween：
var GTween=require("com/as3long/motion/GTween");
  • GTween.staticInit(); //初始化GTween(静态方法)
  • GTween.pauseAll=true; //暂停所有动画(静态属性)
  • setDelay(time); //设置延时执行时间 单位为秒(对象方法)
  • getDelay(); //获取延时执行时间 单位为秒(对象方法)
  • create(target, duration, values, props, pluginData); //创建对象的方法 继承自Class模块.
  • target:要改变属性的对象
  • duration:缓动事件 单位为秒
  • values:要改变的属性的目标值 eq:{x:200,y:300} 将target的x属性缓动到200，将target的y属性缓动到300.
  • props:设置缓动效果和回调方法
  • pluginData:插件数据
  • extend(object);//继承可以通过该方法扩展GTween
AllEase：
var AllEase=require("com/as3long/motion/easing/AllEase");
  • Back
var Back=require("com/as3long/motion/easing/Back");//一般用AllEase.Back就好了
  • Back.easeIn
  • Back.easeOut
  • Back.easeInOut
  • Bounce
var Bounce=require("com/as3long/motion/easing/Bounce");//一般用AllEase.Bounce就好了
  • Bounce.easeIn
  • Bounce.easeOut
  • Bounce.easeInOut
  • Circular
var Circular=require("com/as3long/motion/easing/Circular");//一般用AllEase.Circular就好了
  • Circular.easeIn
  • Circular.easeOut
  • Circular.easeInOut
  • Cubic
var Cubic=require("com/as3long/motion/easing/Cubic");//一般用AllEase.Cubic就好了
  • Cubic.easeIn
  • Cubic.easeOut
  • Cubic.easeInOut
  • Elastic
var Elastic=require("com/as3long/motion/easing/Elastic");//一般用AllEase.Elastic就好了
  • Elastic.easeIn
  • Elastic.easeOut
  • Elastic.easeInOut
  • Elastic
var Exponential=require("com/as3long/motion/easing/Exponential");//一般用AllEase.Exponential就好了
  • Exponential.easeIn
  • Exponential.easeOut
  • Exponential.easeInOut
  • Quadratic
var Bounce=require("com/as3long/motion/easing/Bounce");//一般用AllEase.Bounce就好了
  • Quadratic.easeIn
  • Quadratic.easeOut
  • Quadratic.easeInOut
  • Quartic
var Quartic=require("com/as3long/motion/easing/Quartic");//一般用AllEase.Quartic就好了
  • Quartic.easeIn
  • Quartic.easeOut
  • Quartic.easeInOut
  • Quintic
var Quintic=require("com/as3long/motion/easing/Quintic");//一般用AllEase.Quintic就好了
  • Quintic.easeIn
  • Quintic.easeOut
  • Quintic.easeInOut
  • Sine
var Sine=require("com/as3long/motion/easing/Sine");//一般用AllEase.Sine就好了
  • Sine.easeIn
  • Sine.easeOut
  • Sine.easeInOut
Class

var Class=require("Class");

  • create：创建对象
  • extends：继承
EventDispatch

EventDispatch继承自Class,实现了一个事件监听派发器

var EventDispatch=require("com/as3long/events/EventDispatch");

  • addEventListener(type, listener,context)：添加监听
  • type:监听类型
  • listener:监听方法
  • context:监听方法中要用的上下文也就是监听方法里要用到的this
  • removeEventListener(type, listener)：移除监听
  • hasEventListener(type)：是否具有指定类型的事件监听
  • removeAllEventListener(type):移除所有指定事件监听
  • dispatchEvent(event):派发事件 对象为AEvent
AEvent

AEvent继承自Class是一个事件对象

var AEvent=require("com/as3long/events/AEvent");

Table of Contents