[Tutorial] Fading Text Effects
Author |
Message |
TheZsterBunny
|
Posted: Mon May 31, 2004 7:03 am Post subject: [Tutorial] Fading Text Effects |
|
|
i've used this effect in some of my programs; it looks very much like flash provided you use the right colors.
Lets make our intro window nice and small
Your colors will be:
-black background
-pure blue intro text
-orange 'risk' text
we begin simply with this:
code: |
setscreen ("offscreenonly,nobuttonbar,position:truemiddle,centre,graphics:400;300")
colorback(7) % Black
cls
|
nice, this will do well for our little intro
perhaps it is time now to familiarize yourself with the RGB module (which I love)
RGB.anything will always use three real numbers as red, green, and blue 'amount of color' values.
time for some math:
its time to think about what we want to do with our colors.
lets have our first text fade from black to pure blue over the course of two seconds.
for slower computers, we can have fewer colors generated, and a longer delay, but for our purposes, we're going to generate 40 colors at 50msec intervals
code: |
var clr : int := 218 % The color to assign to
var text1 : int := Font.New ("Times New Roman:18:Bold") % First Font
for i : 0 .. 39
RGB.SetColor (clr, 0, 0, i / 39)
Font.Draw ("Welcome to...", (maxx div 2) - (Font.Width ("Welcome to...", text1) div 2), (maxy div 2) - 9, text1, clr)
View.Update
delay (50)
end for
delay (1000)
for decreasing i : 39 .. 0
RGB.SetColor (clr, 0, 0, i / 39)
Font.Draw ("Welcome to...", (maxx div 2) - (Font.Width ("Welcome to...", text1) div 2), (maxy div 2) - 9, text1, clr)
View.Update
delay (50)
end for
|
This takes 2 seconds to fade in, leaves it for one second, and fades it out in 2 seconds. if you look really carefully, turing leaves little jaggies where it darkens the text. this can be solved simply with a black box.
code: |
for i : 0 .. 39
RGB.SetColor (clr, 0, 0, i / 39)
Font.Draw ("Welcome to...", (maxx div 2) - (Font.Width ("Welcome to...", text1) div 2), (maxy div 2) - 9, text1, clr)
View.Update
drawfillbox ((maxx div 2) - Font.Width ("Welcome to...", text1) - 5, (maxy div 2) - 13, ((maxx div 2) + Font.Width ("Welcome to...", text1) + 5), (maxy div 2) + 13, 7)
delay (50)
end for
delay (1000)
for decreasing i : 39 .. 0
RGB.SetColor (clr, 0, 0, i / 39)
Font.Draw ("Welcome to...", (maxx div 2) - (Font.Width ("Welcome to...", text1) div 2), (maxy div 2) - 9, text1, clr)
View.Update
drawfillbox ((maxx div 2) - Font.Width ("Welcome to...", text1) - 5, (maxy div 2) - 13, ((maxx div 2) + Font.Width ("Welcome to...", text1) + 5), (maxy div 2) + 13, 7)
delay (50)
end for
|
Our problem is solved.
There is much more you can do with this, which i'll post later.
here is the full code for you again.
code: |
setscreen ("offscreenonly,nobuttonbar,position:truemiddle,centre,graphics:400;300")
colorback (7) % Black
cls
var clr : int := 218 % The color to assign to
var text1 : int := Font.New ("Times New Roman:18:Bold") % First Font
for i : 0 .. 39
RGB.SetColor (clr, 0, 0, i / 39)
Font.Draw ("Welcome to...", (maxx div 2) - (Font.Width ("Welcome to...", text1) div 2), (maxy div 2) - 9, text1, clr)
View.Update
drawfillbox ((maxx div 2) - Font.Width ("Welcome to...", text1) - 5, (maxy div 2) - 13, ((maxx div 2) + Font.Width ("Welcome to...", text1) + 5), (maxy div 2) + 13, 7)
delay (50)
end for
delay (1000)
for decreasing i : 39 .. 0
RGB.SetColor (clr, 0, 0, i / 39)
Font.Draw ("Welcome to...", (maxx div 2) - (Font.Width ("Welcome to...", text1) div 2), (maxy div 2) - 9, text1, clr)
View.Update
drawfillbox ((maxx div 2) - Font.Width ("Welcome to...", text1) - 5, (maxy div 2) - 13, ((maxx div 2) + Font.Width ("Welcome to...", text1) + 5), (maxy div 2) + 13, 7)
delay (50)
end for
|
if you want, you can save the colors generated to an array (if you wish to use them later)
I've attached a file where i've done very much custom-color-generation, so as people can see the beauty of this module.
+boxrow.t
-Z
[/code]
Description: |
turing-generated images to be used in my final project. |
|
Download |
Filename: |
boxrow.t |
Filesize: |
13.05 KB |
Downloaded: |
1056 Time(s) |
|
|
|
|
|
|
Sponsor Sponsor
|
|
|
aside
|
Posted: Thu Jun 03, 2004 2:30 am Post subject: (No subject) |
|
|
is it possible to fade a picture? I mean other than doing it pixel by pixel?
|
|
|
|
|
|
TheZsterBunny
|
Posted: Thu Jun 03, 2004 4:35 am Post subject: (No subject) |
|
|
other than doing it pixel by pixel? i don't think so.
My tutorial shows how to do an effect which resembles fading text.
There is no transparency, i am just changing the text pixel by pixel.
If you generate the pictures in turing, there should be no problem fading.
-Z
|
|
|
|
|
|
TheZsterBunny
|
Posted: Sun Jan 30, 2005 4:37 pm Post subject: (No subject) |
|
|
Due to a number of requests (1), I will be expanding on the use of the RGB module.
lets have some code ^_^
code: |
proc drawFadePic (x, y : int, picID : int, alpha : real, forbid : int)
setscreen ("offscreenonly")
var drawOver : int
type ptclr :
record
r, g, b : real
end record
var forbidden : ptclr
RGB.GetColor (forbid, forbidden.r, forbidden.g, forbidden.b)
var colorcomp : array 0 .. Pic.Width (picID), 0 .. Pic.Height (picID), 1 .. 2 of ptclr
for i : x .. Pic.Width (picID) + x
for j : y .. Pic.Height (picID) + y
RGB.GetColor (whatdotcolor (i, j), colorcomp (i - x, j - y, 1).r, colorcomp (i - x, j - y, 1).g, colorcomp (i - x, j - y, 1).b)
end for
end for
Pic.Draw (picID, x, y, picCopy)
var tcolor : int := 7
for i : x .. Pic.Width (picID) + x
for j : y .. Pic.Height (picID) + y
RGB.GetColor (whatdotcolor (i, j), colorcomp (i - x, j - y, 2).r, colorcomp (i - x, j - y, 2).g, colorcomp (i - x, j - y, 2).b)
if colorcomp (i - x, j - y, 2).r = forbidden.r & colorcomp (i - x, j - y, 2).g = forbidden.g & colorcomp (i - x, j - y, 2).b = forbidden.b then
colorcomp (i - x, j - y, 2) := colorcomp (i - x, j - y, 1)
end if
RGB.SetColor (tcolor,
(colorcomp (i - x, j - y, 1).r * (1 - alpha)) + (colorcomp (i - x, j - y, 2).r * alpha),
(colorcomp (i - x, j - y, 1).g * (1 - alpha)) + (colorcomp (i - x, j - y, 2).g * alpha),
(colorcomp (i - x, j - y, 1).b * (1 - alpha)) + (colorcomp (i - x, j - y, 2).b * alpha))
drawdot (i, j, tcolor)
end for
end for
View.Update
setscreen ("nooffscreenonly")
end drawFadePic
var ghost, house : int
ghost := Pic.FileNew ("ghost.jpg")
house := Pic.FileNew ("hauntedhouse.jpg")
Pic.Draw (house, 0, 0, picCopy)
% This is added to make the house look bad. It makes the ghost look better.
for i : 1 .. maxx
for j : 1 .. maxy
drawdot (i, j, whatdotcolor (i, j))
end for
end for
drawFadePic (50, 50, ghost, 0.2, RGB.AddColor (1, 0, 1))
|
yes, you CAN fade pictures. it looks crappy, but its turing!
alright, in this program I've tried to use all the RGB commands. lets break them down!
Throughout this exercise, I will repeat variable names. notibly r, g, and b. they stand for 'red' 'green' and 'blue' respectively.
code: |
RGB.AddColor (r,g,b) : int
|
We are creating a new color with our specified red green and blue values.
These values MUST be between 0 and 1. some sample colors.
RGB.AddColor(1,0,0) --> pure red
RGB.AddColor(0,0,1) --> pure blue
RGB.AddColor(1,0,1) --> pepto-bismol pink.
next we have
code: |
RGB.SetColor(clr,r,g,b)
|
Here, you can set an existing color to a new one.
i.e.
RGB.SetColor(7,0.5,0.5,0.5) --> Color 7 (originally black) is now grey.
code: |
RGB.GetColor(clr,r,g,b)
|
NO! this is NOT the RGB equivalent to whatdotcolor! This value returns the red, green, and blue amounts of an existing turing color.
i.e.
RGB.GetColor(7,r,g,b) --> r, g, and b all have been assigned a value of 0.5 (following last example)
however, for the curious,
RGB.GetColor(whatdotcolor(x,y),r,g,b) will return the values of the closest existing turing color.
..and thats pretty much all you'll need. Also, because this is a canadian programming language, you can use the canadian spellings of 'colour' in every case.
-Z
ah, yes. how to use my procedure.
drawFadePic(x,y,[picture ID number], [fade amound], ['clear' color])
Description: |
By TheZsterBunny. one lazy afternoon before exams ^_^';;; |
|
Download |
Filename: |
RGBDemo.rar |
Filesize: |
97.23 KB |
Downloaded: |
695 Time(s) |
|
|
|
|
|
|
Cervantes
|
Posted: Sun Jan 30, 2005 4:50 pm Post subject: (No subject) |
|
|
Thanks Zster. Complete RGB tutorial
Mind you, boxrow.t is still not there. Do you still have it?
+bits
-Cervantes
|
|
|
|
|
|
TheZsterBunny
|
Posted: Sun Jan 30, 2005 7:02 pm Post subject: (No subject) |
|
|
I reformatted in aug. I don't have any of that project anymore. I don't have my paint, i don't have my game, i don't have my other game...
I think it is still included with the Vexed file tho'
-Z
|
|
|
|
|
|
cycro1234
|
Posted: Mon Jan 31, 2005 10:14 am Post subject: (No subject) |
|
|
Awsome effects! Thx Perfect for my intros
|
|
|
|
|
|
TheZsterBunny
|
Posted: Mon Jan 31, 2005 3:52 pm Post subject: (No subject) |
|
|
this is a TUTORIAL, not a CODE-GIVE-AWAY session. use with creds plz.
|
|
|
|
|
|
Sponsor Sponsor
|
|
|
|
|