Tween


模块 hilo/tween/Tween 依赖 hilo/core/Class 源码 Tween.js
Tween类提供缓动功能。


使用示例:

ticker.addTick(Hilo.Tween);//需要把Tween加到ticker里才能使用

var view = new View({x:5, y:10});
Hilo.Tween.to(view, {
    x:100,
    y:20,
    alpha:0
}, {
    duration:1000,
    delay:500,
    ease:Hilo.Ease.Quad.EaseIn,
    onComplete:function(){
        console.log('complete');
    }
});

属性概览

属性 定义于
delay:Int
缓动延迟时间。单位毫秒。
Tween
duration:Int
缓动总时长。单位毫秒。
Tween
ease:Function
缓动变化函数。默认为null。
Tween
loop:Boolean
缓动是否循环。默认为false。
Tween
onComplete:Function
缓动结束回调函数。它接受1个参数:tween。默认值为null。
Tween
onStart:Function
缓动开始回调函数。它接受1个参数:tween。默认值为null。
Tween
onUpdate:Function
缓动更新回调函数。它接受2个参数:ratio和tween。默认值为null。
Tween
paused:Boolean
缓动是否暂停。默认为false。
Tween
repeat:Int
缓动重复的次数。默认为0。
Tween
缓动重复的延迟时长。单位为毫秒。
Tween
reverse:Boolean
缓动是否反转播放。默认为false。
Tween
target:Object
缓动目标。只读属性。
Tween
time:Int
缓动已进行的时长。单位毫秒。只读属性。
Tween

方法概览

方法 定义于
Tween(target:Object, fromProps:Object, toProps:Object, params:Object)
构造函数
Tween
link(tween:Tween):Tween
连接下一个Tween变换。其开始时间根据delay值不同而不同。当delay值为字符串且以'+'或'-'开始时,Tween的开始时间从当前变换结束点计算,否则以当前变换起始点计算。
Tween
pause():Tween
暂停缓动动画的播放。
Tween
resume():Tween
恢复缓动动画的播放。
Tween
seek(time:Number, pause:Boolean):Tween
跳转Tween到指定的时间。
Tween
setProps(fromProps:Object, toProps:Object):Tween
设置缓动对象的初始和目标属性。
Tween
start():Tween
启动缓动动画的播放。
Tween
stop():Tween
停止缓动动画的播放。
Tween
tick():Object
static 更新所有Tween实例。
Tween
add(tween:Tween):Object
static 添加Tween实例。
Tween
remove(tweenOrTarget:Tween|Object|Array):Object
static 删除Tween实例。
Tween
removeAll():Object
static 删除所有Tween实例。
Tween
fromTo(target:Object|Array, fromProps, toProps, params):Tween|Array
static 创建一个缓动动画,让目标对象从开始属性变换到目标属性。
Tween
to(target:Object|Array, toProps, params):Tween|Array
static 创建一个缓动动画,让目标对象从当前属性变换到目标属性。
Tween
from(target:Object|Array, fromProps, params):Tween|Array
static 创建一个缓动动画,让目标对象从指定的起始属性变换到当前属性。
Tween

属性详情

delay:Int
缓动延迟时间。单位毫秒。
duration:Int
缓动总时长。单位毫秒。
ease:Function
缓动变化函数。默认为null。
loop:Boolean
缓动是否循环。默认为false。
onComplete:Function
缓动结束回调函数。它接受1个参数:tween。默认值为null。
onStart:Function
缓动开始回调函数。它接受1个参数:tween。默认值为null。
onUpdate:Function
缓动更新回调函数。它接受2个参数:ratio和tween。默认值为null。
paused:Boolean
缓动是否暂停。默认为false。
repeat:Int
缓动重复的次数。默认为0。
repeatDelay:Int
缓动重复的延迟时长。单位为毫秒。
reverse:Boolean
缓动是否反转播放。默认为false。
target:Object
缓动目标。只读属性。
time:Int
缓动已进行的时长。单位毫秒。只读属性。

构造函数

Tween(target:Object, fromProps:Object, toProps:Object, params:Object)
parameters
target:Object — 缓动对象。
fromProps:Object — 对象缓动的起始属性集合。
toProps:Object — 对象缓动的目标属性集合。
params:Object — 缓动参数。可包含Tween类所有可写属性。

方法详情

[Static] add(tween:Tween):Object
添加Tween实例。
parameters
tween:Tween — 要添加的Tween对象。
return
Object — Tween。
[Static] from(target:Object|Array, fromProps, params):Tween|Array
创建一个缓动动画,让目标对象从指定的起始属性变换到当前属性。
parameters
target:Object|Array — 缓动目标对象或缓动目标数组。
fromProps — 缓动目标对象的初始属性。
params — 缓动动画的参数。
return
Tween|Array — 一个Tween实例对象或Tween实例数组。
[Static] fromTo(target:Object|Array, fromProps, toProps, params):Tween|Array
创建一个缓动动画,让目标对象从开始属性变换到目标属性。
parameters
target:Object|Array — 缓动目标对象或缓动目标数组。
fromProps — 缓动目标对象的开始属性。
toProps — 缓动目标对象的目标属性。
params — 缓动动画的参数。
return
Tween|Array — 一个Tween实例对象或Tween实例数组。
link(tween:Tween):Tween
连接下一个Tween变换。其开始时间根据delay值不同而不同。当delay值为字符串且以'+'或'-'开始时,Tween的开始时间从当前变换结束点计算,否则以当前变换起始点计算。
parameters
tween:Tween — 要连接的Tween变换。
return
Tween — 下一个Tween。可用于链式调用。
pause():Tween
暂停缓动动画的播放。
return
Tween — Tween变换本身。可用于链式调用。
[Static] remove(tweenOrTarget:Tween|Object|Array):Object
删除Tween实例。
parameters
tweenOrTarget:Tween|Object|Array — 要删除的Tween对象或target对象或要删除的一组对象。
return
Object — Tween。
[Static] removeAll():Object
删除所有Tween实例。
return
Object — Tween。
resume():Tween
恢复缓动动画的播放。
return
Tween — Tween变换本身。可用于链式调用。
seek(time:Number, pause:Boolean):Tween
跳转Tween到指定的时间。
parameters
time:Number — 指定要跳转的时间。取值范围为:0 - duraion。
pause:Boolean — 是否暂停。
return
Tween — Tween变换本身。可用于链式调用。
setProps(fromProps:Object, toProps:Object):Tween
设置缓动对象的初始和目标属性。
parameters
fromProps:Object — 缓动对象的初始属性。
toProps:Object — 缓动对象的目标属性。
return
Tween — Tween变换本身。可用于链式调用。
start():Tween
启动缓动动画的播放。
return
Tween — Tween变换本身。可用于链式调用。
stop():Tween
停止缓动动画的播放。
return
Tween — Tween变换本身。可用于链式调用。
[Static] tick():Object
更新所有Tween实例。
return
Object — Tween。
[Static] to(target:Object|Array, toProps, params):Tween|Array
创建一个缓动动画,让目标对象从当前属性变换到目标属性。
parameters
target:Object|Array — 缓动目标对象或缓动目标数组。
toProps — 缓动目标对象的目标属性。
params — 缓动动画的参数。
return
Tween|Array — 一个Tween实例对象或Tween实例数组。