2

I've run into another problem with GD and PHP.

I'm successfully writing text to an image.
However, I've encountered a case where it would be beneficial to place the text - instead of directly on the image - on a rectangle (or any shape) to create a solid background for the text where the image it's being placed on might not allow the text to be read very easily.

My two ideas are, in order of preference:

  1. Fill the background with the color as it writes the text
  2. Write the text to an appropriately sized image with a solid background, and then overlay the image onto the target

I can't figure out how to do #1 and #2 seems overly complex and I don't know how to determine the dimensions of the text so that I can create a new image for it.

For clarity, here is the output that isn't very good:

bad

And here's how I'd like it to look, with a tight box behind the text of any color:

better

I'm open to any suggestions, but drawing the color on the fly without any other images or hackiness would obviously be my first choice.

Update:

After @Dan suggested using `imagettftext', I decided that it was high time I added support for that function to my library. Everything is working as would be expected except for one major issue.

The text that's written to the image is still transparent, even when written to a solid background (0 transparency).

Here's a script I wrote to test:

<?php
    set_include_path('backbone:global:jquery');

    require_once('Image.php');

    $scout = new Image();
    $scout->source = "scout.jpg";

    $result = $scout->Write->Font(25, 25, "A Fairly Long String", 12, "#FF0000", 0, "LiberationSans-Regular.ttf", 1, "#FFFF00", .4, 4);

    if( !isset($_GET['dev']) )
    {
        header("Content-Type: " . $scout->contentType());
    }

    if( $result )
    {
        $scout->output();
    }
?>

The files I used/required:
1. scout
2. liberation font
3. Image Manipulation Library
- Image
- ImageBase
- ImageCombine
- ImageDraw
- ImageManipulate
- ImageWrite

I apologize about all the files, it really only uses Image, ImageBase, ImageCombine, and ImageWrite, but the others are require_onceed by the loader.

Here's a sample of the output from the script above:

transparent text background

And here's output with zero transparency (fully opaque):

$result = $scout->Write->Font(25, 25, "A Fairly Long String", 12, "#FF0000", 0, "LiberationSans-Regular.ttf", 1, "#FFFF00", 1, 4);

transparent on solid background

Any ideas what could be causing this? It's EXTREMELY possible that it's my code somewhere, but it seems strange that it would work exactly as I thought it should except for this one bug.

rockerest
  • 10,412
  • 3
  • 37
  • 67
  • What function do you use to write the text to your image? Is using ttf an option? – Dan Jun 14 '11 at 20:54
  • @Dan it's certainly an option, though just out of setting something up easily, I've been using the default [imagestring](http://www.php.net/manual/en/function.imagestring.php) and [imagestringup](http://www.php.net/manual/en/function.imagestringup.php). **edit** by the way, I'm using [this library](https://github.com/rockerest/myframework/blob/master/backbone/ImageWrite.php) that I wrote. – rockerest Jun 14 '11 at 20:56

2 Answers2

2

In searching desperately for the answer to this problem, I stumbled upon this SO question that's tangentially related to my problem, and contains the answer.

I've never fully understood why you tell imagealphablending false when you want transparency, so I guess my failure to properly understand the code I'm using has led to this issue.

In any case, the following modified code works like a charm in my one single test case. To write text to a background without forced 100% transparency for the character boxes, you must turn alpha blending ON while writing the text:

imagealphablending($text->handle, true);
$bool = imagettftext($text->handle, $textSize, $angle, $padding, abs($size[5]) + $padding, $this->AllocateColor($rgba[0]['r'], $rgba[0]['g'], $rgba[0]['b'], $rgba[0]['alpha']), $font, $string);
imagealphablending($text->handle, false);
Community
  • 1
  • 1
rockerest
  • 10,412
  • 3
  • 37
  • 67
1

Maybe this will do the job for you if you switch to ttf. http://php.net/manual/en/function.imagettfbbox.php

Dan
  • 1,878
  • 13
  • 17
  • I've seen stuff like that before when resizing an image. Is there any resizing involved? – Dan Jun 15 '11 at 08:16
  • no resizing whatsoever. It's essentially: 1) Load Scout, 2) Make new image the size of the text, 3) Write the text, 4) Overlay the text to the Scout Image, 5) Display the combined image. It's kinda ticking me off :-/ I wish GD wasn't so picky. – rockerest Jun 15 '11 at 15:00