Question

我正在研究A-Frame，找不到任何显示如何设置动画之间延迟的教程。我将如何用尽可能少的代码行做到这一点？

代码：

<a-box color=¨#fffff¨position="-5 0 -10" width="2.5" height="1.7" depth="1.7"> 
    <a-animation attribute="position" from="-5 0 -10" to="-14 -0.8 -10" dur="6000">
    </a-animation> 
    <a-animation attribute="rotation" from="0 0 0" to="0 0 10" dur="6000"> 
    </a-animation> 
</a-box>

Answer 1

尝试https://www.npmjs.com/package/aframe-animation-timeline-component

或者编写一个组件来触发第一个动画，等待，然后触发第二个动画。

AFRAME.registerComponent('trigger', {
  init: function () {
    this.el.emit('triggerfirst');
    setTimeout(() => {
      this.el.emit('triggersecond');
    }, 300);
  }
});

<a-entity animation__1="startEvents: triggerfirst" animation__2="startEvents: triggersecond" trigger>

如果需要，您也可以让trigger组件等待事件。

如何在HTML A帧中设置延迟

1 个答案: