Question

我尝试在用户点击文本框后使用a-animation组件或aframe-animation-component为A框架中的平面设置动画。我想将平面旋转到垂直位置，以便用户跌倒。动画在没有事件侦听器的情况下工作，但是当我将startEvents或begin属性添加到包含该平面的a-entity时，它无法触发。名为fallclick的活动是在点击它时从a-entity文本fallSelector发出的。

以下是我的HTML代码的一部分：

<a-entity 
                static-body
                id="plane" 
                rotation="-90 0 0" 
                geometry="primitive: plane; width: 2; height: 2" 
<!--            animation="property: rotation; to: 0 0 0; delay: 500; startEvents: fallclick;" -->
                >
        <a-animation attribute="rotation" to="0 0 0" delay="500" dur="1000" begin="fallclick" ></a-animation>
</a-entity>

以下是JavaScript事件代码：

fallSelector.addEventListener('click', function () {
            fallSelector.emit('fallclick');
            console.log(fallSelector + ': Emit fallclick');
});

Answer 1

1）对于<a-animation>组件，您需要在动画原语上发出事件：

<a-animation id="my-animation" begin="foo"></a-animation>
<!-- js: my-animation.emit("foo") --!>

2）对于动画组件，您需要在包含动画的实体上发出事件

<a-entity id="bar" animation="startEvents: foo"></a-entity>
<!-- js: bar.emit("foo") --!>

live fiddle here

没有从事件发射开始的A帧动画

1 个答案: