소개

이번 짧은 스크립트에서는 '랜덤 서클'이라는 랜덤으로 원이 넘치는 프로젝트를 만들고 싶습니다.
길이: ７行 ( 124文字 )

작품 샘플

최종 코드

random_circles.pde

void setup(){
  size(500,500);
}

void draw(){
  fill(random(255), random(255), random(255), 200);
  ellipse(random(500), random(500), 40 , 40);
}

코드 해설

1. void setup(){}

시작될 때 {}의 내용을 한 번 실행합니다.

2. size(500,500);

화면의 가로와 세로의 크기를 각각 500px로 한다.

3. void draw(){}

{}의 내용을 계속 실행한다.

4. fill(random(255), random(255), random(255), 200);

도형의 안쪽의 채우는 색을, 투명도가 0.78(200/255보다)으로, 랜덤인 색으로 설정한다.

>> fill(h, s, b, α);

도형 안쪽의 채우기 색을 설정하는 색 ( HSB )이 (a, b, c)로 투명도가 α의 색으로 채웁니다. ( fill(255,255,255,255) 가 최대인 경우, 하얗고 무투명한 색이 된다.)

>> random(255)

0에서 255까지의 임의 값(난수).

5. ellipse(random(500), random(500), 40, 40);

x 좌표와 y 좌표 각각 0~500의 랜덤한 장소에 직경 40px의 원을 그린다.

>> ellipse(x, y, w, h);

중심(x, y)의 위치에, 가로 직경 w로, 세로 직경 h의 타원(ellipse)을 그린다.

배열 코드

>> background(255,255,255);

배경색을 HSB(255,255,255)(새하얀)로 한다.

>> frameRate(10);

초당 화면을 10회 업데이트합니다. ( draw(){} 는 1회의 갱신에 대해, 1번 실행되기 때문에, 결과적으로 1초간에 10회엔을 그릴까라고 한다).

>> colorMode(RGB,100,100,100);

색의 설정 방법을 HSB가 아니라, RGB로 설정해, 각 인수의 최대치를 100으로 한다.

>> strokeWeight(3);

도형의 선 두께를 3px로 설정합니다.

샘플 코드(어레인지)

random_circles_arrange.pde

void setup(){
  size(500,500);
  background(255,255,255);
  frameRate(10);
  colorMode(RGB,100,100,100);
  strokeWeight(3);
}

void draw(){
  fill(random(100), random(100), random(100), 200);
  ellipse(random(500), random(500), 40, 40);
}

3색 고정색으로 랜덤화하는 방법

3색의 정보를 포함하는 배열 circle_color 를 작성해, 거기에 색을 기술합니다.
아래에서 설명하는 코드는 다음과 같이 표시됩니다.



random_circles_three.pde

int[][] circle_color = {{255, 0, 0} ,
    {0, 255, 0} ,
    {0, 0, 255} };
int i_color;

void setup() {
    size(500, 500);
}

void draw() {
    i_color = (int)random(0, 3);
    fill(circle_color[i_color][0], circle_color[i_color][1], circle_color[i_color][2], 200);
    ellipse(random(500), random(500), 40 , 40);
}