Skip to content

ESAnimationViewComponent

setPivotX(Number pivotX)

功能描述

设置动画view的 pivot x。

参数

属性类型默认值必填说明
pivotXNumber动画view的 pivot x

示例代码

点击查看源码
js
this.$refs.animation_view.setPivotX(100);

注意

setPivotY(Number pivotY)

功能描述

设置动画view的 pivot y。

参数

属性类型默认值必填说明
pivotYNumber动画view的 pivot y

示例代码

点击查看源码
js
this.$refs.animation_view.setPivotY(100);

注意

resetPivot()

功能描述

重置动画view的 pivot。

参数

示例代码

点击查看源码
js
this.$refs.animation_view.resetPivot();

注意

resetAnimators()

功能描述

重置所有的动画。

参数

示例代码

点击查看源码
js
this.$refs.animation_view.resetAnimators();

注意

animatorSet(String animatorId, Number duration, Boolean listenAnimator)

功能描述

创建动画合集。

参数

属性类型默认值必填说明
animatorIdString自定义动画id,用来后续控制动画
durationNumber动画合集的执行时长,不设置传值-1
listenAnimatorBoolean是否监听动画回调状态

示例代码

点击查看源码
js
this.$refs.animation_view.animatorSet("animSetId", -1, false);

注意

startAnimator(String animatorId)

功能描述

开始动画。

参数

属性类型默认值必填说明
animatorIdString动画和动画合集的id

示例代码

点击查看源码
js
this.$refs.animation_view.startAnimator("animSetId");

注意

startAnimatorDelay(String animatorId, Number delay)

功能描述

延迟开始动画。

参数

属性类型默认值必填说明
animatorIdString动画和动画合集的id
delayNumber动画延迟开始的毫秒时间

示例代码

点击查看源码
js
this.$refs.animation_view.startAnimatorDelay("animSetId", 1000);

注意

pauseAnimator(String animatorId)

功能描述

暂停动画。

参数

属性类型默认值必填说明
animatorIdString动画和动画合集的id

示例代码

点击查看源码
js
this.$refs.animation_view.pauseAnimator("animSetId");

注意

resumeAnimator(String animatorId)

功能描述

重新开始动画。

参数

属性类型默认值必填说明
animatorIdString动画和动画合集的id

示例代码

点击查看源码
js
this.$refs.animation_view.resumeAnimator("animSetId");

注意

cancelAnimator(String animatorId)

功能描述

取消动画。

参数

属性类型默认值必填说明
animatorIdString动画和动画合集的id

示例代码

点击查看源码
js
this.$refs.animation_view.cancelAnimator("animSetId");

注意

reverseAnimator(String animatorId)

功能描述

反向执行动画。

参数

属性类型默认值必填说明
animatorIdString动画和动画合集的id

示例代码

点击查看源码
js
this.$refs.animation_view.reverseAnimator("animSetId");

注意

play(String animatorSetId, String animatorId)

功能描述

向动画合集添加动画。

参数

属性类型默认值必填说明
animatorSetIdString动画合集id
animatorIdString动画id

示例代码

点击查看源码
js
this.$refs.animation_view.play("animSetId", "animId");

注意

with(String animatorSetId, String animatorId)

功能描述

和动画合集一块播放动画。

参数

属性类型默认值必填说明
animatorSetIdString动画合集id
animatorIdString动画id

示例代码

点击查看源码
js
this.$refs.animation_view.with("animSetId", "animId");

注意

before(String animatorSetId, String animatorId)

功能描述

先执行animatorId的动画,再执行动画合集动画。

参数

属性类型默认值必填说明
animatorSetIdString动画合集id
animatorIdString动画id

示例代码

点击查看源码
js
this.$refs.animation_view.before("animSetId", "animId");

注意

after(String animatorSetId, String animatorId)

功能描述

先执行动画合集动画,再执行animatorId的动画。

参数

属性类型默认值必填说明
animatorSetIdString动画合集id
animatorIdString动画id

示例代码

点击查看源码
js
this.$refs.animation_view.after("animSetId", "animId");

注意

playSequentially1(String animatorSetId, String animatorId1)

功能描述

向动画合集添加顺序执行动画。

参数

属性类型默认值必填说明
animatorSetIdString动画合集id
animatorId1String动画id

示例代码

点击查看源码
js
this.$refs.animation_view.playSequentially1("animSetId", "animId1");

