The textStyle() function in p5.js is used to set or return the style of the text for system fonts to NORMAL, ITALIC, BOLD, or BOLDITALIC. This may be overridden by CSS styling.
Syntax:
textStyle(style)
or
textStyle()
Parameters: This function accepts a single parameter style that stores the styling Constant.
The below programs illustrate the textStyle() function in p5.js.
Example 1: This example uses the textStyle() function to set the style of text.
function setup() {
// Create Canvas of given size
createCanvas(380, 170);
} function draw() {
let string = "GeeksforGeeks" ;
// Set the background color
background(220);
// Set the text style
textStyle(ITALIC);
// Set the text size
textSize(16);
// Set the text
text(string, 20, 30);
// Set text styling
textStyle(BOLD);
text(string, 20, 70);
// Set text styling
textStyle(BOLDITALIC);
text(string, 20, 110);
} |
Output:
Example 2: This example uses the textStyle() function to return the style of text.
function setup() {
// Create Canvas of given size
createCanvas(380, 170);
} function draw() {
let string = "GeeksforGeeks" ;
// Set the background color
background(220);
// Set text style
textStyle(BOLD);
// Set the text size
textSize(16);
// Get the value of text style
var u = textStyle();
// Set the stroke color
stroke(255, 204, 0);
// Display the result
text( "Value of Text Style is : " + u, 50, 30);
} |
Output:
Reference: https://p5js.org/reference/#/p5/textStyle