돌돌쌤

프로세싱 배열은

아두이노의 배열 선언과 조금 다르다.

배열 선언 방법은 

-------------------------------

int[] x;                // 배열 선언

x = new int[3];     // 배열 생성

x[0] = 100;

x[1] = 200;

x[2] = 300;

-------------------------------

이다 .

조금 간단히 하면

--------------------------------------------------------------

int[] x = new int[3];              // 배열 선언하고 배열 생성한다.

x[0] = 100;

x[1] = 200;

x[2] = 300;

--------------------------------------------------------------

더 간단히 하면

--------------------------------------------------------------

int[] x = {100,200,300};    //배열을 선언, 생성 하고 값을 할당한다.

--------------------------------------------------------------

아두이노에서는

int x[] = {100,200,300}; 했던 것을

프로세싱에서는 위와 같다.

이를 활용해 아래 예제는 이차원 배열로 사각형그리기다.

---------------------------------------------------------------------------------

int[][] a =  new int[5][5];

int i = 0;

int j = 0;

void setup(){

  size(480,360);

  background(255);

  noLoop();

}

void draw(){

  for(i=0;i<5;i++){

   for(j = 0; j<5 ; j++){

     a[i][j] = j*j;

   }

  }

  for(i = 0; i<5;i++){

    for(j = 0; j<5;j++){

      fill(0,0,0,10);

      rect(0,0,a[i][j]*10,a[i][j]*10);

    }

  }

}

--------------------------------------------------------------------------------

프로세싱 좌표변환

좌표변환 함수를 이용하여 도형의 좌표, 크기, 회전등을

표현해보자.

스케치 소스

----------------------------------------------------------------------------

void setup(){

  size(480,360);

  background(255);

}

void draw(){

  fill(255);

  rect(0, 0, 100, 100);   // 흰색 사각형을 (0,0)에 100x100크기로 그림  --(1)

  translate(30, 20);      // 기준좌표(왼쪽 맨위)를 (30,20)으로 이동

  rect(0, 0, 100, 100);   // 결국 사각형을 (30,20)에 100x100크기로 그림  --(2)

  translate(50,50);       // 기준좌표를 (50,50)으로 이동

                                // 누적 이동되어 기준좌표는 (0,0)에서 부터 (80,70)으로 이동됨

  rect(0,0,100,100);      // 결국 사각형을 (80,70)에 100x100크기로 그림 --(3)

  translate(-80,-70);    // 기준좌표를 (0,0)으로 원위치

  pushMatrix();            //pushMatrix(); 와 popMatrix();  사이에서

                                // translate(); rotate(); scale();가 적용됨

  translate(30, 20); 

  fill(0);  

  rect(0, 0, 50, 50);       // --(4)

  popMatrix(); 

  fill(102);  

  rect(15, 10, 50, 50);   // 위에서 쓰인translate();는 pushMatrix(); 와 popMatrix(); 사이에서

                                // 제한 되므로 사각형은 그대로 (15,10)좌표에서 그려짐.  --(5)

  translate(width/2, height/2);   //기준좌표를 창의 중앙점으로 옮김

  rect(-26, -26, 52, 52);     //  --(6)

  fill(255);

  rotate(PI/6.0);      // 좌료를 시계방향으로 30도 회전

  line(0,0,0,180);     // 좌표가 회전으로 수직선이 아닌 사선이 그려짐   --(7)

  line(0,0,240,0);     // 좌표가 회전으로 수평선이 아닌 사선이 그려짐   --(8)

  rect(-26, -26, 52, 52);    // 시계방향으로 30도 회전된 사각형    --(9)

  scale(0.5);    // 좌표를 가로세로 0.5축소됨

  rect(200, 200, 50, 50);   // 옮겨진 기준좌표(중점)에서    --(10)

                                   //(200,200)이 아닌 (100,100)위치에 그려짐(좌표 회전됨 유지)

  scale(0.5,0.7);     // 좌표가 가로0.5 세로 0.7 축소됨 

                           //결국 누적되어 가로 0.25 세로 0.35축소됨

  rect(200, 200, 50, 50);  // --(11)

}

--------------------------------------------------------------------------------------

화면

프로세싱 레퍼런스 http://processing.org/reference/

Transform 

applyMatrix()
popMatrix()
printMatrix()
pushMatrix()
resetMatrix()
rotate()
rotateX()
rotateY()
rotateZ()
scale()
shearX()
shearY()
translate()

이미지를 다루는 방법은 폰트와 별반 다르지 않다.

이전글 프로세싱 폰트다루기

-----------------------------------------------------------------------------------

PImage a;           // 이미지 변수 선언

void setup(){

  size(480,360);

  a = loadImage("_MG_0142.jpg");      // 변수 a에 이미지 불러옴

                                                     // 불러오는 이미지파일은 

                                             //이 스케치 파일이 저장된 폴더와 같은 위치에 저장되어 있어야 한다.

  noLoop();

}

void draw(){

  image(a,0,0);                   // 화면 (0,0)위치에 이미지 표시

  image(a, 200,60, a.width/2,a.height/2);    // 화면 (200,60)위치에 

                                            //너비는  a너비의 1/2, 높이는 a높이 1/2의 크기로 표시

}

---------------------------------------------------------------------------------

표현 화면

프로세싱 레퍼런스 http://processing.org/reference/

Loading & Displaying

tint()