注意

playSequentially2(String animatorSetId, String animatorId1, String animatorId2)

功能描述

向动画合集添加顺序执行动画。

参数

属性类型默认值必填说明
animatorSetIdString动画合集id
animatorId1String动画id
animatorId2String动画id

示例代码

点击查看源码
js
this.$refs.animation_view.playSequentially2("animSetId", "animId1", "animId2");

注意

playSequentially3(String animatorSetId, String animatorId1, String animatorId2, String animatorId3)

功能描述

向动画合集添加顺序执行动画。

参数

属性类型默认值必填说明
animatorSetIdString动画合集id
animatorId1String动画id
animatorId2String动画id
animatorId3String动画id

示例代码

点击查看源码
js
this.$refs.animation_view.playSequentially3("animSetId", "animId1", "animId2", "animId3");

注意

playSequentially4(String animatorSetId, String animatorId1, String animatorId2, String animatorId3, String animatorId4)

功能描述

向动画合集添加顺序执行动画。

参数

属性类型默认值必填说明
animatorSetIdString动画合集id
animatorId1String动画id
animatorId2String动画id
animatorId3String动画id
animatorId4String动画id

示例代码

点击查看源码
js
this.$refs.animation_view.playSequentially4("animSetId", "animId1", "animId2", "animId3", "animId4");

注意

playSequentially5(String animatorSetId, String animatorId1, String animatorId2, String animatorId3, String animatorId4, String animatorId5)

功能描述

向动画合集添加顺序执行动画。

参数

属性类型默认值必填说明
animatorSetIdString动画合集id
animatorId1String动画id
animatorId2String动画id
animatorId3String动画id
animatorId4String动画id
animatorId5String动画id

示例代码

点击查看源码
js
this.$refs.animation_view.playSequentially5("animSetId", "animId1", "animId2", "animId3", "animId4", "animId5");

注意

playTogether1(String animatorSetId, String animatorId1)

功能描述

向动画合集添加顺序执行动画。

参数

属性类型默认值必填说明
animatorSetIdString动画合集id
animatorId1String动画id

示例代码

点击查看源码
js
this.$refs.animation_view.playTogether1("animSetId", "animId1");

注意

playTogether2(String animatorSetId, String animatorId1, String animatorId2)

功能描述

向动画合集添加并行执行动画。

参数

属性类型默认值必填说明
animatorSetIdString动画合集id
animatorId1String动画id
animatorId2String动画id

示例代码

点击查看源码
js
this.$refs.animation_view.playTogether2("animSetId", "animId1", "animId2");

注意

playTogether3(String animatorSetId, String animatorId1, String animatorId2, String animatorId3)

功能描述

向动画合集添加并行执行动画。

参数

属性类型默认值必填说明
animatorSetIdString动画合集id
animatorId1String动画id
animatorId2String动画id
animatorId3String动画id

示例代码

点击查看源码
js
this.$refs.animation_view.playTogether3("animSetId", "animId1", "animId2", "animId3");

注意

playTogether4(String animatorSetId, String animatorId1, String animatorId2, String animatorId3, String animatorId4)

功能描述

向动画合集添加并行执行动画。

参数

属性类型默认值必填说明
animatorSetIdString动画合集id
animatorId1String动画id
animatorId2String动画id
animatorId3String动画id
animatorId4String动画id

示例代码

点击查看源码
js
this.$refs.animation_view.playTogether4("animSetId", "animId1", "animId2", "animId3", "animId4");

注意

playTogether5(String animatorSetId, String animatorId1, String animatorId2, String animatorId3, String animatorId4, String animatorId5)

功能描述

向动画合集添加并行执行动画。

参数

属性类型默认值必填说明
animatorSetIdString动画合集id
animatorId1String动画id
animatorId2String动画id
animatorId3String动画id
animatorId4String动画id
animatorId5String动画id

示例代码

点击查看源码
js
this.$refs.animation_view.playTogether5("animSetId", "animId1", "animId2", "animId3", "animId4", "animId5");

注意

objectAnimator1(String animatorId, String valueType, String propertyName, String value1, Number duration, Number repeatMode, Number repeatCount, Boolean listenAnimator, Boolean listenAnimatorValue, Object interpolator)

功能描述

创建一个属性一个变化值的动画。

参数

