#104 ブロック崩しに挑戦 ボールを動かす

ボールを動かす

ボールの座標(x,y) 移動距離dx,dyを用意して、１フレームごとにボールを移動させます。

具体的には、x=x+dx；y=y+dy;として少しずつ円の中心を動かしていきます。

• background(0,0,0);//ウインドウを黒く塗ります。
• fill(248,252,13);//塗りつぶす色を、黄色に指定する。
• ellipse(x,y,2*r,2*r);//円を描く
• x +=dx;//次の円用のx座標を計算する x=x+dx;と同じ
• y +=dy;//次の円用のy座標を計算する y=y+dyと同じ

ボールが動く仕組みは、アニメーションと同じ原理で、１～３を繰り返しています。

1. ウィンドウを黒く塗りつぶす（background）
2. ボールを描く（fill 描画色を黄色にする。ellipse 円を描く）
3. ボールの次の中心座標を計算する。(x=x+dx, y=y+dyを計算する）

ボールを動かそう

//ボールの半径を10

int r=10;

//ボールの座標

float x=r,y=100;

//ウインドウの大きさ

int yoko=400,tate=600;

//移動方向の初期値

float dx=1,dy=1;

void setup()

{

  size(yoko,tate);

//カラーモードの設定

//RGBの各色を256まで使えるようにする

  colorMode(RGB,256);

//背景色を黒にする

  smooth();

  noStroke();

  frameRate(60);

}

void draw()

{

  background(0,0,0);

  fill(248,252,13);

  ellipse(x,y,2*r,2*r);

  x +=dx;

  y +=dy;

}

疑問

黄色いボールが移動しますが、壁を突き抜けて消えちゃいます？

答え

そのとおりです。そういうプログラムなのです。x>=400とy>=600を超えると、ウィンドウをはみ出てしまいます。

次回は、ボールが壁に当たったら跳ね返るようにしましょう！

#105 ブロック崩しに挑戦 壁で跳ね返る