GLTF 实体动画在 0.9 帧结束后的入口点。*

Question

我有一个基本的 aframe 应用程序，显示带有内置动画的 GLTF 模型。当内置动画结束时，是否可以有一个入口点来做某事？

代码：

<!doctype HTML>
<html>
    <head>
        <meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
    </head>
    <script src="https://aframe.io/releases/0.9.2/aframe.min.js"></script>

    <body style='margin : 0px; overflow: hidden;'>
        <a-scene >

        <a-assets>
            <a-asset-item id="animated-asset" src="https://raw.githubusercontent.com/nicolocarpignoli/nicolocarpignoli.github.io/master/ar-playground/models/CesiumMan.gltf"></a-asset-item>
        </a-assets>
        <a-entity gltf-model="#animated-asset" scale="2"></a-entity>

        <a-entity camera></a-entity>
        </a-scene>
    </body>
</html>

Answer 1

动画不适用于原版 a 帧，所以我 assuming you're using aframe-extras 支持动画。

根据 docs，您可以使用两个事件来确定动画何时结束：

animation-loop - 当一个循环完成时
animation-finished - 当所有循环结束时

所以你可以创建一个组件（这里cycle-count）：

<a-entity gltf-model="#animated-asset" animation-mixer cycle-count>

它将等待 animation-loop 事件，并在动画循环结束时通知您：

AFRAME.registerComponent('cycle-count', {
  init: function() {
      this.el.addEventListener('animation-loop', e => {
          // cycle finished - do whatever you need
      })
  }
})

fiddle 记录周期 here。

GLTF 实体动画在 0.9 帧结束后的入口点。*

Entry point after GLTF entity animation ends on aframe 0.9.*

html

javascript

aframe