Welcome, Guest. Please login or register. Did you miss your activation email?

Author Topic: Flicker after the first click only  (Read 1555 times)

0 Members and 1 Guest are viewing this topic.

nisu_srk

  • Newbie
  • *
  • Posts: 3
    • View Profile
Flicker after the first click only
« on: September 25, 2018, 06:03:13 pm »
I know that we should use clear, draw, display format but my objective makes me do something slightly different.
I want to always display a grey screen with a red dot in the middle. And then based on some calculations, at some intervals, I want to show a white dot at random location for 200ms. I want to detect clicks as well while waiting for the next dot. So my code structure is as shown here.

https://pastebin.com/embed_js/j7YrW9QA

OR
------------------------------------------------------
window.clear(grey_background);
window.draw(red_dot);
window.display();
 
while(window.isOpen()){
 
    MouseClickOperations(){
 
    }
 
    window.clear(grey_background);
    window.draw(red_dot);
   
    if(1s passed from the last click){
        window.draw(white_dot);//for 200ms
        window.display();
 
        window.clear(grey_background);
        window.draw(red_dot);
    }
   
    window.display();
 
}
------------------------------------------------

At the first click, the screen flickers, but after that, it works like a charm. What is causing this flicker and how do I get rid of it? Also, open to suggestions regarding how I can restructure my code if that's needed.

nisu_srk

  • Newbie
  • *
  • Posts: 3
    • View Profile
Re: Flicker after the first click only
« Reply #1 on: September 25, 2018, 06:59:12 pm »
Alright, so there is no flicker if I change the window style to default, so the above mentioned issue is only when using fullscreen style. This is weird, has anyone experienced anything like this?

eXpl0it3r

  • SFML Team
  • Hero Member
  • *****
  • Posts: 11030
    • View Profile
    • development blog
    • Email
Re: Flicker after the first click only
« Reply #2 on: September 25, 2018, 07:50:59 pm »
As I mentioned on Discord already, using multiple clear, draw, display for a single frame is not a solution. It flickers because of double buffering.

Instead you have to adjust your game loop. Too bad you didn't provide an actual minimal example, because now I have to basically write all the code to help you...

#include <SFML/Graphics.hpp>

#include <random>

int main()
{
    sf::RenderWindow window{ {800, 600}, "SFML window" };
    window.setFramerateLimit(60);

    sf::CircleShape white_dot{ 20.f };
    white_dot.setFillColor(sf::Color::White);
    white_dot.setPosition({ 100.f, 100.f });

    sf::CircleShape red_dot{ 5.f };
    red_dot.setFillColor(sf::Color::Red);
    red_dot.setPosition({ 400.f, 300.f });

    std::random_device random_device;
    std::mt19937 generator(random_device());
    std::uniform_real_distribution<float> x_distribution{ 0.f, 800.f };
    std::uniform_real_distribution<float> y_distribution{ 0.f, 600.f };

    sf::Clock clock;
    auto display_white_dot = false;

    while (window.isOpen())
    {
        sf::Event event;
        while (window.pollEvent(event))
        {
            if (event.type == sf::Event::Closed)
            {
                window.close();
            }
            else if (event.type == sf::Event::MouseButtonReleased)
            {
                clock.restart();
                display_white_dot = true;
                white_dot.setPosition({ x_distribution(generator), y_distribution(generator) });
            }
        }

        if (display_white_dot && clock.getElapsedTime().asMilliseconds() > 200)
        {
            display_white_dot = false;
        }

        window.clear(sf::Color{ 100, 100, 100 });
        window.draw(red_dot);
        if (display_white_dot)
        {
            window.draw(white_dot);
        }
        window.display();
    }
}

The main change here was to use a boolean to track the state of displaying or not displaying. Then change the boolean when the clock is passed 200ms.
Just for fun I added random position generation. :D

This looks like some kind of reaction test, is it?
Official FAQ: https://www.sfml-dev.org/faq.php
Official Discord Server: https://discord.gg/nr4X7Fh
——————————————————————
Dev Blog: https://duerrenberger.dev/blog/

 

anything