La función textAlign() en p5.js se usa para establecer la alineación para dibujar el texto. Esta función acepta dos parámetros horizAlign y vertAlign. El parámetro horizAlign establece la alineación en el eje x y el parámetro vertAlign establece la alineación en el eje y.
Sintaxis:
textAlign( horizAlign, vertAlign)
o
textAlign()
Parámetros: esta función acepta dos parámetros, como se mencionó anteriormente y se describe a continuación:
- horizAlign: este parámetro almacena la alineación horizontal del texto como (IZQUIERDA, CENTRO o DERECHA).
- vertAlign: este parámetro almacena la alineación vertical del texto como (ARRIBA, ABAJO, CENTRO o LÍNEA DE BASE).
Los siguientes programas ilustran la función textAlign() en p5.js:
Ejemplo 1: Este ejemplo usa la función textAlign() para alinear el contenido horizontalmente.
function setup() {
// Create Canvas of given size
createCanvas(380, 150);
}
function draw() {
// Set the background color
background(220);
let c = 0.5;
// Use atan() function to calculate
// arc tangent value
let ac = atan(c);
// Set font size
textSize(26);
// Set font color
fill(color('green'));
// Set the text alignment to
// CENTER, RIGHT, LEFT
textAlign(LEFT);
text('GEEKS', 100, 30);
textAlign(CENTER);
text('for', 100, 60);
textAlign(RIGHT);
text('GEEKS', 100, 90);
}
Producción:
Ejemplo 2: Este ejemplo usa la función textAlign() para alinear el contenido verticalmente.
function setup() {
// Create Canvas of given size
createCanvas(380, 150);
}
function draw() {
// Set the background color
background(220);
// Set the text size
textSize(26);
// Set the stroke width
strokeWeight(0.5);
// Set the co-ordinates for line
line(0, height/2, width, height/2);
// set the alignment for the text
textAlign(CENTER, TOP);
// Set the text
text('CENTER', 0, height/2, width);
}
Producción:
Referencia: https://p5js.org/reference/#/p5/textAlign
Publicación traducida automáticamente
Artículo escrito por sarthak_ishu11 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA