Example | Constructor | Variables | Functions
Checkbox class.
let gui;
// Create a variable for your Toggle
let t;
function setup() {
createCanvas(400, 400);
gui = createGui();
// Create Toggle
t = createToggle("Toggle", 100, 50, 200, 50);
}
function draw() {
background(220);
drawGui();
if (t.isPressed) {
// Print a message when Toggle is pressed
// that displays its value.
print(t.label + " is " + t.val);
}
if (t.val) {
// Draw an ellipse when Toggle is true.
fill(255, 0, 0);
ellipse(200, 300, 100);
}
}
/// Add these lines below sketch to prevent scrolling on mobile
function touchMoved() {
// do some stuff
return false;
}
let gui;
let cb;
function setup() {
createCanvas(400, 400);
gui = createGui();
cb = createCheckbox("Checkbox", 50, 50);
}
Creates a new GuiCheckbox
object. This is a checkbox which functions like a toggle button.
createCheckbox(label, x, y, [w], [h], [defaultVal])
label
String: label for the GuiCheckboxx
Number: x-coordinate of the GuiCheckboxy
Number: y-coordinate of the GuiCheckboxw
Number: width of the GuiCheckbox (default is 32)h
Number: height of the GuiCheckbox (default is 32)defaultVal
Number: default value for your GuiCheckbox (default isfalse
)
GuiCheckbox
checkbox.val = True;
print(checkbox.val)
Value of the GuiCheckbox
.
checkbox.setStyle("fillBg", color(255, 0, 0));
checkbox.setStyle({
fillBg: color("#FF0000"),
rounding: 10,
textSize: 40
});
Individual GuiCheckbox
objects can be styled using this method. There are two types of input it takes. Use an input string and value to set an individual property, and use an Object
with key/value notation to set multiple properties at once.
setStyle(property, value)
setStyle(Object)
property
String: name of property to be set
value
Number|String|Object: value of property to be set
Object
Object: multiple propertys and values to be set
None
The GuiCheckbox
style properties are:
strokeWeight
Number: the weight (in pixels) of the strokerounding
Number: radius of cornerstextSize
Number: the size of the letters in units of pixelsfillBg
p5.Color: default background colorfillBgHover
p5.Color: hover background colorfillBgActive
p5.Color: active background colorfillCheck
p5.Color: default check colorfillCheckHover
p5.Color: hover check colorfillCheckActive
p5.Color: active check colorstrokeBg
p5.Color: default stroke color