Silverback9

#야생으로

Creative Coding 독학 제019일 2024년04월14일(일)

오늘은 동그라미를 두 개를 만들어 볼게요. 먼저 질량 1인 동그라미 두 개를 만들어 보겠습니다. 질량이 1이면, Acceleration = Net Force인 것 기억하시죠? 그래서 동그라미 질량값을 저장하는 변수를 만들지 않고, 이제껏 한 것처럼 힘의 총합을 바로 가속도로 사용할게요~. 동그라미 두 개를 생성하는 것을 제외하면, 어제의 코드와 구성이 같다고 보시면 될 것 같아요~^^*

아래 동영상을 클릭하셔서 1:40까지 보시면 되어요~^^*

class Mover{
  constructor(x,y){
    this.pos = createVector(x,y);
    this.vel = createVector(0,0);
    this.acc = createVector(0,0);
    this.r = 16; 
  }
  
  applyForce(force){  
    this.acc.add(force); 
  }
  
  edges(){
    if(this.pos.y >= height - this.r){ 
      this.pos.y = height - this.r;
      this.vel.y *= -1;
    }
    
    if(this.pos.x >= width - this.r){
      this.pos.x = width - this.r;  
      this.vel.x *= -1;
    } else if(this.pos.x <= this.r){
      this.pos.x = this.r;
      this.vel.x *= -1;
    }    
  }
  
  update(){
    this.vel.add(this.acc);
    this.pos.add(this.vel);
    this.acc.set(0,0);
  }
  
  show(){
    stroke(255);
    strokeWeight(2);
    fill(255, 100);
    ellipse(this.pos.x, this.pos.y, this.r*2);
  }
}

let moverA;
let moverB;
//동그라미를 두 개 만들어 봅시다.

function setup() {
  createCanvas(400, 400);
  moverA = new Mover(100,200);
  moverB = new Mover(300,200);
  //동그라미가 캔버스 왼쪽과 오른쪽에 나란히 위치합니다. 
}

function draw() {
  background(0);
  if(mouseIsPressed){  
    let wind = createVector(0.1, 0);
    moverA.applyForce(wind);
    moverB.applyForce(wind);
    // 동그라미들에게 바람을 후~ 불어 봅시다.
  }
  let gravity = createVector(0,0.2); 
  
  moverA.applyForce(gravity);   
  moverA.update();  
  moverA.edges(); 
  moverA.show();
  
  moverB.applyForce(gravity);   
  moverB.update();  
  moverB.edges(); 
  moverB.show();
  // 중력의 영향을 받고 바닥과 벽에 반응하는 동그라미들의 움직임을 표현해 봅시다.
}

이것을 클릭하셔서 mover.js 파일과 sketch.js 파일을 열어 코드를 살펴 보시고 삼각형을 눌러 프로그램을 실행해 보셔요. 마우스를 클릭하여 바람도 후~ 불어 보시구요. 종료를 위해선, 사각형을 누르시면 되어요~^^*

오늘은 월요일을 준비하는 가벼운 마음으로 짧게 공부하고 마치도록 할게요. 일요일 저녁에 무언가를 시작하면 월요일을 맞이하는 기분이 가벼워 지는 것 같아요. 그리고…앞으로는 월요일에 쉬지 않고 목요일에 쉬도록 할게요. 목요일이 좀 바쁜 날이라서 코딩공부 시간이 좀 부족한 것 같아서요. 그럼 우리 내일 또 만나요~^^* 아 참, 활기찬 월요일 아침을 준비하며, 둘이 된 동그라미들을 축하하며, 둘이 살짝 손잡고 율동 타임 한 번 가질까요~, 우리~^^*?

월요일을 기다리는 마음이 즐거워지는 밤이예요~ 넵! 꿈은 이루어 집니다!!

댓글 남기기