How to slow sprite animation?

Question

I currently have this player.cpp class that I use to animate sprites. I use a counter to update each frame. It animates, but it flies through the animation.

I want to slow it down. I found code that can be used to slow down sprite animation, but I'm not sure how to implement it in my current program.

Below is my player.cpp file, and after it is the code I found that can slow down sprite animation. When I tried to add the clock to counterWalking++ , it didn’t counterWalking++ at all, and I tried to implement this code with the same effect.

 player::player() { rect.setSize(sf::Vector2f(32, 32)); rect.setFillColor(sf::Color::White); rect.setPosition(300, 300); sprite.setTextureRect(sf::IntRect(0, 0, 32, 32)); } void player::update() { sprite.setPosition(rect.getPosition()); } void player::updateMovement() { if (sf::Keyboard::isKeyPressed(sf::Keyboard::Right)) { if (canMoveRight == true) { rect.move(movementSpeed, 0); sprite.setTextureRect(sf::IntRect(counterWalking * 32, 64, 32, 32)); direction = 4; canMoveUp = true; canMoveDown = true; canMoveLeft = true; canMoveRight = true; } } else if (sf::Keyboard::isKeyPressed(sf::Keyboard::Left)) { if (canMoveLeft == true) { rect.move(-movementSpeed, 0); sprite.setTextureRect(sf::IntRect(counterWalking * 32, 32, 32, 32)); direction = 3; canMoveUp = true; canMoveDown = true; canMoveLeft = true; canMoveRight = true; } } else if (sf::Keyboard::isKeyPressed(sf::Keyboard::Up)) { if (canMoveUp == true) { rect.move(0, -movementSpeed); sprite.setTextureRect(sf::IntRect(counterWalking * 32, 96, 32, 32)); direction = 1; canMoveUp = true; canMoveDown = true; canMoveLeft = true; canMoveRight = true; } } else if (sf::Keyboard::isKeyPressed(sf::Keyboard::Down)) { if (canMoveDown == true) { rect.move(0, movementSpeed); sprite.setTextureRect(sf::IntRect(counterWalking * 32, 0, 32, 32)); direction = 2; canMoveUp = true; canMoveDown = true; canMoveLeft = true; canMoveRight = true; } } else { //Player not moving } counterWalking++; if (counterWalking == 3) counterWalking = 0; } 

Here is the code I found that shows slow animation:

 int main() { sf::RenderWindow renderWindow(sf::VideoMode(640, 480), "Demo Game"); sf::Event event; sf::Texture texture; texture.loadFromFile("images/player.png"); sf::IntRect rectSourceSprite(0, 0, 32, 32); sf::Sprite sprite(texture, rectSourceSprite); sf::Clock clock; while (renderWindow.isOpen()) { while (renderWindow.pollEvent(event)) { if (event.type == sf::Event::EventType::Closed) renderWindow.close(); } if (clock.getElapsedTime().asSeconds() > 1.0f) { if (rectSourceSprite.left == 96) rectSourceSprite.left = 0; else rectSourceSprite.left += 32; sprite.setTextureRect(rectSourceSprite); clock.restart(); } renderWindow.clear(); renderWindow.draw(sprite); renderWindow.display(); } } 

Answer 1

Since the solution was given in a comment but not implemented in the answer, here is some kind of "code review"

Key binding

This code actually uses sf::Keyboard::isKeyPressed and sf::Keyboard::isKeyReleased , which need to be called every cycle, while a simple logical switch when the key is pressed / released can work using events.

 while (renderWindow.pollEvent(event)) { if (event.type == sf::Event::EventType::Closed) renderWindow.close(); } 

The event used in the main loop also contains information about KeyEvents, but is not used in this way. I suggest sending evet while playing eac when an event occurs:

  while (renderWindow.pollEvent(event)) { switch(event.type){ case sf::Event::EventType::Closed: renderWindow.close(); break; case sf::Event::KeyPressed: case sf::Event::KeyReleased: myPlayer.keyEvent(event); break; } } 

The keyEvent function in the player should look like this:

 void player::keyEvent(sf::Event event){ //Keycode of your keyboard arrows goes from 71 to 74 if (event.key.code >= 71 && event.key.code <= 74){ //Gets the array ID from the enumeration value int ID = event.key.code - 71; //Stores false if the key is release, and true if it pressed keys[ID] = (event.type == sf::Event::KeyPressed); } } 

Depends on each array value in Player.h:

 private: bool keys[4]; 

Motion

Now all you have to do is call the player's update () function in the game loop every second:

 if (clock.getElapsedTime().asSeconds() > 1.0f) { if (rectSourceSprite.left == 96) rectSourceSprite.left = 0; else rectSourceSprite.left += 32; sprite.setTextureRect(rectSourceSprite); myPlayer.update(); clock.restart(); } 

In the update() function, then you will create a motion vector based on the keystroke:

 void player::update() { sf::Vector2f movementVector(0,0); //Left if (keys[0]){ movementVector.x -= movementSpeed; //Sends the sprite Rectangle position based on the movement type move(32); } //Right if (keys[1]){ movementVector.x += movementSpeed; move(64); } //Up if (keys[2]){ movementVector.y -= movementSpeed; move(96); } //Down if (keys[3]){ movementVector.y += movementSpeed; move(0); } } 

The move function then moves your sprite position depending on the motion vector and counter, then the sprite will be set.
The movement counter will be increased to 30, and your player can only move when this counter is 0, 10 or 20:

 void move(int spritePos){ //Here, the check() function should tell if the player isn't going outside of the screen / in a wall if (check(sprite.getPosition() + movementVector)){ sprite.move(movementVector); ++counterWalking %= 30; if(!counterWalking % 10) sprite.setTextureRect(sf::IntRect(counterWalking / 10 * 32, spritePos, 32, 32)); } } 

There are several ways to do this, just the way I did it