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

p5.js中的createColorPicker()函数用于在DOM(文档对象模型)中创建颜色选择器元素以获取输入颜色。 .color()方法用于获取当前选择的颜色。此函数包括p5.dom库。在头部添加以下语法。

<script src= 
"https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.9.0/addons/p5.dom.min.js">  
</script>

用法:

createColorPicker( value )

参数：此函数接受单个参数值，该参数值保留颜色选择器的默认颜色。

例：本示例使用颜色选择器对象设置背景颜色。

// Create a variable for color-picker object 
var color_picker; 
  
function setup() { 
    
    // Create a canvas 
    createCanvas(400,400); 
      
    // Create a color-picker object  
    color_picker = createColorPicker("green"); 
} 
  
function draw() { 
      
    // Set the background-color as 
    // chosen by the color-picker 
    background(color_picker.color()); 
}

输出：

选择颜色之前：
从颜色选择器中选择颜色：
选择颜色后：

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

相关用法

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