Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

PHP GD Text with Transparency/Alpha background

alright so im having a problem with getting my text layed over a partly transparent image. i want the text to be solid, but i want part of the background of the image to be transparent, and the part the text is over to be solid, which i have, the problem is the text is inheriting the transparent background of one of the previous layers. here is the code, and an example of the output, and under that output what i want it to look like. the image is laying on a light grey background so the light border around the image in between the darker grey is transparent but nothing else should be especially the text. it seems to be not the text its self but the background of the text blocks that is transparent. which as you can see isn't very desirable. please help, this is the only problem i have left to complete my project. :)

can't post images yet, so heres a link to the image of example output and desired outcome (orig):

enter image description here

<?php

$img = imagecreatetruecolor(200, 50);

$imageX = imagesx($img);
$imageY = imagesy($img);

imagealphablending($img, false);
imagesavealpha($img, true);

$transparent = imagecolorallocatealpha($img, 255,255,255, 127);
$white = imagecolorallocate($img, 255,255,255);
$grey = imagecolorallocate($img, 127,127,127);
imagefilledrectangle($img, 0, 0, $imageX, $imageY, $grey);
imagefilledrectangle($img, 2, 2, $imageX-4, $imageY-4, $transparent);

$font = "./arialbd.ttf";
$fontSize = 12;
$text = "THIS IS A TEST";

$textDim = imagettfbbox($fontSize, 0, $font, $text);
$textX = $textDim[2] - $textDim[0];
$textY = $textDim[7] - $textDim[1];

$text_posX = ($imageX / 2) - ($textX / 2);
$text_posY = ($imageY / 2) - ($textY / 2);

imagefilledrectangle($img, 10, 10, $imageX-10, $imageY-10, $grey);
imagettftext($img, $fontSize, 0, $text_posX, $text_posY, $white, $font, $text);

header("Content-Type: image/png");
imagepng($img);

?>
like image 787
user258640 Avatar asked Jan 25 '10 18:01

user258640


People also ask

How to make transparent background in PHP?

The imagecolortransparent() function is an inbuilt function in PHP which is used to define color as transparent. It sets the color of a transparent image. It returns the identifier of the new transparent color. If an image has no transparent color and color not specified then it returns -1.

What is transparent BG?

Most images cover a certain number of pixels and have color in all of those pixels, even if that color is white. A transparent background has nothing in the background pixels, allowing what's behind it to show through.

How do I make text have a transparent background in CSS?

To set the opacity of a background, image, text, or other element, you can use the CSS opacity property. Values for this property range from 0 to 1. If you set the property to 0, the styled element will be completely transparent (ie. invisible).


1 Answers

hah i guess i didn't think hard enough on it. the solution was to turn imagealphablending back on before laying the text onto the image.

<?php

$img = imagecreatetruecolor(200, 50);

$imageX = imagesx($img);
$imageY = imagesy($img);

imagealphablending($img, false);
imagesavealpha($img, true);

$transparent = imagecolorallocatealpha($img, 255,255,255, 127);
$white = imagecolorallocate($img, 255,255,255);
$grey = imagecolorallocate($img, 127,127,127);
imagefilledrectangle($img, 0, 0, $imageX, $imageY, $grey);
imagefilledrectangle($img, 2, 2, $imageX-4, $imageY-4, $transparent);

$font = "./arialbd.ttf";
$fontSize = 12;
$text = "THIS IS A TEST";

$textDim = imagettfbbox($fontSize, 0, $font, $text);
$textX = $textDim[2] - $textDim[0];
$textY = $textDim[7] - $textDim[1];

$text_posX = ($imageX / 2) - ($textX / 2);
$text_posY = ($imageY / 2) - ($textY / 2);

imagefilledrectangle($img, 10, 10, $imageX-10, $imageY-10, $grey);
imagealphablending($img, true);
imagettftext($img, $fontSize, 0, $text_posX, $text_posY, $white, $font, $text);

header("Content-Type: image/png");
imagepng($img);

?>
like image 85
user258640 Avatar answered Oct 12 '22 23:10

user258640