Sprite vibrates when not jumping

CS Discoveries Coding and Debugging Help
1

I’m working on a side scroller as an example for my students. I am trying different methods of getting the sonicRun sprite to jump. Originally, I had the following code beginning on line 288:

if (sonicRun.collide(ground)) {
sonicRun.velocityY = 0;
sonicRun.setAnimation(“sonic_run”);
}
if (sonicRun.y > 299) {
if (keyDown(“up”)) {
sonicRun.setAnimation(“sonic_jump”);
sonicRun.velocityY = -15;
sonicRun.velocityX = 2;
playSound(“sound://category_achievements/vibrant_game_achievement_3.mp3”, false);
} else {
sonicRun.setAnimation(“sonic_run”);
sonicRun.x = 200;
sonicRun.velocityX = 0;
sonicRun.velocityY = 0;
}
}
if (sonicRun.y < 120) {
sonicRun.velocityY = 7;
sonicRun.velocityX = 1;
}

Link to the project or level: Sonic Side Scroller
What I expect to happen: I am trying to use a gravity variable now to control the jump since the above code was too slow and it made it difficult to avoid enemies. I expect the sonicRun sprite to change to the jumping animation and go up to the top third of the screen then come back down and change back to the running animation.
What actually happens: The sonicRun sprite goes up and down and changes animation as expected, but when it’s on the ground, it vibrates back and forth.
What I’ve tried: I tried the above code. I’ve also tried removing the velocityX blocks on lines 292, lines 298, and the sonicRun.x line on 301.

2

This one took me a little while and a little time with ChatGPT - no lie. It wasn’t all bad - the game is fun! Here is the breakdown of the issues causing Sonic to be shaky:

  1. ground is not immovable
  2. gravity is pushing Sonic into the ground every frame
  3. velocityX is being changed too much
  4. isTouching(spriteItself) is always true and causes glitchy behavior

I did a remix with an updated code you can check against yours.

3

Thanks for the help! That does fix things (although the up button doesn’t always allow Sonic to jump for some reason), but now the “Click to Start” isn’t showing on the opening screen. I think the issue is in the startBackground function, or where that function is used in the draw loop. Here is the code you have:

function startBackground() {
sonicRun.visible = false;
textVisible = true;

stroke(“black”);
strokeWeight(3);
fill(“yellow”);
textFont(“Verdana”);
textSize(40);
text(“Click to Start”, 75, 280);
}

My code said this:

function startBackground() {
sonicRun.visible = false;
textVisible = true;
drawSprites();
if (textVisible) {
stroke(“black”);
strokeWeight(3);
fill(“yellow”);
textFont(“Verdana”);
textSize(40);
text(“Click to Start”, 75, 280);
}
}

In the draw loop, I have the startBackground function called if started is false. In my old code, that allowed the “Click to Start” text to display. It’s not doing that now and I can’t seem to figure out why. Do you have any ideas?

Thanks,

Jenny

4

Did you change your original? My guess without diving deeply into it is that @edavis may have inadvertently moved some blocks and caused the start text to be drawn before the sprites are drawn and therefore the sprites are covering up the text.

If you have a different link to look at, I can … your original link still has the text working.

Mike

5

This is my current version:

I still can’t get the starting text to show. I tried putting the drawsprites after the startBackground function is called, but it still didn’t appear.

6

In the menu the sprites (background) are actually drawn over top of the text so it doesn’t show because of that. Simple in my opinion is just making another if statement in your function draw

function draw() {
  startGame();
  loopEnemies();
  loopItems();
  ringSpacing();
  enemySpacing();
  
  if (started) {
    gameBackground();
    hit();
    jump();
    collectItems();
    keepGoing();
    win();
    lose();
    restart();
  }
  drawSprites();
  if (!started) {
   startBackground();
  }
  showScore();
}