a-15 動き(1) スピードと向き

a-15 スピードと向き

1秒間に何回フレームが更新されるかを表すのがフレームレート。

void setup(){
  frameRate(30);//毎秒30フレーム
  //frameRate(24);//毎秒24フレーム
  //frameRate(0.5);//2秒で1フレーム
}

void draw(){
  printIn(frameRate);
}

off topic(余談)
動画のフレームレートは、「fps」で表します。
※fps = 1秒間に使用するフレーム数(コマ数)の静止画が記録されているか。

・24fps(23.98fps) 映画で採用。
・25fps PAL圏内(ヨーロッパなど)でテレビやDVDに採用。
・30fps(29.97fps) 日本国内やを含むNTSC圏内でテレビやDVDに採用。
・50fps PAL圏内(ヨーロッパなど)でテレビやDVDに採用。25fpsよりなめらか。
・60fps(59.94fps) 日本国内やを含むNTSC圏内でテレビやDVDに採用。30fpsよりなめらか。

フレームレートの数値が大きいほど被写体の動きがなめらかな動画となる。

高精度な動きを実現するのが、float型

なめらかな動きを表現するために、「float」という、データ型を使う。
int型では、フレームごとに少なくとも1ピクセル移動させないといけないが、float型の変数は、小数点を持つ数値を格納し、高精度な動きをさせる事ができる。

int radius=40;
float x =-radius;
float speed=0.5;

void setup(){
  size(1280,120);
  ellipseMode(RADIUS);
}

void draw(){
  background(0);
  x += speed;
  arc(x,60,radius,radius,0.52,5.76);
  fill(255,216,0);
}

上記のコードを実行すると、「x」がウィンドウ幅から出て行って見えなくなります。
ウィンドウ幅の端に達すると戻ってくる、コードは、こちら。

int radius=40;
float x =-radius;
float speed=0.5;

void setup(){
  size(1280,120);
  ellipseMode(RADIUS);
}

void draw(){
  background(0);
  x += speed;
  if(x > width+radius){
    x = -radius;
  }
  arc(x,60,radius,radius,0.52,5.76);
  fill(255,216,0);

}

draw()が実行されるたびに、位置を表す変数xが増加し、xがウィンドウ幅に図形の半径を加えた値をこえたら、xに負の値をセットすることで、右出て左端からまた出てくる動きを表現する。
さらに、左端に到達後、向きを変えて戻ってくるコードは、こちら。

int radius=40;
float x =100;
float speed=5;
int direction =1;

void setup(){
  size(1280,120);
  ellipseMode(RADIUS);
}

void draw(){
  background(0);
  x += speed*direction;
  if((x > width+radius)||(x < radius)){
    direction = -direction;
  }
  if(direction ==1){
  arc(x,60,radius,radius,0.52,5.76);
  fill(255,216,0);
}else{
  arc(x,60,radius,radius,3.67,8.9);
  fill(255,216,0);
}
}