worklet.timing

AnimationObject worklet.timing(number toValue, Object options, function callback)

小程序插件：不支持

相关文档: worklet 动画

功能描述

基于时间的动画。

参数

number toValue

目标值

Object options

动画配置

属性	类型	默认值	必填	说明
duration	number	300	否	动画时长
easing	function	Easing.inOut(Easing.quad)	否	动画曲线，参考 Easing 模块。

function callback

动画完成回调。动画被取消时，返回 fasle，正常完成时返回 true。

返回值

AnimationObject

返回 AnimationObject 类型值，可直接赋值给 SharedValue。

示例代码

<view id="moved-box"></view>
<view id="btn" bind:tap="tap">点击驱动小球移动</view>
</code>

<code>
const { shared, timing, Easing } = wx.worklet
Page({
  onLoad() {
    const offset = shared(0)
    this.applyAnimatedStyle('#moved-box', () => {
      'worklet';
      return {
        transform: `translateX(${offset.value}px)`
      }
    })
    this._offset = offset
  }
  tap() {
    const random = Math.random()
    this._offset.value = timing(random, {
        duration: 500,
        easing: Easing.bezier(0.25, 0.1, 0.25, 1),
      }),
    };
})