How to fade colors to black or some other color

Started by
7 comments, last by Miksan 20 years, 3 months ago
I just finished my particle engine which works with pixels at the moment. Every particle has several variables, color and lifetime are two of them. Now if I have a particle colored (255, 255, 255) and with lifetime 255, it is easy to make the fading. But what if the particle''s color is (230, 180, 255) and the lifetime is 1230? I want the particle to fade from its original value to (0, 0, 0) during the lifetime. Is it possible to calculate somehow? What if the background is (25, 25, 25)? How would the fading be done now? Is this whole thing impossible?
Advertisement
No it''s not imposible.

Let''s say the original color is 192, 128, 64. Make floats out of it -> 0.75f, 0.50f, 0.25f

The lifetime of the particle is 100 time units. So divide the R, G and B with this to get how much you have to fade each color each frame:

Color.R = Color.R - OrigColor.R / LifeTime; same for G and B.

If you dont want floats then convert (OrigColor.R / LifeTime) back to byte.

OR if you dont want to fade to black do (OrigColor.R - FinalColor.R) / LifeTime

You could even use an S-curve func to make the fade nonlinear.


[ My Site ]
''I wish life was not so short,'' he thought. ''Languages take such a time, and so do all the things one wants to know about.'' - J.R.R Tolkien
Founding member of "Un-Ban nes8bit" association (UNA) (to join put this in your sig) (Welcome back to JesperT)
/*ilici*/
Interesting! Thanks, but what''s the S-curve thing you mentioned?
or, if you are using something that can do alpha blending, you might want to keep the color the same and fade the alpha from 1.0 to 0.0... this will make it truly fade from sight.
--- krez ([email="krez_AT_optonline_DOT_net"]krez_AT_optonline_DOT_net[/email])
you could do this (Linear interpolation):

color = OrigColor * (1 - LifeTime) + FinalColor * LifeTime - when lifetime is in [0, 1] (do LifeTime = CurrentLife / MaxLife to get this)

the instead of LifeTime use

t = 3 * LifeTime * Lifetime - 2 * LifeTime * LifeTime * LifeTime

it will exaggerate t fitting it to a S shaped curve:



[ My Site ]
''I wish life was not so short,'' he thought. ''Languages take such a time, and so do all the things one wants to know about.'' - J.R.R Tolkien
Founding member of "Un-Ban nes8bit" association (UNA) (to join put this in your sig) (Welcome back to JesperT)
/*ilici*/
Thanks Ilici! I made one version which now fades pixels to the background color, it way too cool I''m now implementing new version with point sprites, and the fading is done with alpha (best solution?) The problem is that I''m not sure how to extract pertinent color values from the DWORD (D3DCOLOR)? This is what I''m after, with kind of pseudo code:

// In the particle struct
D3DCOLOR particleOriginalColor;

// In the render function
m_particleVerts[iCount].color = D3DCOLOR_ARGB((int)(fAlpha * 255.0), particleOriginalColor.red, particleOriginalColor.green, particleOriginalColor.blue);

Of course that doesn''t work, but how can I make it work? I know I should somehow check portions of the DWORD for collect colors, but how...
quote:the instead of LifeTime use

t = 3 * LifeTime * Lifetime - 2 * LifeTime * LifeTime * LifeTime

it will exaggerate t fitting it to a S shaped curve:


Heey....thanks for the formula!! I''ve experimented the formula in the Graphic Calculattor and it gave me a really bewty line...excelent for animation . I thought that catmull-room splines wre the anwsere...but this curve rocks!!
Techno Grooves
there are some macros for this in the windows headers:

the DWORD is like this: 0xRRGGBBAA (or 0xAARRGGBB not sure - experiment with it)

then use bitwise shift.

if DWORD_COLOR = 0xRRGGBBAA
R = (DWORD_COLOR >> 24) & 0x000000FF
G = (DWORD_COLOR >> 16) & 0x000000FF
B = (DWORD_COLOR >> 8) & 0x000000FF
A = (DWORD_COLOR ) & 0x000000FF

i may be wrong, i didn''t try the code, just smth i hacked up on the moment.

[ My Site ]
''I wish life was not so short,'' he thought. ''Languages take such a time, and so do all the things one wants to know about.'' - J.R.R Tolkien
Founding member of "Un-Ban nes8bit" association (UNA) (to join put this in your sig) (Welcome back to JesperT)
/*ilici*/
How should I do this:

Lifetime goes from somevalue to zero
Fade is Lifetime / OriginalLifetime (so it's going from 1 to zero linear)

And then somehow change to fade to go like this (this is my real problem):

1.0 | 0.99 | 0.98 | 0.97 | 0.96 | 0.95 | 0.90 | 0.7 | 0.3 | 0.1 | 0.0 |

Like it wouldn't change much at all in the beginning, but just before the end the fade drops hard?

edit: Ok, I figured it out.

[edited by - Miksan on December 20, 2003 8:02:34 AM]

This topic is closed to new replies.

Advertisement