How to do animation

[asdatapel]

Hello everyone. Im kinda new to sfml, and im trying to figure out how to do animation. Actually, I know how to do animation, but theres a few part about that are really bugging me. For example, if i wanted to switch between three images for a running animation, I would switch between three images with a Sleep(int) in between these, right? But the problem with this is that while its sleeping, NOTHING else can happen. I dont know how to get around this.

I hope you understand what  im saying here, but yeah...

[OniLinkPlus]

I'll give you a hint: sf::Clock.

[Nexus]

If you don't want to implement animations yourself, my Thor.Animations module might be an option for you. But maybe it is overkill for your use case. Anyway, in case of interest consider the documentation and a complete example.

The module is currently far from feature-complete, but I am constantly improving it

[eXpl0it3r]

Just to be said, the sleep method isn't such a nice thing...

For animation you need two things:
- diffrent images
- the right timing

Dependend on what you're trying to do there are two solutions that pop into my mind:

Use sf::Clock (as mentioned)
Instead of letting your application sleep check with a sf::Clock how much time has passed and change the image, play around with (or calculate) the timing.

Make your animation depended of the framerate
Your application runs with a framerate, which without fix limit only depends on your graphiccard and CPU power. Normaly 24-120fps will be enough so the extra 5000 that your PC maybe could produce are just waste, so it makes sense to set a limit.
With sf::Clock again you can findout the time between frames and use that to calculate for how many frames you show a image.

[Nexus]

With sf::Clock again you can findout the time between frames and use that to calculate for how many frames you show a image.

The frame time can be retrieved even easier with sf::RenderWindow::GetFrameTime()

Using a sf::Clock alone is not a good idea since you can't interrupt the animation (for example when pausing the game). You are bound to the really passed time, not the game time. However, things look different if you use a pausable clock class.

[Haikarainen]

I myself use thor::Timer for the timing issues, works like a charm!
Also, dont forget to create a resource-manager first, you wouldnt wanna store images in each frames!

[asdatapel]

wow thanks guys!

[asdatapel]

Hello Guys, I tried this but it doesnt works. The image stays the same unless I press the Right button.

Code: [Select]


#include <iostream>
#include <SFML/Graphics.hpp>

using namespace std;
//using namespace sf;

int main() {

    sf::Sprite marioSprite;
    sf::Image run[3];
    sf::RenderWindow App(sf::VideoMode(800, 600, 32), "JustAnimation");
    int whichOne = 0;
    sf::Clock timer;

    if (!run[0].LoadFromFile("resources/0000.png")) {}
    if (!run[1].LoadFromFile("resources/0001.png")) {}
    if (!run[2].LoadFromFile("resources/0002.png")) {}

    marioSprite.SetImage(run[0]);

    while (App.IsOpened()) {
        App.Clear(sf::Color::Black);

        sf::Event Event;

        if (App.GetEvent(Event))
            if (Event.Type == sf::Event::Closed)
                App.Close();

        App.Draw(marioSprite);

        if (timer.GetElapsedTime()<100) {
            whichOne=0;
        } else if (timer.GetElapsedTime()<200) {
            whichOne=1;
        } else {
            whichOne=2;
            timer.Reset();
        }
        marioSprite.SetX(marioSprite.GetPosition().x);

        if (App.GetInput().IsKeyDown(sf::Key::Right)) {
            marioSprite.SetX(marioSprite.GetPosition().x+2);

        }

        marioSprite.SetImage(run[whichOne]);


        App.Display();
    }

    return 0;
}

[OniLinkPlus]

Well, first of all, you should be using while (App.GetEvent(Event)), but that likely isn't the cause.

[Nexus]

When pressing the right button, you don't change the image, only the position. Maybe your description applies to another than the shown code?

And please keep the code as minimal as possible and try to search some time for the mistake yourself. With a debugger, such problems are usually found in a few minutes. Or output the variable values. Or simplify code until the issue becomes obvious.

For example, I don't think that you should reset the timer immediately when setting whichOne to 2. You may also think about the order of event handling, Clear(), Draw() and Display().

[asdatapel]

I know I suck at this, but an example code would be very very useful.

[slotdev]

Hi

Code: [Select]


        if (timer.GetElapsedTime()<100) {
            whichOne=0;
        } else if (timer.GetElapsedTime()<200) {
            whichOne=1;
        } else {
            whichOne=2;
            timer.Reset();
        }


This isn't a very clear way to do things. Instead, do:

Code: [Select]


if (timer.GetElapsedTime() >= 100)
{
if (++whichOne > 2)
{
whichOne = 0;
}
marioSprite.SetImage(run[whichOne]);

timer.Reset();
}

Also you don't need to keep calling SetX - do this only when you want to change the positition

[slotdev]

Actually, try this.

Code: [Select]


int main() {

    sf::Sprite marioSprite;
    sf::Image run[3];
    sf::RenderWindow App(sf::VideoMode(800, 600, 32), "JustAnimation");
    int whichOne = 0;
    sf::Clock timer;
    sf::Event Event;

    if (!run[0].LoadFromFile("resources/0000.png")) {}
    if (!run[1].LoadFromFile("resources/0001.png")) {}
    if (!run[2].LoadFromFile("resources/0002.png")) {}

    marioSprite.SetImage(run[0]);

    while (App.IsOpened())
    {
        App.Clear(sf::Color::Black);

if (timer.GetElapsedTime() >= 100)
{
if (++whichOne > 2)
{
whichOne = 0;
}
marioSprite.SetImage(run[whichOne]);
timer.Reset();
}
       
        if (App.GetInput().IsKeyDown(sf::Key::Right))
        {
marioSprite.SetX(marioSprite.GetPosition().x+2);
}
// Some frame rate control would be nice here, now it'll be going as fast as possible!!
App.Draw(marioSprite);
        App.Display();

        if (App.GetEvent(Event))
        {
            if (Event.Type == sf::Event::Closed)
                App.Close();
        }
    }

    return 0;
}


[asdatapel]

I would really appreciate it if someone could give me a proper example. thanks

[slotdev]

A proper example of what?!