Как мне сделать прыжок в формате gif, используя гравитацию и y-переменную земли?

Question

Ссылка на код CatBus

Я пытаюсь заставить свой гиф "прыгать", но при этом возвращаюсь в состояние покоя при значении 730. Ни больше, ни меньше. Это будет работать в той же степени, что и игра «Динозавр», когда нет Wi-Fi. Я также хотел бы включить гравитационную функцию. Я не знаю, как это сделать. (Я ОЧЕНЬ новичок в программировании.) Есть какие-нибудь советы?

[Код ниже]

      let img;    //background
var bgImg;    //also the background
var x1 = 0;
var x2;

var scrollSpeed = 4;  //how fast background is

let bing;   //for music

let cat = {   //coordinates for catbus
  x:70,
  y:730
}
  
var mode;  //determines whether the game has started


function preload() {
  bgImg = loadImage("backgwound.png");  //importing background

  bing=loadSound('catbus theme song.mp3');  //importing music

}

function setup() {
  createCanvas(1000, 1000);   //canvas size

  img = loadImage("backgwound.png"); //background in

  x2 = width;

bing.loop()  //loops the music
  
  catGif=createImg("catgif.gif")    //creates catbus
  catGif. position(cat.x, cat.y)    //creates position
  catGif. size(270,100)             //creates how big
  
  mode = 0;                         //game start
  textSize(50);                     //text size
  
}

function draw() {

  let time = frameCount;        //start background loop

  image(img, 0 - time, 0);

  image(bgImg, x1, 2, width, height);
  image(bgImg, x2, 2, width, height);

  x1 -= scrollSpeed;
  x2 -= scrollSpeed;

  if (x1 <= -width) {
    x1 = width;
  }
  if (x2 <= -width) {
    x2 = width;
  }                       //end background loop

  
  fill("white")              //text colour
 if(mode==0){ 
  text('Press SPACE to start the game.',150,500);     //what text to type
 }  

  if(mode==0){
  text('CATBUS BIZZARE ADVENTURE',135,450)    //what text to type
  
  }
    
}


function pickRandom() {
  x = random(20, width - 20);
}

Answer 1

Я создал набросок p5.js, чтобы указать вам правильное направление.

Я ввел несколько переменных, которые определены в верхней части вашего кода перед настройкой:

      let gravity = 0.1;
let velocity = 0;
let upForce = 3;

let startY = 730;
let startX = 70;
...

Вы можете настроить эти числа в соответствии с вашей игрой. Но основная предпосылка здесь заключается в том, что в каждом кадре мы добавляем скорость к скорости и скорости. velocity увеличивается каждый кадр на gravity:

       cat.y = cat.y + velocity;
 velocity = velocity + gravity;

Однако есть предостережение: мы не хотим добавлять скорость к cat.y если кошка на своем, как startY это трава:

      if (cat.y > startY) {
  velocity = 0;
  cat.y = startY;
}

catGif.position(cat.x, cat.y); // reposition the gif