p5.js createCheckbox() Function
Last Updated :
16 Aug, 2023
The createCheckbox() function in p5.js is used to create a checkbox element in the DOM (Document Object Model). This function includes the p5.dom library. Add the following syntax in the head section.
Syntax:
createCheckbox(label, value)
Parameters:
- label: This parameter holds the label displayed beside the checkbox.
- value: This parameter holds the state of the checkbox (true/false).
Example: This example uses a checkbox to change the background color from light to dark and vice-versa.
javascript
var checkbox;
function change_bg() {
if ( this .checked()) {
background( "darkgreen" );
}
else {
background( "lightgreen" );
}
}
function setup() {
createCanvas(400, 400);
background( "lightgreen" );
checkbox = createCheckbox( 'Dark Background' , false );
checkbox.position(160, 200);
checkbox.changed(change_bg);
}
|
Output:
Before checking the box:
After checking the box:
Reference: https://p5js.org/reference/#/p5/createCheckbox
Share your thoughts in the comments
Please Login to comment...