도형과 색

stroke() 함수는 이후에 그릴 선의 색상을 설정합니다. 선을 그리기 전에 호출해야 설정한 색상으로 선을 그릴 수 있습니다. 값을 하나만 입력하면 같은 값으로 세 개의 값을 모두 입력한 것과 같습니다.

• stroke(R, G, B)

• stroke(value)

line() 함수는 선을 그립니다. x1과 y1은 선의 한 쪽 끝에 대한 X, Y 좌표이고, x2와 y2는 다른 한 쪽 끝에 대한 X, Y 좌표입니다. 즉, (x1, y1) 위치에서 (x2, y2) 위치까지 선을 그립니다.

• line(x1, y1, x2, y2)

창의 좌표계는 원점이 창의 제일 왼쪽 위에 있고, 오른쪽 방향이 X축의 양수 방향, 아래쪽 방향이 Y축의 양수 방향입니다.

strokeWeight() 함수는 이후에 그릴 선의 두께를 픽셀 값으로 설정합니다. 선을 그리기 전에 호출해야 설정한 두께로 선을 그릴 수 있습니다.

• strokeWeight(pixel) // 높은 숫자일 수록 두꺼움

rect() 함수는 직사각형을 그립니다. x와 y는 직사각형의 왼쪽 위 꼭지점에 대한 X, Y 좌표이고, width와 height는 직사각형의 폭과 높이입니다. 즉, (x, y) 위치에 폭 width, 높이 height의 직사각형을 그립니다.

• rect(x, y, width, height)

• rect(10, 20, 300, 200);

rect() 함수에 값을 하나 더 입력하면 둥근 정도(corner)를 픽셀 값으로 설정할 수 있습니다. 값이 클수록 더 둥근 사각형이 됩니다.

• rect(x, y, width, height, corner)

• rect(10, 20, 300, 200, 10);

값을 더 입력하면 네 모서리의 둥근 정도를 다르게 할 수 있습니다. 사각형 왼쪽 위를 시작으로 시계 방향으로 왼쪽 위(tl), 오른쪽 위(tr), 오른쪽 아래(br), 왼쪽 아래(bl) 순서입니다.

• rect(x, y, width, height, tl, tr, br, bl)

• rect(10, 20, 300, 200, 10, 20, 30, 40);

ellipse() 함수는 타원을 그립니다. cx와 cy는 타원 중심의 X, Y 좌표이고, width와 height는 타원의 폭과 높이입니다. 즉, (cx, cy) 위치를 중심으로 폭 width, 높이 height의 타원을 그립니다.

• ellipse(cx, cy, width, height)

• ellipse(160, 120, 300, 200);

point() 함수는 점을 그립니다. x와 y는 점의 X, Y 좌표입니다. 즉, (x, y) 위치에 점을 그립니다.

• point(x, y)

• point(160, 120);

triangle() 함수는 삼각형을 그립니다. 삼각형을 그리려면 세 개의 꼭짓점이 필요한데, x1과 y1은 첫 번째 꼭짓점의 X, Y 좌표, x2와 y2는 두 번째 꼭짓점의 X, Y 좌표, x3과 y3은 세 번째 꼭짓점의 X, Y 좌표입니다. 즉, (x1, y1), (x2, y2), (x3, y3)을 세 개의 꼭짓점으로 하는 삼각형을 그립니다.

• triangle(x1, y1, x2, y2, x3, y3)

• triangle(10, 20, 300, 200, 200, 300);

quad() 함수는 일반적인 사각형을 그립니다. 사각형을 그리려면 네 개의 꼭짓점이 필요한데, x1과 y1은 첫 번째 꼭짓점의 X, Y 좌표, x2와 y2는 두 번째 꼭짓점의 X, Y 좌표, x3과 y3은 세 번째 꼭짓점의 X, Y 좌표, x4와 y4는 네 번째 꼭짓점의 X, Y 좌표입니다. 즉, (x1, y1), (x2, y2), (x3, y3), (x4, y4)를 네 개의 꼭짓점으로 하는 사각형을 그립니다.

• quad(x1, y1, x2, y2, x3, y3, x4, y4)

• quad(10, 20, 300, 200, 200, 300, 100, 250);

text() 함수는 글자를 표시합니다. str은 표시할 글자이고, x와 y는 글자의 X, Y 좌표입니다. 글자의 색상은 fill() 함수에 의해 결정됩니다.

• text(str, x, y)

• text("Hamster", 100, 50);

textSize() 함수는 글자의 크기를 픽셀 값으로 설정합니다.

• textSize(pixel)