By: Jack Hoxley
Written: June 2000
This isn't so much of a tutorial;
more an example of how to do the above. I had this thought about doing a credits
screen for a game; but using textured text - and the texture would be animated.
It is best understood by seeing
the program in action - I was quite impressed with it; it may not be 3D, but
it's simple, almost every computer will support it and its FAST.
Normally all the text you draw
is one colour; unless you create your own text drawing procedure or use a weird
font. This particular program uses this *problem* to create a new effect - If
the text is all one colour, you can make it the transparent colour. That means
that you can see everything underneath it. If you can see everything underneath
it - lets put something cool and good looking underneath it. How about animate
the picture underneath it? Even better.
So, some simple thinking makes
for a rather clever use of resources available to us. Next; putting this idea
into something we can program.
- We'll need some animated textures
- not too difficult. Just draw some. Keep them small, otherwise they'll slow
the program down.
- We'll tile the animation onto
one surface; make it a vertical surface to avoid the problems with wide surfaces.
- We dont need to have a pre-drawn
surface for the text - we can create a blank surface and draw the text on
- We'll use a source colour
key rather than a detination colour key - as there's much better support for
the source colour key.
Here's the texture we'll be using.
It's going to be made up of 20 frames - 10 up, 10 down, to get everything moving
smoothly. The text to be drawn will be size 20; so we need the texture to be
30 pixels high - 20 of these means that it'll be 600 pixels high in total. Not
too bad. The width needs to be 300 pixels to suit our text. Overall dimensions
It may look small,
but when the screen is at 640x480 it won't be too bad.
Download the example
program - it's the only way you'll see proper animation. You can get it from
the top of this page, or from the downloads page.