animation.translate()

对 X 轴坐标进行倾斜

参数

参数类型说明
number txnumber在 X 轴平移的距离
number tynumber在 Y 轴平移的距离

返回值

返回值类型说明
animationanimation动画实例
注: 调用export方法后不会清除该样式

示例

  1. <template>
  2. <view>
  3. <view class="block" c-animation="{{animationData}}" c-bind:click="handleClick">
  4. <text>请点击我</text>
  5. </view>
  6. </view>
  7. </template>
  8. <script>
  9. import { createAnimation } from "chameleon-api";
  10. const animation = createAnimation();
  11. class Index {
  12. data = {
  13. animationData: null,
  14. }
  15. methods = {
  16. handleClick() {
  17. this.animationData = animation
  18. .translate(100, 100).step({duration: 1000})
  19. .export();
  20. }
  21. }
  22. }
  23. export default new Index();
  24. </script>
  25. <style scoped>
  26. .block {
  27. position: absolute;
  28. width: 200cpx;
  29. height: 200cpx;
  30. background-color: #E3EDCD;
  31. }
  32. </style>
  33. <script cml-type="json">
  34. {
  35. "base": {
  36. "usingComponents": {}
  37. }
  38. }
  39. </script>