aframe /动画：如何暂停和恢复？

问题描述：

我在aframe（ar.js）中有一个360°的旋转动画，我想暂停并继续它，而我所能做的只是暂停，但从开始重新开始。aframe /动画：如何暂停和恢复？

<a-entity> 
    <a-entity 
     gltf-model="#tree-gltf"> 
    </a-entity> 
    <a-animation 
     begin="rotation-begin" 
     end="rotation-end" 
     attribute="rotation" 
     to="0 360 0" 
     direction="alternate" 
     dur="10000" 
     repeat="indefinite"> 
    </a-animation> 
</a-entity>

Animation documentation给予获得“开始”和“结束”的事件，但在暂停时从一开始从当前值“开始”重启并没有。

Entity documentation给予访问暂停（）和播放（），这是相同的。如果“开始”属性存在，则Play（）根本不起作用，因此您必须在事件或功能之间进行选择。但是，play（）也会从开始处重新开始动画，而不是从动画暂停的位置开始。

我还试图通过将属性“dur”设置为一个小时来减慢动画，使其看起来像暂停，但将“dur”设置回10秒不会重新启动它。

任何想法可以帮助吗？

您是否尝试过使用'fill = forwards'与动画？这可能会在动画暂停之前设置新值，所以当动画再次重新启动时不会重置。否则，您可能可以使用另一个动画一起填充 –

fill = forward是默认值，所以是的。我也尝试过所有其他值没有成功，因为它定义了一旦停止/暂停帧的位置，而不是重新启动时该做什么。无论如何，谢谢。 – MadsenFr

答

使用Kevin Ngo的animation-component有助于正确支持暂停/恢复。

除了包括组件，您的代码将是这样的：

<a-entity 
    animation="property:rotation; startEvents:rotation-begin; pauseEvents: rotation-pause; resumeEvents: rotation-resume; to:0 360 0; dir:alternate; dur:10000; repeat:indefinite" 
    gltf-model="#tree-gltf"> 
</a-entity>

这会给你三个事件：rotation-begin，rotation-pause和rotation-resume，你可以触发。

See a demo here

非常感谢，我错过了Aframe/Animation文档顶部的[link]（https://github.com/ngokevin/kframe/tree/master/components/animation/）。它做的工作看到[CodePen]（https://codepen.io/MadsenFr/pen/ZaoXEM），我用“loop：true”取代了“repeat：indefinite”，并使用了restartEvents。 – MadsenFr

aframe /动画：如何暂停和恢复？

相关推荐