 |  |
9.5. Images with Text
Often it is necessary to add text to images. GD has built-in fonts for this purpose. Example 9-4 adds some text to our black square image.
Example 9-4. Adding text to an image
<?php
$im = ImageCreate(200,200);
$white = ImageColorAllocate($im,0xFF,0xFF,0xFF);
$black = ImageColorAllocate($im,0x00,0x00,0x00);
ImageFilledRectangle($im,50,50,150,150,$black);
ImageString($im,5,50,160,"A Black Box",$black);
Header('Content-Type: image/png');
ImagePNG($im);
?>Figure 9-2 shows the output of Example 9-4.
Figure 9-2. The image with text
The ImageString( ) function adds text to an image. Specify the top-left point of the text, as well as the color and the font to use:
ImageString(image, font, x, y, text, color);
9.5.1. Fonts
Fonts in GD are identified by numbers. The five built-in fonts are shown in Figure 9-3.
Figure 9-3. Native GD fonts
You can create your own fonts and load them into GD using the ImageLoadFont( ) function. However, these fonts are binary and architecture-dependent. Using TrueType fonts with the TrueType functions in GD provides much more flexibility.
9.5.2. TrueType Fonts
To use TrueType fonts with GD, PHP must have been compiled with TrueType support via the FreeType library. Check your phpinfo( ) page (as described earlier in this chapter) to see if your "GD" section includes an entry stating that "FreeType" support is enabled.
To add text in a TrueType font to an image, use ImageTTFText( ):
ImageTTFText(image, size, angle, x, y, color, font, text);
The size is measured in pixels. angle is in degrees from 3 o'clock (0 gives horizontal text, 90 gives vertical text going up the image, etc.). The x and y coordinates specify the lower-left corner of the text (unlike in ImageString( ), where the coordinates specify the upper-right corner). The text may include UTF-8[5] sequences of the form ê to print high-bit ASCII characters.
[5]UTF-8 is an 8-bit Unicode encoding scheme. To learn more about Unicode, see http://www.unicode.org.
In GD 1.x, the font is a full path filename, including the .ttf extension. In GD 2.x, by default, the fonts are looked up in /usr/share/fonts/truetype and the lowercase .ttf extension is automatically added for you. Font sizing is also slightly different between GD 1.x and GD 2.x.
By default, text in a TrueType font is antialiased. This makes most fonts much easier to read, although very slightly blurred. Antialiasing can make very small text harder to read, though—small characters have fewer pixels, so the adjustments of antialiasing are more significant.
You can turn off antialiasing by using a negative color index (e.g., -4 means to use color index 4, but to not antialias the text). Antialiasing of TrueType fonts on true color images is broken in GD 2.0.1 but fixed as of GD 2.0.2.
Example 9-5 uses a TrueType font to add text to an image.
Example 9-5. Using a TrueType font
<?php
$im = ImageCreate(350, 70);
$white = ImageColorAllocate($im, 0xFF,0xFF,0xFF);
$black = ImageColorAllocate($im, 0x00,0x00,0x00);
ImageTTFText ($im, 20, 0, 10, 40, $black, 'courbi', 'The Courier TTF font');
header('Content-Type: image/png');
ImagePNG($im);
?>Figure 9-4 shows the output of Example 9-5.
Figure 9-4. Courier bold italic TrueType font
Example 9-6 uses ImageTTFText( ) to add vertical text to an image.
Example 9-6. Displaying vertical TrueType text
<?php
$im = ImageCreate(70, 350);
$white = ImageColorAllocate ($im, 255, 255, 255);
$black = ImageColorAllocate ($im, 0, 0, 0);
ImageTTFText ($im, 20, 270, 28, 10, $black, 'courbi', 'The Courier TTF font');
header('Content-Type: image/png');
ImagePNG($im);
?>Figure 9-5 shows the output of Example 9-6.
Figure 9-5. Vertical TrueType text
|  | |
| 9.4. Creating and Drawing Images |  | 9.6. Dynamically Generated Buttons |
Copyright © 2003 O'Reilly & Associates. All rights reserved.