A-Frame-使用自定义（“ a-sound”）源播放/暂停声音

问题描述

编辑2：这是工作代码。非常感谢Piotr的帮助，没有你们，我可以毫不费力地做到这一点。

Edit 2: Here is the working code. Many thanks to Piotr for his help I couldn't have done it so effortlessly without you guys.

sceneEl.querySelector('a-sound').setAttribute('sound', {src:url3}); 
      let playing = false;
      var el = document.querySelector('a-box');
      let audioEl = document.querySelector("a-sound");
      var audio = audioEl.components.sound;
      el.addEventListener('click', () => {
      if (!playing) {
      audio.playSound();
      } else {
      audio.stopSound();
      }
      playing = !playing;
      })


      } );
      request.send( null );
      }
      });

编辑：我从动态URL（在我的JSON文件中）播放声音，但是我似乎无法正确获取事件监听器功能（用于播放/暂停单击）。

I've got the sound playing from a dynamic URL (in my JSON file), but I cant seem to get the event listener function right (for playing / pausing on click).

sceneEl.querySelector('a-sound').setAttribute('sound', {src:url3}); 
      let audioEl = document.querySelector("a-sound");
      let audio = audioEl.components.sound;
      sceneEl.querySelector('a-box').addEventListener('click', function () {
      if(!playing) {
          audio.play();
       } else {
          audio.pause();
          audio.currentTime = 0;
       }
       playing = !playing;
       });   
    } );
      request.send( null );
      }
      });

原文：我正在使用组件，但我想播放（'a-sound'）实体中来自src的声音而不是通过资产链接。原因是因为我正在从JSON数组动态加载声音文件，所以它们不存在于任何资产列表中。我已经加载了所有文件，但是很难使该组件挂接到已加载的 sceneEl.querySelector（'a-sound'）。setAttribute（'sound'，{src：url3}））； 代码。我认为这只是一个小语法问题，但我不确定100％。有人可以看一会儿，然后告诉我它是否可行吗？这是代码（与querySelector中的（声音）相同，与链接相同。）

Original: I'm using this component in A-Frame, but I'm looking to play the sound from the src in the ('a-sound') entity rather than from the asset link. The reason is because I'm loading the sound files dynamically from a JSON array so they don't exist in any list of assets. I've got all my files loading but am having trouble getting this component to hook into my loaded sceneEl.querySelector('a-sound').setAttribute('sound', {src:url3}); code. I'm thinking its just a small syntax issue but I'm not 100% sure. Could someone please look over this for a minute and tell me if its doable? This is the code (same as the link except for the (a-sound) within the querySelector.

       AFRAME.registerComponent('audiohandler', {
       init:function() {
       let playing = false;
       let audio = document.querySelector('a-sound');
       this.el.addEventListener('click', () => {
       if(!playing) {
          audio.play();
       } else {
          audio.pause();
          audio.currentTime = 0;
       }
       playing = !playing;
       });
       }
       })
    </script> 

推荐答案

使用< a-声音> 您必须以不同的方式处理事情。

Using the <a-sound> You must handle things a bit differently.

播放/停止声音应在声音 。您需要通过 yourEnti访问它tyName.components.sound 并使用 playSound（）和 stopSound（）方法。

playing / stopping the sound should be done within the sound component. You need to access it via yourEntityName.components.sound and use the playSound() and stopSound() methods.

在我的。我通过 setAttribute（）设置源，并设置一个播放/停止按钮。

---

我的< a-sound> 具有要用作按钮的几何形状，但是您可以使 < a-sound> 实体，并像这样使用它：

check it out on my glitch. I set the source via the setAttribute(), and make a play / stop button.

---

My <a-sound> has a geometry to be a button, but You can make a <a-sound> entity, and use it like this:

let audioEl = document.querySelector("a-sound");
audioEl.setAttribute("src", "sourceURL");

let audio = audioEl.components.sound;
// play = audio.playSound();
// stop = audio.stopSound():

---

此外，还有很多问题，这些节点未完全加载。看看这个例子：

---

Furthermore, there are many issues with the nodes not being fully loaded. Check out this example:

<a-entity component></a-entity>
<a-sound></a-sound>

如果组件试图获取对 document.querySelector（ a-sound）。components.sound ，可能未定义。如果是这样，您应该尝试等到它发出 loaded 信号。

If the component tries to grab a reference to the document.querySelector("a-sound").components.sound, it may be undefined. If so, You should try to wait until it emits the loaded signal.

这篇关于A-Frame-使用自定义（“ a-sound”）源播放/暂停声音的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！