# Tutorial: Text fade in, fade out, fade in + out

Hi there,

I wanted to post a simple example for text fade in, fade out, and fade in + out.
(feel free to adjust and use this however you like in your project)

Now, the code and explanation:

I have used sine waves (sin function) for this example as it might be one of the simplest ways to write fade in+out.

[size=150]How it works:[/size]
Fade in works by increasing the variable “Value” by 0.1*TimeDelta() in each cycle, until it reaches 0.5. TimeDelta() is there to ensure the same speed on every computer. Alternatively we can use timers, but not as reliable.

So, value goes from 0 to 0.5 in fade in.

This is because 0 multiplied by anything will always give us 0 (so text will be completely faded out, 0 visibility), but sin(0.5*Pi) will give us 1 (full value, top part of the wave if visualized).

So , if we have sin(0Pi) to ending with sin(0.5Pi) we would get text opacity from 0 to 1.
But, text opacity goes to 255, so we need a value from 0 to 255. How do we get that? We multiply the result by 255.

So, now we have:
start point: sin(0Pi)255=0255=0
end point: sin(0.5
Pi)255=1255=255

So, our range is now from 0 to 255, a full fade in!

We used 3.14159 for Pi value, so the full function we use for text opacity is:

``sin( Variable(Value)*3.14159 )*255``

Note: There will be some inaccuracy as Pi is not exactly 3.14159 but an infinite chain of numbers.

Fade out works the same as fade in but we inverted the condition and starting value. So now “value” goes from 0.5 to 0. Note that we did not need to invert conditions, but could have used value from 0.5 to 1 instead, because at this part of the wave, value drops down from 1 to 0 (0.5pi gives 1, but 1pi gives 0).