Grafik: text zentrieren

[Raven280438]

Hi,

ich erstelle mir dynamisch Buttons, indem ich den Hintergrund des Buttons mit ImageCreateFromGIF lade und dann dynamisch den Text mit ImageTTFText draufschreibe.

Wie kann ich den Text immer zentriert draufschreiben lassen?


Gruß

 

[sipoh]

http://www.php.net/manual/de/ref.image.php

 

[Raven280438]

hilft mir nich wirklich weiter

 

[sipoh]

Ich habe ein paar gute Ansätze auf http://www.php.net gefunden.

Wie kann ich den Text immer zentriert draufschreiben lassen?

Die per x und y angegebenen Koordinaten definieren den Startpunkt des ersten Zeichens (in etwa die linke untere Ecke). [..] Und so weiter.

Eine Gegenüberstellung der Höhe und Breite des Buttons mit der Anzahl / Breite/Höhe des Textes sollte die Lösung liefern.

Wie gesagt: Alles da nachzulesen.

imagettftext -> phpnet

I spent days looking for this, couldn't find it, so just made it myself. This is an ultra simple text banner that keeps the text pretty much centered (not perfect when text is angled) vertically and horizontally. Size, font, colors are easy to edit and in HTML version for the colors.

Any additions (maybe for multi-line functionality) can be added if you desire.

<?php
### Declare this script will be displayed as a PNG image.
header("Content-type: image/png");

####################### BEGIN USER EDITS #######################
$imagewidth = 500;
$imageheight = 100;
$fontsize = "20";
$fontangle = "0";
$font = "arialf";
$text = "123456789";
$backgroundcolor = "003366";
$textcolor = "FFCC66";
######################## END USER EDITS ########################

### Convert HTML backgound color to RGB
if( eregi( "([0-9a-f]{2})([0-9a-f]{2})([0-9a-f]{2})", $backgroundcolor, $bgrgb ) )
{$bgred = hexdec( $bgrgb[1] );   $bggreen = hexdec( $bgrgb[2] );   $bgblue = hexdec( $bgrgb[3] );}

### Convert HTML text color to RGB
if( eregi( "([0-9a-f]{2})([0-9a-f]{2})([0-9a-f]{2})", $textcolor, $textrgb ) )
{$textred = hexdec( $textrgb[1] );   $textgreen = hexdec( $textrgb[2] );   $textblue = hexdec( $textrgb[3] );}

### Create image
$im = imagecreate( $imagewidth, $imageheight );

### Declare image's background color
$bgcolor = imagecolorallocate($im, $bgred,$bggreen,$bgblue);

### Declare image's text color
$fontcolor = imagecolorallocate($im, $textred,$textgreen,$textblue);

### Get exact dimensions of text string
$box = @imageTTFBbox($fontsize,$fontangle,$font,$text);

### Get width of text from dimensions
$textwidth = abs($box[4] - $box[0]);

### Get height of text from dimensions
$textheight = abs($box[5] - $box[1]);

### Get x-coordinate of centered text horizontally using length of the image and length of the text$xcord = ($imagewidth/2)-($textwidth/2)-2;

### Get y-coordinate of centered text vertically using height of the image and height of the text
$ycord = ($imageheight/2)+($textheight/2);

### Declare completed image with colors, font, text, and text location
imagettftext ( $im, $fontsize, $fontangle, $xcord, $ycord, $fontcolor, $font, $text );

### Display completed image as PNG
imagepng($im);

### Close the image
imagedestroy($im);
?>

Hilft dir aber sicher nicht weiter.

 

[Mairhofer]

Um den Text wirklich zu zentrieren ist es wichtig zu wissen, wie hoch und breit der Text ist auf dem Bild mit der zu schreibenden Schriftgrösse.

Habe mal so etwas geschrieben. Eventuell hilft dir das weiter.

/**
 * Calculate the center position (x/y) of a String in an Image
 *
 * Method calcs the center position in x and y direction of a string and a given area.
 * It returns an array of 3 elements
 *         0 => new font size
 *         1 => center x position in px
 *         2 => center y position in px
 * @param string $text The text that should fit
 * @param integer $widthArea The width the text should fit in px
 * @param integer $heightArea The height the text should fit in px
 * @param integer $font start with this Font-size
 */
function calcImageStringCenterPos($text, $widthArea, $heightArea, $font = 10)
{
    WHILE(strlen($text) * imagefontwidth($font) > $widthArea)
    {
        IF($font > 1)
        {
            $font--;
        }
        ELSE
        {
            break;
        }
    }

    $TitleCenterY = ($heightArea / 2) - (imagefontheight($font) / 2);
    $TitleCenterX = ($widthArea) / 2 - strlen($text) * imagefontwidth($font) / 2;

    RETURN array($font, $TitleCenterX, $TitleCenterY);
}

Wie funktionierts:
Wenn dein Button 80 * 30px gross ist und der Text "Hallo Welt" dadrauf passen soll rufst du die Funktion per

$aTextPos = calcImageStringCenterPos("Hallo Welt", 80, 30, 10)
var_dump($aTextPos);

Das Script fängt nun bei font-size 10 an, bis der Text passt in den gegeben Bereich (80x30). Als Rückgabe hast du ein Array, welches 3 Informationen liefert.
[0] => die schriftgrösse
[1] => Position X
[2] => Position Y

Ich hatte mir das damals geschrieben damit ich per imagestring() einen Text wirklich zentriert auf eine definierte Breite kriege.
Entweder ist es das was du suchst oder es hilft dir als Denkanstoss.

Mfg