p5.js语法手册环境篇-frameRate()

说明

定义画布每秒的帧数（刷新率）。

比如说，调用 frameRate(30) 将使画布每秒刷新 30 次。如果处理器没法跟上所定义的速率，该帧率将不会被达到。

建议在 setup() 内设置帧率。默认的帧率值为每秒 60 影格。这和调用 setFrameRate(val) 的效果一样。

调用 frameRate() 但不给予任何参数将会返回当时的帧率。

注意：draw() 函数必须至少执行一次才会返回帧率。这和调用 getFrameRate() 的效果一样。调用 frameRate() 并给予任何不是数字或正数的参数也将会返回当时的帧率。

范例

let rectX = 0;
let fr = 30;
let clr;
function setup() {
  background(200);
  frameRate(fr);
  clr = color(255, 0, 0);
}
// 推荐学习一下deltaTime中的案例
function draw() {
  background(200);
  rectX += 1;    // 此处是与deltaTime案例的不同之处，当前案例两种颜色方块的移动速度是不一样的。
  if (rectX >= width) {
    if (fr === 30) {
      clr = color(0, 0, 255);
      fr = 10;
      frameRate(fr);
    } else {
      clr = color(255, 0, 0);
      fr = 30;
      frameRate(fr);
    }
    rectX = 0;
  }
  fill(clr);
  rect(rectX, 40, 20, 20);
}
new p5();

语法

frameRate(fps)
frameRate()

参数

fps

数字：每一秒画布更新的帧数（刷新率）