A型暂停/播放动画混合器

Question

我想知道如何使用 Aframe extras 组件的动画混合器属性来暂停/播放动画。目前，我的场景中有一个带动画的鸟的 gltf 模型。我想做的是，当单击暂停按钮时，发出一个函数并且动画将暂停，当触发播放函数时，动画将从停止的地方继续。如何才能做到这一点？当前代码：

    <script src="https://aframe.io/releases/1.2.0/aframe.min.js"></script>
<script src="https://cdn.jsdelivr.net/gh/donmccurdy/aframe-extras@v6.1.1/dist/aframe-extras.min.js"></script>
<script>

function pause() {
//pause the animation
}

function play() {

//play the animation
}</script>
<button onclick="pause()" style="z-index: 10000000; position: fixed; margin-top: 0px; cursor: pointer;">
Pause
</button>
<button onclick="play()" style="z-index: 10000000; position: fixed; margin-top: 0px; cursor: pointer; margin-left: 50px;">
play
</button>
<a-scene>
  <a-entity gltf-model="https://cdn.glitch.global/815f53ca-b7db-40aa-8843-e718abdfbf6d/scene%20-%202022-01-16T183239.246.glb?v=1642386788500" position="20 0 -35" rotation="0 90 0" scale="0.1 0.1 0.1" animation-mixer="clip:Take 001; loop:10000000000000000000; timeScale: 1; crossFadeDuration: 1"></a-entity>
</a-scene>

我读到了donmccurdy在 github 上发布的一个可能的解决方案，但我不确定如何以有效的方式将其放入我的代码中。帖子链接：https://github.com/n5ro/aframe-extras/issues/222

链接到拨弄代码：https ://jsfiddle.net/AidanYoung/0eufcg52/7/

Answer 1

Don 的解决方案基于更改timeScale用作播放速度的缩放因子（文档）：

// grab the entity reference
const el = document.querySelector("a-entity")
// pause - run at 0 speed
el.setAttribute('animation-mixer', {timeScale: 0});
// play - run at normal speed(1)
el.setAttribute('animation-mixer', {timeScale: 1});

应用于您的代码：

// grab the entity reference
const el = document.querySelector("a-entity")
// pause - run at 0 speed
el.setAttribute('animation-mixer', {timeScale: 0});
// play - run at normal speed(1)
el.setAttribute('animation-mixer', {timeScale: 1});

NORBERTO-3D模型（CC 归属）