La función createAudio() se usa para crear un elemento de audio en el DOM. El audio se crea como p5.MediaElement , que tiene métodos para controlar los medios y su reproducción.
Sintaxis:
createAudio(src, callback)
Parámetros: esta función acepta dos parámetros, como se mencionó anteriormente y se describe a continuación:
- src: es una string o una array de strings que especifica la ruta del archivo de audio. La array de strings se puede usar para especificar múltiples rutas para el soporte de varios navegadores.
- devolución de llamada: es una función de devolución de llamada que se activará cuando se active el evento ‘canplaythrough’. Este evento se activa cuando el audio ha terminado de cargarse y no requiere ningún almacenamiento en búfer adicional. Es un parámetro opcional.
Valor devuelto: Devuelve un puntero al p5.MediaElement con el audio.
Los siguientes ejemplos ilustran la función createAudio() en p5.js:
Ejemplo 1:
function setup() { createCanvas(300, 300); text("Click on the buttons below to"+ "play/pause the audio", 20, 20); audioElement = createAudio("sample_audio.wav"); audioElement.position(20, 50); audioElement.size(300); // Show the audio controls audioElement.showControls(); }
Producción:
Ejemplo 2:
function setup() { createCanvas(300, 300); text("Loading the audio...", 20, 20); audioElement = createAudio("sample_audio.mp3", afterLoad); audioElement.position(20, 20); audioElement.size(300); playBtn = createButton("Play Audio"); playBtn.position(30, 80); playBtn.mouseClicked(playAudio); pauseBtn = createButton("Pause Audio"); pauseBtn.position(150, 80); pauseBtn.mouseClicked(pauseAudio); } function afterLoad() { text("The audio has finished loading and"+ " can now be played!", 20, 40); } function playAudio() { audioElement.play(); } function pauseAudio() { audioElement.pause(); }
Producción:
Editor en línea: https://editor.p5js.org/
Configuración del entorno: https://www.geeksforgeeks.org/p5-js-soundfile-object-installation-and-methods/
Referencia: https://p5js.org/reference/#/p5/createAudio
Publicación traducida automáticamente
Artículo escrito por sayantanm19 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA