p5.js Color setAlpha()用法及代碼示例

p5.js中的setAlpha()方法用於設置p5.Color對象的alpha分量。 alpha值的範圍取決於當前的顏色模式。在默認的RGB顏色模式下，該值可以在0到255之間。

用法:

setAlpha( alpha )

參數：此方法接受如上所述和以下描述的單個參數：

alpha:它是一個數字，表示新的alpha值。

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

範例1：

Javascript

function setup() { 
  createCanvas(600, 300); 
  
  alphaSlider = createSlider(0, 255, 128); 
  alphaSlider.position(30, 50); 
} 
  
function draw() { 
  clear(); 
  textSize(18); 
  
  // Get the alpha value from the slider 
  let alphaValue = alphaSlider.value(); 
  
  let newColor = color(128, 255, 128); 
  
  // Set the alpha value of the color 
  newColor.setAlpha(alphaValue); 
    
  background(newColor); 
  fill('black'); 
  text("Move the slider to change the " + 
       "alpha component of the background color", 
       20, 20); 
    
}

輸出：

範例2：

Javascript

function setup() { 
  createCanvas(600, 300); 
  
  alphaSlider = createSlider(0, 255, 128); 
  alphaSlider.position(30, 50); 
} 
  
function draw() { 
  clear(); 
  textSize(18); 
  
  noFill(); 
  stroke(0); 
  strokeWeight(50); 
  ellipse(width / 2, height / 2, 150); 
  strokeWeight(1); 
  
  // Get the alpha value from the slider 
  let alphaValue = alphaSlider.value(); 
  
  let newColor = color(255, 128, 128); 
  
  // Set the alpha value of the color 
  newColor.setAlpha(alphaValue); 
    
  noStroke(); 
  background(newColor); 
  fill('black'); 
  text( 
    "Move the slider to change the " + 
    "alpha component of the background color", 
    20, 20); 
    
}

輸出：

在線編輯： https://editor.p5js.org/

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

參考：https://p5js.org/reference/#/p5.Color/setAlpha

相關用法

注：本文由純淨天空篩選整理自sayantanm19大神的英文原創作品 p5.Color setAlpha() Method。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。