p5.js createAudio()用法及代码示例

createAudio()函数用于在DOM中创建音频元素。音频被创建为p5.MediaElement，它具有控制媒体及其播放的方法。

用法:

createAudio(src, callback)

参数：该函数接受上述和以下所述的两个参数：

src:它是指定音频文件路径的字符串或字符串数组。字符串数组可用于指定多个路径以支持各种浏览器。
callback:这是一个回调函数，将在触发“ canplaythrough”事件时触发。音频完成加载并且不需要任何其他缓冲时，将触发此事件。它是一个可选参数。

返回值：它返回一个指向带有音频的p5.MediaElement的指针。

以下示例说明了p5.js中的createAudio()函数：

范例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(); 
}

输出：

范例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(); 
}

输出：

在线编辑： https://editor.p5js.org/

环境设置： https://www.geeksforgeeks.org/p5-js-soundfile-object-installation-and-methods/

参考： https://p5js.org/reference/#/p5/createAudio

相关用法

注：本文由纯净天空筛选整理自sayantanm19大神的英文原创作品 p5.js | createAudio() Function。非经特殊声明，原始代码版权归原作者所有，本译文未经允许或授权，请勿转载或复制。