Hello there! :)
For the last couple of days, I've been working on a new project. The idea is to create a virtual adoptable pets system integrated with my forums. While I have much of it covered already, I am new to dynamic images and the GD library. So I decided to write a little sample script for practice purposes.
I took a picture of a "pet", which is saved in PNG format and has a transparent background, as the source. It is anti-aliased. The original looks just fine. No white dots around the image and no rough edges. Just smooth, and pretty. :)
This is my current script:
<?php
if(!isset($_GET) OR !isset($_GET['name']) OR !isset($_GET['owner'])) {
header('location: http://arwym.com/wym');
die();
} else {
$petname = $_GET['name'];
$petowner = $_GET['owner'];
$imagesource = 'petimg/kitsune01.png';
$image = imagecreatefrompng($imagesource);
$bg = ImageColorAllocate($image, 255, 0, 255);
$textshadow = ImageColorAllocate($image, 0, 0, 0);
$textcolor = ImageColorAllocate($image, 255, 255, 255);
$textfont = 'macro_normal.ttf';
imagefill($image, 0, 0, $bg);
imagecolortransparent ($image, $bg);
imagettftext($image, 15, 0, 23, 23, $textshadow, $textfont, $petname);
imagettftext($image, 15, 0, 21, 21, $textcolor, $textfont, $petname);
header('content-type: image/png');
imagepng($image);
imagedestroy($image);
}
?>
Since it is just for practice, I didn't make it too complicated. What the script does is take the requests for the pet's and the owner's names. Then it creates an image from a PNG (the pet image I mentioned), adds the pet's name on top of it (I am not using the owner's name in the script, until I can solve the current problems) with a TTF font (note that the text is white), and generates the image. The image does not get saved.
The original script didn't have the following lines: $bg = ImageColorAllocate($image, 255, 0, 255);
imagefill($image, 0, 0, $bg);
imagecolortransparent ($image, $bg);
As a result, the image's background resulted white, and not transparent. So the only solution I could find was to add that. However, the problems still persist: image quality is messed up for some reason. It looks very ugly, with white pixels around, rough edges; and the text, no matter what I try, tends to look strange.
This is the resulting image after filling a form:
http://arwym.com/wym/adoptables/pet.php?name=Pet Name Here&owner=Arwym
I don't know what I'm doing wrong, so if you could enlighten me or help me find a solution... If it helps, I am using a version of PHP which is 5 or above. I believe GD comes bundled with it. Am I right? As for the GD version, I am not sure, but if it helps, I could find out.
Also, I am viewing the image with Mozilla Firefox, so I doubt this has much to do with the browser? Unless I am missing something, but I frequent many websites where dynamic image scripts are used, and often the images are PNG's, and look perfectly fine. So I am assuming that either it is my own mistake, or something isn't quite right with something else.
My major concern is the quality of the image. I want it to look as smooth and pretty as the original. :( I could probably live with the rest, or work with some alternative (if any).
Any help is truly, very much appreciated.