属性类型默认值必填说明
animatorIdString动画id
valueTypeString动画属性值类型
propertyNameString动画属性名称
value1String动画属性值
durationNumber动画执行时长
repeatModeNumber动画重复模式
repeatCountNumber动画重复次数
listenAnimatorBoolean是否监听动画状态
listenAnimatorValueBoolean是否监听动画属性值变化
interpolatorObject动画插值

Object interpolator

属性类型默认值必填说明
typeString动画插值类型
paramsObject动画属性值类型

示例代码

点击查看源码
js
this.$refs.animation_view.objectAnimator1(       
"1",//id
ES_ANIMATION_VALUE_TYPE_FLOAT',
ES_ANIMATION_PROPERTY_NAME_TRANSLATION_X',
"360",
1000,
-1,
10000,
false,
false,
{
  type: ES_CYCLE_INTERPOLATOR,
});

注意

objectAnimator2(String animatorId, String valueType, String propertyName, String value1, String value2, Number duration, Number repeatMode, Number repeatCount, Boolean listenAnimator, Boolean listenAnimatorValue, Object interpolator)

功能描述

创建一个属性二个变化值的动画。

参数

属性类型默认值必填说明
animatorIdString动画id
valueTypeString动画属性值类型
propertyNameString动画属性名称
value1String动画属性值
value2String动画属性值
durationNumber动画执行时长
repeatModeNumber动画重复模式
repeatCountNumber动画重复次数
listenAnimatorBoolean是否监听动画状态
listenAnimatorValueBoolean是否监听动画属性值变化
interpolatorObject动画插值

Object interpolator

属性类型默认值必填说明
typeString动画插值类型
paramsObject动画属性值类型

示例代码

点击查看源码
js
this.$refs.animation_view.objectAnimator2(       
"1",//id
ES_ANIMATION_VALUE_TYPE_FLOAT',
ES_ANIMATION_PROPERTY_NAME_TRANSLATION_X',
"0",
"360",
1000,
-1,
10000,
false,
false,
{
  type: ES_CYCLE_INTERPOLATOR,
});

注意

objectAnimator3(String animatorId, String valueType, String propertyName, String value1, String value2, String value3, Number duration, Number repeatMode, Number repeatCount, Boolean listenAnimator, Boolean listenAnimatorValue, Object interpolator)

功能描述

创建一个属性三个变化值的动画。

参数

属性类型默认值必填说明
animatorIdString动画id
valueTypeString动画属性值类型
propertyNameString动画属性名称
value1String动画属性值
value2String动画属性值
value3String动画属性值
durationNumber动画执行时长
repeatModeNumber动画重复模式
repeatCountNumber动画重复次数
listenAnimatorBoolean是否监听动画状态
listenAnimatorValueBoolean是否监听动画属性值变化
interpolatorObject动画插值

Object interpolator

属性类型默认值必填说明
typeString动画插值类型
paramsObject动画属性值类型

示例代码

点击查看源码
js
this.$refs.animation_view.objectAnimator3(       
"1",//id
ES_ANIMATION_VALUE_TYPE_FLOAT',
ES_ANIMATION_PROPERTY_NAME_TRANSLATION_X',
"0",
"360",
"0",
1000,
-1,
10000,
false,
false,
{
  type: ES_CYCLE_INTERPOLATOR,
});

注意

objectAnimator4(String animatorId, String valueType, String propertyName, String value1, String value2, String value3, String value4, Number duration, Number repeatMode, Number repeatCount, Boolean listenAnimator, Boolean listenAnimatorValue, Object interpolator)

功能描述

创建一个属性四个变化值的动画。

参数

属性类型默认值必填说明
animatorIdString动画id
valueTypeString动画属性值类型
propertyNameString动画属性名称
value1String动画属性值
value2String动画属性值
value3String动画属性值
value4String动画属性值
durationNumber动画执行时长
repeatModeNumber动画重复模式
repeatCountNumber动画重复次数
listenAnimatorBoolean是否监听动画状态
listenAnimatorValueBoolean是否监听动画属性值变化
interpolatorObject动画插值

Object interpolator

属性类型默认值必填说明
typeString动画插值类型
paramsObject动画属性值类型

示例代码

点击查看源码
js
this.$refs.animation_view.objectAnimator4(       
"1",//id
ES_ANIMATION_VALUE_TYPE_FLOAT',
ES_ANIMATION_PROPERTY_NAME_TRANSLATION_X',
"0",
"360",
"0",
"360",
1000,
-1,
10000,
false,
false,
{
  type: ES_CYCLE_INTERPOLATOR,
});

