Trying to figure out an equation for fading a color for an amount of specific time

Question

I'm currently creating a logo sequence in c++ with SFML and would like to input a desired time and then fade for that amount of time say for example, if the input is 3 then fade out the color until the 3 seconds is up. The max amount of the color integer, as a color is at 255 as white. This is my current code:

sf::Time fadeCalc = clock.getElapsedTime();
int f = fadeCalc.asMilliseconds();
int l = logoLength.asSeconds();
int iColor = "Equation needed using variables"
sf::Color fadeColor(iColor,iColor,iColor);
Fade.setFillColor(fadeColor);

Any help would greatly be appreciated! I'm sorry I couldn't figure out a way to explain it easier.

Answer 1

You will be fading from start color to end color over total fade time, taking a step of elapsed time per draw.

As a result, at each draw step, you will want to set your color to start color + ((end color - start color) * (elapsed time / total time)). This will get you the amount of change you want to accomplish, figure out the percentage of change that should have occurred by this point, then add that changed amount to your initial amount.

For example, if you wanted to go from 100 to 255 and it's been 1000 out of 3000 milliseconds, you would expect to be 1/3 of the way from 100 to 255, or 151.6667 (151 truncated). At 2/3, it would be 203.333. Et cetera.

Once you are >= your total time, just set start color to end color.