# AnimationObject worklet.decay(Object options, function callback)
小程序插件:不支持
相关文档: worklet 动画
# 功能描述
基于滚动衰减的动画。
# 参数
# Object options
动画配置
属性 | 类型 | 默认值 | 必填 | 说明 |
---|---|---|---|---|
velocity | number | 0 | 否 | 初速度 |
deceleration | number | 0.998 | 否 | 衰减速率 |
clamp | Array | [] | 否 | 边界值,长度为 2 的数组 |
# function callback
动画完成回调。动画被取消时,返回 fasle,正常完成时返回 true。
# 返回值
# AnimationObject
返回 AnimationObject 类型值,可直接赋值给 SharedValue。
# 示例代码
<pan-gesture-handler onGestureEvent="handlepan">
<view class="circle"></view>
</pan-gesture-handler>
const { shared, decay } = wx.worklet
Page({
onLoad() {
this._offset = shared(0);
this.applyAnimatedStyle('.circle', () => {
'worklet';
return {
transform: `translateX(${this._offset.value}px)`
};
});
},
handlepan(evt) {
'worklet';
if (evt.state === GestureState.ACTIVE) {
this._offset.value += evt.deltaX;
} else if (evt.state === GestureState.END) {
this._offset.value = decay({
velocity: evt.velocityX,
clamp: [-200, 200],
},
() => {
'worklet'
console.info('@@@ decay finish')
}
);
}
}
});