GuiObject
August 26, 2019 ยท View on GitHub
GuiObject
Description
GuiObject is the parent class for all p5.touchgui objects. All GuiObject objects have the variables and functions described below.
Variables
val
Example
s = createSlider("Slider", 50, 50);
// Set the value.
s.val = 0.25;
// Reference the value.
print(s.val);
Description
Value of the GuiObject.
label
Example
b = createButton("Button", 50, 50);
// Set the label.
b.label = "New Label";
// Reference the label.
print(b.label);
Description
Label of the GuiObject.
x
Example
b = createButton("Button", 50, 50);
// Set the x-coordinate.
b.x = 100;
// Reference the x-coordinate.
print(b.x);
Description
x-coordinate of the GuiObject.
y
Example
b = createButton("Button", 50, 50);
// Set the y-coordinate.
b.y = 100;
// Reference the y-coordinate.
print(b.y);
Description
y-coordinate of the GuiObject.
w
Example
b = createButton("Button", 50, 50);
// Set the width.
b.w = 128;
// Reference the width.
print(b.w);
Description
Width of the GuiObject.
h
Example
b = createButton("Button", 50, 50);
// Set the height.
b.h = 32;
// Reference the height.
print(b.h);
Description
Height of the GuiObject.
mode
Example
b = createButton("Button", 50, 50);
// Set the interaction mode.
b.mode = "onRelease";
Description
Interaction mode of the GuiObject. Can be set to "onPress" or "onRelease". This determines whether the GuiObject updates its value(s) when it is pressed vs. when it is released. The default setting is "onPress".
isPressed
Example
if (button.isPressed) {
print(button.label + " was pressed!");
}
Description
This is a Boolean that is True when the GuiObject is first pressed and False otherwise.
isHeld
Example
if (button.isHeld) {
print(button.label + " was held!");
}
Description
This is a Boolean that is True when the GuiObject is held and False otherwise.
isReleased
Example
if (button.isReleased) {
print(button.label + " was released!");
}
Description
This is a Boolean that is True when the GuiObject is released and False otherwise.
isChanged
Example
if (button.isChanged) {
print(button.label + " was changed!");
}
Description
This is a Boolean that is True when the GuiObject is changed and False otherwise.
onPress
Example
button.onPress = function() {
print(button.label + " was pressed!");
}
let gui, button;
function setup() {
createCanvas(400, 400);
gui = createGui();
button = createButton("Button", 50, 50);
button.onPress = onButtonPress;
}
function onButtonPress() {
print("Pressed!")
}
Description
A user-defined callback function for onPress events can be added to a GuiObject object. This is then called when a GuiObject is pressed.
onHold
Example
button.onHold = function() {
print(button.label + " was held!");
}
let gui, button;
function setup() {
createCanvas(400, 400);
gui = createGui();
button = createButton("Button", 50, 50);
button.onHold = onButtonHold;
}
function onButtonHold() {
print("Held!")
}
Description
A user-defined callback function for onHold events can be added to a GuiObject object. This is then called when a GuiObject is held.
onRelease
Example
button.onRelease = function() {
print(button.label + " was released!");
}
let gui, button;
function setup() {
createCanvas(400, 400);
gui = createGui();
button = createButton("Button", 50, 50);
button.onRelease = onButtonRelease;
}
function onButtonRelease() {
print("Released!")
}
Description
A user-defined callback function for onRelease events can be added to a GuiObject object. This is then called when a GuiObject is released.
onChange
Example
button.onChange = function() {
print(button.label + " was changed!");
}
let gui, button;
function setup() {
createCanvas(400, 400);
gui = createGui();
button = createButton("Button", 50, 50);
button.onChange = onButtonChange;
}
function onButtonRelease() {
print("Changed!")
}
Description
A user-defined callback function for onChange events can be added to a GuiObject object. This is then called when a GuiObject is changed.
enabled
Example
button.enabled = False;
Description
A Boolean value that determines whether the GuiObject is enabled to receive input. When True, the GuiObject will receive input from mouse and touch; when False, the GuiObject will receive no input, but the value can be set. This may be useful for visualization purposes.
visible
Example
button.visible = False;
Description
A Boolean value that determines whether the GuiObject is visible (i.e. drawn to the canvas). When True, the GuiObject will be drawn; when False, the GuiObject will not be drawn.
Functions
setStyle()
Example
button.setStyle("rounding", 10);
button.setStyle({
rounding: 10,
textSize: 40
});
Description
Individual GuiObject 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.
Syntax
setStyle(property, value)
setStyle(Object)
Parameters
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
Returns
None
draw()
Example
button.draw()
Description
This can be used to draw the individual GuiObject. This is not recommended, as it does not also update the GuiObject. Please instead use global function drawGui() to draw all objects.
Syntax
draw()
Parameters
None
Returns
None