注意

objectAnimator5(String animatorId, String valueType, String propertyName, String value1, String value2, String value3, String value4, String value5, Number duration, Number repeatMode, Number repeatCount, Boolean listenAnimator, Boolean listenAnimatorValue, Object interpolator)

功能描述

创建一个属性五个变化值的动画。

参数

属性类型默认值必填说明
animatorIdString动画id
valueTypeString动画属性值类型
propertyNameString动画属性名称
value1String动画属性值
value2String动画属性值
value3String动画属性值
value4String动画属性值
value5String动画属性值
durationNumber动画执行时长
repeatModeNumber动画重复模式
repeatCountNumber动画重复次数
listenAnimatorBoolean是否监听动画状态
listenAnimatorValueBoolean是否监听动画属性值变化
interpolatorObject动画插值

Object interpolator

属性类型默认值必填说明
typeString动画插值类型
paramsObject动画属性值类型

示例代码

点击查看源码
js
this.$refs.animation_view.objectAnimator5(       
"1",//id
ES_ANIMATION_VALUE_TYPE_FLOAT',
ES_ANIMATION_PROPERTY_NAME_TRANSLATION_X',
"0",
"360",
"0",
"360",
"0",
1000,
-1,
10000,
false,
false,
{
  type: ES_CYCLE_INTERPOLATOR,
});

注意

objectAnimator6(String animatorId, String valueType, String propertyName, String value1, String value2, String value3, String value4, String value5, String value6, Number duration, Number repeatMode, Number repeatCount, Boolean listenAnimator, Boolean listenAnimatorValue, Object interpolator)

功能描述

创建一个属性六个变化值的动画。

参数

属性类型默认值必填说明
animatorIdString动画id
valueTypeString动画属性值类型
propertyNameString动画属性名称
value1String动画属性值
value2String动画属性值
value3String动画属性值
value4String动画属性值
value5String动画属性值
value6String动画属性值
durationNumber动画执行时长
repeatModeNumber动画重复模式
repeatCountNumber动画重复次数
listenAnimatorBoolean是否监听动画状态
listenAnimatorValueBoolean是否监听动画属性值变化
interpolatorObject动画插值

Object interpolator

属性类型默认值必填说明
typeString动画插值类型
paramsObject动画属性值类型

示例代码

点击查看源码
js
this.$refs.animation_view.objectAnimator6(       
"1",//id
ES_ANIMATION_VALUE_TYPE_FLOAT',
ES_ANIMATION_PROPERTY_NAME_TRANSLATION_X',
"0",
"360",
"0",
"360",
"0",
"360",
1000,
-1,
10000,
false,
false,
{
  type: ES_CYCLE_INTERPOLATOR,
});

注意

objectAnimator7(String animatorId, String valueType, String propertyName, String value1, String value2, String value3, String value4, String value5, String value6, String value7, Number duration, Number repeatMode, Number repeatCount, Boolean listenAnimator, Boolean listenAnimatorValue, Object interpolator)

功能描述

创建一个属性六个变化值的动画。

参数

属性类型默认值必填说明
animatorIdString动画id
valueTypeString动画属性值类型
propertyNameString动画属性名称
value1String动画属性值
value2String动画属性值
value3String动画属性值
value4String动画属性值
value5String动画属性值
value6String动画属性值
value7String动画属性值
durationNumber动画执行时长
repeatModeNumber动画重复模式
repeatCountNumber动画重复次数
listenAnimatorBoolean是否监听动画状态
listenAnimatorValueBoolean是否监听动画属性值变化
interpolatorObject动画插值

Object interpolator

属性类型默认值必填说明
typeString动画插值类型
paramsObject动画属性值类型

示例代码

点击查看源码
js
this.$refs.animation_view.objectAnimator7(       
"1",//id
ES_ANIMATION_VALUE_TYPE_FLOAT',
ES_ANIMATION_PROPERTY_NAME_TRANSLATION_X',
"0",
"360",
"0",
"360",
"0",
"360",
"0",
1000,
-1,
10000,
false,
false,
{
  type: ES_CYCLE_INTERPOLATOR,
});

注意

