@jtopo/core / Animation

Class: Animation

动画实例对象

通常通过AnimationSystem来创建该类实例，例如：

// 通常调用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

• constructor

Properties

• currentTime
• delay
• delayed
• direction
• duration
• effect
• finished
• from
• isPause
• name
• object
• onEnd
• playState
• playedTimes
• startTime
• system
• times
• to
• update

Methods

• cancel
• continue
• onUpdate
• pause
• play
• setAttributes

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

Deprecated

使用 delay 代替

---

delayed

delayed: boolean

---

direction

direction: "normal" | "reverse" | "alternate" | "alternate-reverse"

运动方向（animation-direction） --normal 是正常运动

--reverse 反向运动

--alternate 运动完后，动画返回

--alternate-reverse 反向运动完后，动画返回

---

duration

duration: number

持续时间, 默认为 1000 毫秒

---

effect

effect: EasingNameType

---

finished

finished: boolean

---

from

from: AnimationFrameData

初始数据集

---

isPause

isPause: boolean

---

name

Optional name: string

名称

---

object

Optional object: any

关联的对

---

onEnd

Optional onEnd: Function

结束时的回调函数

---

playState

playState: "idle" | "pending" | "running" | "paused" | "finished"

能够返回并设置一个可枚举值来描述一个动画的回放状态。

---

playedTimes

Readonly playedTimes: number

已经播放了多少次

---

startTime

startTime: number

开始时间

---

system

Optional system: AnimationSystem

---

times

times: number

重复次数（animation-iteration-count），默认1 --可设置数值如： 5 --也可设置为无限次: Infinity

---

to

to: AnimationFrameData

结束数据集

---

update

update: Function

每一帧执行的动作函数

Methods

cancel

cancel(): Animation

取消

Returns

Animation

---

continue

continue(): Animation

继续，从暂停处继续, 改成？resume

Returns

Animation

self

---

onUpdate

onUpdate(action): Animation

设置动画每一帧的回调函数

Parameters

Name	Type
action	Function

Returns

Animation

---

pause

pause(): Animation

暂停

Returns

Animation

self

---

play

play(): Promise<any>

开始

Returns

Promise<any>

自身

---

setAttributes

setAttributes(opt): Animation

设置各种参数

Since

v2.5.0

Parameters

Name	Type
opt	AnimationOption

Returns

Animation