Sound

Eva.js audio plugin, the ability to add audio control to the game object, use the Web Audio API to play by default.

Install

With NPM

  1. tnpm install @eva/plugin-sound

In Browser

  1. <script src="https://unpkg.com/@eva/plugin-sound@1.2.x/dist/EVA.plugin.sound.min.js"></script>

Usage

  1. import { Game, GameObject, resource, RESOURCE_TYPE } from '@eva/eva.js';
  2. import { RendererSystem } from '@eva/plugin-renderer';
  3. import { Sound, SoundSystem } from '@eva/plugin-sound';
  5. // add audio resource
  6. resource.addResource([
  7.   {
  8.     name: 'bgSound',
  9.     type: RESOURCE_TYPE.AUDIO,
  10.     src: {
  11.       audio: {
  12.         type: 'audio',
  13.         url: 'https://g.alicdn.com/ltao-fe/duck_assets/0.0.1/assets/duckBg.mp3',
  14.       },
  15.     },
  16.     preload: true,
  17.   },
  18.   {
  19.     name: 'successSound',
  20.     src: {
  21.       audio: {
  22.         type: 'audio',
  23.         url:
  24.           'https://g.alicdn.com/ltao-fe/factory/1.1.3/assets/game/sound/success.mp3',
  25.       },
  26.     },
  27.     preload: true,
  28.   },
  29. ]);
  31. const game = new Game({
  32.   systems: [
  33.     new RendererSystem({
  34.       canvas: document.querySelector('#canvas'),
  35.       width: 750,
  36.       height: 1000,
  37.     }),
  38.     new SoundSystem();
  39.   ],
  40.   autoStart: true,
  41.   frameRate: 60,
  42. });
  44. const bgSoundObj = new GameObject('sound');
  45. const bgSound = bgSoundObj.addComponent(
  46.   new Sound({ resource: 'bgSound', loop: true, autoplay: true, volume: 0.5 })
  47. );
  49. bgSound.play();

If you want to play a part of the audio, you can control it through the seek property and the duration property. Refer to the property table for details. The following example indicates that the Component starts playing at 1.2 seconds and stops after playing for 3 seconds.

  1. const bgSound = bgSoundObj.addComponent(
  2.   new Sound({ resource: 'bgSound', autoplay: true, volume: 0.5, seek: 1.2, duration: 3 })
  3. );

API

Sound

Constructor

| | resource | string | ‘’ | The name of the audio resource registered in the resource | | autoplay | boolean | false | | | muted | boolean | false | | | loop | boolean | false | | | volume | number | 1 | [0-1] | | seek | number | 0 | ArrayBufferSourceNode.start(when, seek, duration) MDN | | duration | number | | ArrayBufferSourceNode.start(when, seek, duration) MDN | | onEnd | () => void | - | Triggered at the end of playback |

属性

| | muted | boolean | false | | | volume | number | 1 | [0-1] | | play | () => void | - | | | pause | () => void | - | | | stop | () => void | - | |

SoundSystem

Options

| | autoPauseAndStart | boolean | true | whether to pause and start synchronously with eva game | | onError | (error) => void | - | error handling event |

Property

| | muted | boolean | false | | | volume | number | 1 | [0-1] | | resumeAll | () => void | - | | | pauseAll | () => void | - | | | stopAll | () => void | - | |

Tips

If the browser restricts the need for interaction to start playing audio, the plug-in will automatically try to enable audio after the page interacts.