当前位置: 首页 > 文档资料 > A-Frame 中文文档 >

sound

优质
小牛编辑
127浏览
2023-12-01

The sound component defines the entity as a source of sound or audio. The sound component is positional and is thus affected by the components-position.

Example

            
              <
                a-entity
                id=
                "river"
                geometry=
                "primitive: plane"
                material=
                "color: blue"
            
            
              position=
              "-10 0 0"
              sound=
              "src: url(river.mp3); autoplay: true">
              </
                a-entity>
          

Properties

PropertyDescriptionDefault Value
autoplayWhether to automatically play sound once set.false
onAn event for the entity to listen to before playing sound.null
loopWhether to loop the sound once the sound finishes playing.false
srcSelector to an asset <audio>or url()-enclosed path to sound file.null
volumeHow loud to play the sound.1
poolSizeNumbers of simultaneous instances of this sound that can be playing at the same time1

Methods

Event NameDescription
pauseSoundPause sound.
playSoundPlay sound.
stopSoundStop sound.

Events

Event NameDescription
sound-endedtriggered when sound finishes playing

Playing on an Event

The soundcomponent can also listen to an event before playing as well. For example, we might have a laughing sound play every time we click a monster:

            
              <
                a-entity
                cursor
                position=
                "0 0 -5">
              </
                a-entity>
            
            
              <
                a-entity
                id=
                "elmo"
                geometry=
                "primitive: box"
                material=
                "src: elmo.png"
            
            
              sound=
              "src: url(ticklelaugh.mp3); on: click">
              </
                a-entity>
          

Preloading a Sound Asset

For performance, we recommend to block the scene on the sound asset to preload and cache. We can do so through the asset management system:

            
              <
                a-scene>
            
              <
                a-assets>
            
              <
                audio
                id=
                "river"
                src=
                "river.mp3"
                preload=
                "auto">
              </
                audio>
            
              </
                a-assets>
            
            
              <
                a-entity
                sound=
                "src: #river">
              </
                a-entity>
            
              </
                a-scene>
          

Pause and Resume

To programmatically pause or resume a playing sound, we can tell the entity to pause or resume:

            
              varentity =
              document.querySelector(
              '[sound]');
            entity.components.sound.stopSound();

Or to pause only the sound:

            entity.components.sound.pauseSound();

And to play the sound:

            entity.components.sound.playSound();