Appearance
@jtopo/core / Animation
Class: Animation
一般通过AnimationSystem来创建实例
js
// 通常调用animationSystem的anime方法来创建实例:
let animation = stage.animationSystem.anime({
from: 0,
to: 1,
update: (n) => {
//flashBall.y = -100 * (1 - n);
},
effect: 'easeInQuart',
duration: 1000,
times: Infinity,
direction: 'alternate'
});
// 播放
animation.play();
// play() 返回一个Promise对象
animation.play().then(function(){
// 播放结束后的处理
});
// 暂停
animation.pause();
// 取消
animation.cancel();
Table of contents
Constructors
Properties
- currentTime
- delay
- delayed
- direction
- duration
- effect
- finished
- from
- isPause
- name
- object
- onEnd
- playState
- playedTimes
- startTime
- times
- to
- update
Methods
Constructors
constructor
new Animation(opt?
)
通过AnimationSystem来创建实例,直接new的动画并不能播放。
start 、end 可以是数字,也可以是包含数字的数组
创建实例时start、end、time、action参数可以为空, 但是调用play()方法之前要确保都已经被赋过值。
Parameters
Name | Type |
---|---|
opt? | AnimationOption |
Properties
currentTime
currentTime: number
delay
delay: number
= 0
设置动画开始之前的延迟时间,默认为 0
delayed
delayed: boolean
= false
direction
direction: "normal"
| "reverse"
| "alternate"
| "alternate-reverse"
= 'normal'
运动方向(animation-direction) --normal 是正常运动
--reverse 反向运动
--alternate 运动完后,动画返回
--alternate-reverse 反向运动完后,动画返回
duration
duration: number
= 1000
持续时间, 默认为 1000 毫秒
effect
effect: EasingNameType
= 'easeLinear'
finished
finished: boolean
= false
from
from: AnimationFrameData
初始数据集
isPause
isPause: boolean
= false
name
Optional
name: string
名称
object
Optional
object: AENode
关联的对
onEnd
Optional
onEnd: Function
结束时的回调函数
playState
playState: "idle"
| "pending"
| "running"
| "paused"
| "finished"
= 'idle'
能够返回并设置一个可枚举值来描述一个动画的回放状态。
playedTimes
Readonly
playedTimes: number
= 0
已经播放了多少次
startTime
startTime: number
开始时间
times
times: number
= 1
重复次数(animation-iteration-count),默认1 --可设置数值如: 5 --也可设置为无限次: Infinity
to
to: AnimationFrameData
结束数据集
update
update: Function
每一帧执行的动作函数
Methods
cancel
cancel(): Animation
取消
Returns
continue
continue(): Animation
继续,从暂停处继续, 改成?resume
Returns
self
onUpdate
onUpdate(action
): Animation
设置动画每一帧的回调函数
Parameters
Name | Type |
---|---|
action | Function |
Returns
pause
pause(): Animation
暂停
Returns
self
play
play(): Promise
<any
>
开始
Returns
Promise
<any
>
自身
setAttributes
setAttributes(opt
): Animation
设置各种参数
Since
v2.5.0
Parameters
Name | Type |
---|---|
opt | AnimationOption |