Resizing transparent PNG

[Ree]

I created a simple PNG-8 image to use as a watermark with GD. It's basically just some text with completely transparent background. I can easily set the PNG's transparency with imagecopymerge() when merging it with other images. The problem comes when I resize the PNG at runtime and use the resized version as the watermark. Here's how it looks when I apply it. You can easily notice the white-ish background it gets after the resize. It should be completely transparent. This doesn't happen when using the original (non-resized) PNG. How do I get rid of the white background?

Here's the code:

Code: Select all

$image = imagecreatefromjpeg('booh.jpg'); //image to be watermarked
list($image_width, $image_height) = getimagesize('booh.jpg');
$water = imagecreatefrompng('text.png'); //watermark
list($water_width, $water_height) = getimagesize('text.png');

$water_resized_width = $water_width * 0.5; //resized width
$water_resized_height = $water_height * 0.5; //resized height

$resized = imagecreatetruecolor($water_resized_width, $water_resized_height);
$transparent = imagecolorallocatealpha($resized, 255, 255, 255, 127);
imagefill($resized, 0, 0, $transparent);
imagecopyresampled($resized, $water, 0, 0, 0, 0, $water_resized_width,  $water_resized_height, $water_width, $water_height);

imagecopymerge($image, $resized, (($image_width - $water_resized_width) / 2), (($image_height - $water_resized_height) / 2), 0, 0, $water_resized_width, $water_resized_height, 15);
imagejpeg($image, 'finished.jpg', 100);
imagedestroy($image);
imagedestroy($water);
imagedestroy($resized);

[onion2k]

When you create an image with imagecreatetruecolor() it's alpha channel is set to opaque .. so when you resample your watermark to it it'll become solid white. You need to create a transparent image. This is quite tricky .. but I've got a function to do it .. imagecreatetruecolortransparent() ..

Code: Select all

function imagecreatetruecolortransparent($x,$y) {
        $i = imagecreatetruecolor($x,$y);
        $b = imagecreatefromstring(base64_decode(blankpng()));
        imagealphablending($i,false);
        imagesavealpha($i,true);
        imagecopyresized($i,$b,0,0,0,0,$x,$y,imagesx($b),imagesy($b));
        return $i;
    }

    function blankpng() {

        $c  = "iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29m";
        $c .= "dHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAADqSURBVHjaYvz//z/DYAYAAcTEMMgBQAANegcCBNCg";
        $c .= "dyBAAA16BwIE0KB3IEAADXoHAgTQoHcgQAANegcCBNCgdyBAAA16BwIE0KB3IEAADXoHAgTQoHcgQAAN";
        $c .= "egcCBNCgdyBAAA16BwIE0KB3IEAADXoHAgTQoHcgQAANegcCBNCgdyBAAA16BwIE0KB3IEAADXoHAgTQ";
        $c .= "oHcgQAANegcCBNCgdyBAAA16BwIE0KB3IEAADXoHAgTQoHcgQAANegcCBNCgdyBAAA16BwIE0KB3IEAA";
        $c .= "DXoHAgTQoHcgQAANegcCBNCgdyBAgAEAMpcDTTQWJVEAAAAASUVORK5CYII=";

        return $c;

    }

There are alternatives .. as discussed here: viewtopic.php?t=40358

[Ree]

Yes, I have tried your method. But it gives me the same result, except that instead of white-transparent background I get black-transparent background (Here):

Code: Select all

$image = imagecreatefromjpeg('booh.jpg');
list($image_width, $image_height) = getimagesize('booh.jpg');
$water = imagecreatefrompng('text.png');
list($water_width, $water_height) = getimagesize('text.png');

$water_resized_width = $water_width * 0.5;
$water_resized_height = $water_height * 0.5;

$resized = imagecreatetruecolortransparent($water_resized_width, $water_resized_height);
imagecopyresampled($resized, $water, 0, 0, 0, 0, $water_resized_width,  $water_resized_height, $water_width, $water_height);

imagecopymerge($image, $resized, (($image_width - $water_resized_width) / 2), (($image_height - $water_resized_height) / 2), 0, 0, $water_resized_width, $water_resized_height, 15);
imagejpeg($image, 'finished.jpg', 100);
imagedestroy($image);
imagedestroy($water);
imagedestroy($resized);

function imagecreatetruecolortransparent($x, $y)
{
  $i = imagecreatetruecolor($x, $y);
  $b = imagecreatefromstring(base64_decode(blankpng()));
  imagealphablending($i, false);
  imagesavealpha($i, true);
  imagecopyresized($i, $b ,0 ,0 ,0 ,0 ,$x, $y, imagesx($b), imagesy($b));
  return $i;
}

function blankpng()
{
  $c  = "iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29m";
  $c .= "dHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAADqSURBVHjaYvz//z/DYAYAAcTEMMgBQAANegcCBNCg";
  $c .= "dyBAAA16BwIE0KB3IEAADXoHAgTQoHcgQAANegcCBNCgdyBAAA16BwIE0KB3IEAADXoHAgTQoHcgQAAN";
  $c .= "egcCBNCgdyBAAA16BwIE0KB3IEAADXoHAgTQoHcgQAANegcCBNCgdyBAAA16BwIE0KB3IEAADXoHAgTQ";
  $c .= "oHcgQAANegcCBNCgdyBAAA16BwIE0KB3IEAADXoHAgTQoHcgQAANegcCBNCgdyBAAA16BwIE0KB3IEAA";
  $c .= "DXoHAgTQoHcgQAANegcCBNCgdyBAgAEAMpcDTTQWJVEAAAAASUVORK5CYII=";
  return $c;
}

[onion2k]

Ahh.. silly me.. the problem is imagecopymerge() .. didn't spot that before. Change that to imagecopy(). Imagecopymerge() will ingore the transparency of the image you're copying and use it's own instead. If you want a semi-transparent image make a semi-transparent watermark to copy from.