Animation.translate3d

解释: 对 X、Y、Z 坐标进行平移变换

方法参数

Number tx, 在 X 轴偏移 txNumber ty,在 Y 轴偏移 tyNumber tz ,在 Z 轴偏移 tz

单位 px。

示例

扫码体验

Animation.translate3d - 图1请使用百度APP扫码

图片示例

Animation.translate3d - 图2

Animation.translate3d - 图3

Animation.translate3d - 图4

代码示例

在开发者工具中预览效果

  1. <view class="wrap">
  2. <view class="animation-element-wrapper">
  3. <view class="animation-element" animation="{{animation}}"></view>
  4. </view>
  5. <view class="card-area">
  6. <view class="top-description border-bottom">展示动画</view>
  7. <button type="primary" bindtap="translate3d">translate3d</button>
  8. </view>
  9. </view>
  1. Page({
  2. data:{ },
  3. onReady() {
  4. this.animation = swan.createAnimation({
  5. transformOrigin: "50% 50%",
  6. duration: 1000,
  7. timingFunction: "ease",
  8. delay: 0})
  9. },
  10. translate3d() {
  11. this.animation.translate3d(Math.random() * 100 - 50,Math.random() * 100 - 50,Math.random() * 100 - 50).step()
  12. this.setData({animation: this.animation.export()})
  13. },
  14. });