如何在P5中为球添加弹跳压缩动画?

我用P5.js创建的简单游戏包含一个球,该球受重力作用落下并在地面反弹。我想在球触地时为其添加“压缩”动画,以使其看起来更逼真。


我如何做到这一点而又不会显得怪异?


代码是这样的:


function Ball() {

  this.diameter = 50;

  this.v_speed = 0;

  this.gravity = 0.2;

  this.starty = height / 2 - 100;

  this.endy = height - this.diameter / 2;

  this.ypos = this.starty;

  this.xpos = width / 2;


  this.update = function() {


    this.v_speed = this.v_speed + this.gravity;

    this.ypos = this.ypos + this.v_speed;


    if (this.ypos >= this.endy) {

      this.ypos = this.endy;

      this.v_speed *= -1.0; // change direction

      this.v_speed = this.v_speed * 0.9;

      if (Math.abs(this.v_speed) < 0.5) {

        this.ypos = this.starty;

      }

    }

  }


  this.show = function() {

    ellipse(this.xpos, this.ypos, this.diameter);

    fill(255);

  }

}


var ball;


function setup() {

  createCanvas(600, 600);

  ball = new Ball();

}


function draw() {

  background(0);

  ball.update();

  ball.show();

}

<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.8.0/p5.js"></script>


呼啦一阵风
浏览 112回答 1
1回答
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript