p5.MediaElement volume() 方法

p5.js 中 p5.MediaElement 的volume() 方法用于设置或返回媒体元素的当前音量。可以使用介于 0.0 和 1.0 之间的值指定音量，其中 0.0 表示没有来自媒体的音量，值 1.0 表示最大音量。任何中间值都可用于指定所需的体积。

不向函数传递任何参数即可返回媒体的当前音量。

句法：

volume( val )

参数：此方法接受如上所述和如下所述的单个参数：

• val：它是一个数字，指定要设置的音量。它可以是介于 0.0 和 1.0 之间的体积。它是一个可选参数。

返回值：此方法返回一个数字，表示媒体元素的当前音量。

以下示例说明了 p5.js 中的volume() 方法：

示例 1：

Javascript

let currVolume = 0.5;
  
function setup() {
    createCanvas(500, 400);
    textSize(18);
  
    text("Click on the buttons to increase " +
         "or decrease the volume", 20, 20);
  
    example_media =
      createVideo("sample-video.mp4");
    example_media.size(500, 300);
    example_media.position(20, 100);
    example_media.showControls();
  
    example_media.volume(currVolume);
  
    incBtn = createButton("Increase Volume");
    incBtn.position(30, 40);
    incBtn.mousePressed(incVol);
  
    decBtn = createButton("Decrease Volume");
    decBtn.position(160, 40);
    decBtn.mousePressed(decVol);
  
    text("The video is playing at " +
         "half volume", 20, 80);
}
  
function incVol() {
  clear();
  
  if (currVolume < 0.9)
    currVolume += 0.1;
  
  // Set the new higher volume
  example_media.volume(currVolume);
  
  text("The volume has been increased",
       20, 80);
  
  text("Click on the buttons to increase " + 
       "or decrease the volume", 20, 20);
}
  
function decVol() {
  clear();
  
  if (currVolume > 0.1)
    currVolume -= 0.1;
  
  // Set the new lower volume
  example_media.volume(currVolume);
  
  text("The volume has been decreased",
       20, 80);
  
  text("Click on the buttons to increase " +
       "or decrease the volume", 20, 20);
}

输出：

示例 2：

Javascript

function setup() {
  createCanvas(500, 400);
  textSize(20);
  
  text("Move the slider to increase or " +
       "decrease the volume", 20, 20);
  
  example_media =
    createVideo("sample-video.mp4");
  example_media.size(500, 300);
  example_media.position(20, 80);
  
  example_media.showControls();
  
  volSlider =
    createSlider(0.0, 1.0, 0.5, 0.1);
  volSlider.position(20, 40);
  volSlider.input(changeVol);
}
  
function changeVol() {
  clear();
  
  let volumeVal = volSlider.value();
  
  // Set the media volume to the slider value
  example_media.volume(volumeVal);
  
  // Get the current volume
  let currVolume = example_media.volume();
  
  text("Move the slider to increase or " +
       "decrease the volume", 20, 20);
  text("Video is playing at volume: " +
       currVolume, 20, 80);
}

输出：

在线编辑器： https://editor.p5js.org/
环境设置： https://www.geeksforgeeks.org/p5-js-soundfile-object-installation-and-methods/
参考： https://p5js.org/reference/#/p5.MediaElement/volume