[Date Prev][Date Next][Thread Prev][Thread Next][Date Index][Thread Index]

[pygame] Font problem




Hi,

I have a smallish problem that I haven't found any nice solution for.

I want to render some text with an "outline" in another color. The text is
rendered in one color (say, white) and the outline in another (say,
black). The outline should be rendered all around the text, and it should
make the text more readable, as the text is to be blitted on top of very
colorful things. The outline should be about 2 pixels wide in all
directions. So the letter "l" could look like:

     ######
     ######
     ##..##
     ##..##
     ##..##
     ##..##
     ##..##
     ##..##
     ######
     ######

where # is black and . white. So, how to create such a beast? The outline
need not be perfect, so I tried a small hack: first render the text as
black into one surface, allocate a final surface that's 4 pixels wider and
higher than the text, then blit the black text into that surface 4 times,
each time offset +-2 pixels in the x- and y-directions. Finally blit in a
rendered white surface in the middle. Should work fine? The code that does
that is below:


   # first render the main text and a shadom
   maintext = self.font.render ( text, 1, white )
   shadow   = self.font.render ( text, 1, black )

   # now we get the size of that surface, as we want a slightly
   # larger final surface
   width  = maintext.get_width () + 4
   height = maintext.get_height () + 4

   # now allocate the final surface
   label = pygame.Surface ( ( width, height ), HWSURFACE )

   # fill with a color we can make transparent later
   label.fill ( (10,10,10) )
                             
   # blit out the outline offset a few pixels
   label.blit ( shadow, ( 0, 0 )) # top left
   label.blit ( shadow, ( 4, 0 )) # top right
   label.blit ( shadow, ( 0, 4 )) # bottom left
   label.blit ( shadow, ( 4, 4 )) # bottom right
        
   # now blit out the actual text in the middle of the surface
   label.blit ( maintext, ( 2, 2 ))

   # make blackish pixels transparent
   label.set_colorkey ( (10, 10, 10) )


Note that I try to use colorkey with an unlikely color to make sure that
all stuff around the text and outline is transparent (otherwise black).
However, this gives me crappy results, it looks like this:

	http://www.infa.abo.fi/~chakie/media/font.png

when magnified. Clearly this isn't what I want, the black should be solid,
not spotty like this. It does not help to change the colorkey color
either, the result is the same.

Any tips for how to make this better or something totally different that
would be better? As can be seen from the shot the stuff under the label is
very colorful, so something is needed.

-- 
                        "Bingeley bingeley beep!"
               -- The Personal Disorganizer, Terry Pratchett in Feet of Clay

____________________________________
pygame mailing list
pygame-users@seul.org
http://pygame.seul.org