objectAnimator8(String animatorId, String valueType, String propertyName, String value1, String value2, String value3, String value4, String value5, String value6, String value7, String value8, Number duration, Number repeatMode, Number repeatCount, Boolean listenAnimator, Boolean listenAnimatorValue, Object interpolator)

功能描述

创建一个属性六个变化值的动画。

参数

属性类型默认值必填说明
animatorIdString动画id
valueTypeString动画属性值类型
propertyNameString动画属性名称
value1String动画属性值
value2String动画属性值
value3String动画属性值
value4String动画属性值
value5String动画属性值
value6String动画属性值
value7String动画属性值
value8String动画属性值
durationNumber动画执行时长
repeatModeNumber动画重复模式
repeatCountNumber动画重复次数
listenAnimatorBoolean是否监听动画状态
listenAnimatorValueBoolean是否监听动画属性值变化
interpolatorObject动画插值

Object interpolator

属性类型默认值必填说明
typeString动画插值类型
paramsObject动画属性值类型

示例代码

点击查看源码
js
this.$refs.animation_view.objectAnimator8(       
"1",//id
ES_ANIMATION_VALUE_TYPE_FLOAT',
ES_ANIMATION_PROPERTY_NAME_TRANSLATION_X',
"0",
"360",
"0",
"360",
"0",
"360",
"0",
"360",
1000,
-1,
10000,
false,
false,
{
  type: ES_CYCLE_INTERPOLATOR,
});

注意

objectAnimator9(String animatorId, String valueType, String propertyName, String value1, String value2, String value3, String value4, String value5, String value6, String value7, String value8, String value9, Number duration, Number repeatMode, Number repeatCount, Boolean listenAnimator, Boolean listenAnimatorValue, Object interpolator)

功能描述

创建一个属性六个变化值的动画。

参数

属性类型默认值必填说明
animatorIdString动画id
valueTypeString动画属性值类型
propertyNameString动画属性名称
value1String动画属性值
value2String动画属性值
value3String动画属性值
value4String动画属性值
value5String动画属性值
value6String动画属性值
value7String动画属性值
value8String动画属性值
value9String动画属性值
durationNumber动画执行时长
repeatModeNumber动画重复模式
repeatCountNumber动画重复次数
listenAnimatorBoolean是否监听动画状态
listenAnimatorValueBoolean是否监听动画属性值变化
interpolatorObject动画插值

Object interpolator

属性类型默认值必填说明
typeString动画插值类型
paramsObject动画属性值类型

示例代码

点击查看源码
js
this.$refs.animation_view.objectAnimator9(       
"1",//id
ES_ANIMATION_VALUE_TYPE_FLOAT',
ES_ANIMATION_PROPERTY_NAME_TRANSLATION_X',
"0",
"360",
"0",
"360",
"0",
"360",
"0",
"360",
"0",
1000,
-1,
10000,
false,
false,
{
  type: ES_CYCLE_INTERPOLATOR,
});

注意

objectAnimator10(String animatorId, String valueType, String propertyName, String value1, String value2, String value3, String value4, String value5, String value6, String value7, String value8, String value9, String value10, Number duration, Number repeatMode, Number repeatCount, Boolean listenAnimator, Boolean listenAnimatorValue, Object interpolator)

功能描述

创建一个属性六个变化值的动画。

参数

属性类型默认值必填说明
animatorIdString动画id
valueTypeString动画属性值类型
propertyNameString动画属性名称
value1String动画属性值
value2String动画属性值
value3String动画属性值
value4String动画属性值
value5String动画属性值
value6String动画属性值
value7String动画属性值
value8String动画属性值
value9String动画属性值
value10String动画属性值
durationNumber动画执行时长
repeatModeNumber动画重复模式
repeatCountNumber动画重复次数
listenAnimatorBoolean是否监听动画状态
listenAnimatorValueBoolean是否监听动画属性值变化
interpolatorObject动画插值

Object interpolator

属性类型默认值必填说明
typeString动画插值类型
paramsObject动画属性值类型

示例代码

点击查看源码
js
this.$refs.animation_view.objectAnimator10(       
"1",//id
ES_ANIMATION_VALUE_TYPE_FLOAT',
ES_ANIMATION_PROPERTY_NAME_TRANSLATION_X',
"0",
"360",
"0",
"360",
"0",
"360",
"0",
"360",
"0",
"360",
1000,
-1,
10000,
false,
false,
{
  type: ES_CYCLE_INTERPOLATOR,
});

注意