square |
Forma |
Primitivas 2D |
src/core/shape/2d_primitives.js |
<p>Dibuja un cuadrado.</p>
<p>Un cuadrado es una forma de cuatro lados definida por los parámetros <code>x</code>, <code>y</code> y <code>s</code>.
<code>x</code> y <code>y</code> establecen la ubicación de su esquina superior izquierda. <code>s</code> establece su ancho y altura. Cada ángulo en el cuadrado mide 90˚ y todos sus lados tienen la misma longitud. Consulta <a href="/reference/p5/rectMode">rectMode()</a> para otras formas de definir cuadrados.</p>
<p>La versión de <code>square()</code> con cuatro parámetros crea un cuadrado redondeado.
El cuarto parámetro establece el radio para las cuatro esquinas.</p>
<p>La versión de <code>square()</code> con siete parámetros también crea un cuadrado redondeado. Cada uno de los últimos cuatro parámetros establece el radio de una esquina. Los radios comienzan con la esquina superior izquierda y avanzan en sentido horario alrededor del cuadrado. Si se omite alguno de estos parámetros, se establecen en el valor del último radio que se estableció.</p>
|
1224 |
false |
method |
<div>
<code>
function setup() {
createCanvas(100, 100);
background(200);
square(30, 20, 55);
describe('A white square with a black outline in on a gray canvas.');
}
</code>
</div>
<div>
<code>
function setup() {
createCanvas(100, 100);
background(200);
// Give all corners a radius of 20.
square(30, 20, 55, 20);
describe(
'A white square with a black outline and round edges on a gray canvas.'
);
}
</code>
</div>
<div>
<code>
function setup() {
createCanvas(100, 100);
background(200);
// Give each corner a unique radius.
square(30, 20, 55, 20, 15, 10, 5);
describe('A white square with a black outline and round edges of different radii.');
}
</code>
</div>
<div>
<code>
function setup() {
createCanvas(100, 100, WEBGL);
background(200);
square(-20, -30, 55);
describe('A white square with a black outline in on a gray canvas.');
}
</code>
</div>
<div>
<code>
function setup() {
createCanvas(100, 100, WEBGL);
describe('A white square spins around on gray canvas.');
}
function draw() {
background(200);
// Rotate around the y-axis.
rotateY(frameCount * 0.01);
// Draw the square.
square(-20, -30, 55);
}
</code>
</div>
|
|
p5 |
| name |
description |
type |
x |
<p>Coordenada x del cuadrado.</p>
|
Number |
|
| name |
description |
type |
y |
<p>Coordenada y del cuadrado.</p>
|
Number |
|
| name |
description |
type |
s |
<p>Tamaño del lado del cuadrado.</p>
|
Number |
|
| name |
description |
type |
optional |
tl |
<p>Radio opcional de la esquina superior izquierda.</p>
|
Number |
true |
|
| name |
description |
type |
optional |
tr |
<p>Radio opcional de la esquina superior derecha.</p>
|
Number |
true |
|
| name |
description |
type |
optional |
br |
<p>Radio opcional de la esquina inferior derecha.</p>
|
Number |
true |
|
| name |
description |
type |
optional |
bl |
<p>Radio opcional de la esquina inferior izquierda.</p>
|
Number |
true |
|
|
true |