User Tools

Site Tools


php:tutorials:textgrafik

[PHP] Transparente Textgrafiken On-the-Fly erstellen

Inhalt:

Einleitung Voraussetzungen Code Anwendung

Einleitung

Viele von euch kennen das Problem. Sie haben eine coole Schrift, die sie gerne in irgend einer Farbe als Titelgrafik verwenden würden. Oder als Navigationsbutton. Das bedeutet mühsam diese Grafiken erstellen, speichern und sauber verlinken. Mit jder zusätzlichen Seite müssen diese Dinger ebenfalls erstellt werden. Die bekannte Alternative sind Weft etc, wo man Schriften fürs Web bereitstellen kann. Leider verlangsamt dies die Ladezeit der Seite extrem.

Doch mit PHP gibt es die Möglichkeit, eine Grafik beim Aufruf der Seite zu erstellen. Ganz individuell mit normalen ttf-Schriftarten.

Voraussetzungen

Auf dem PHP-Server mit GDlib. Dies sieht man im PHPinfo unter dem Punkt "gd". Ebenfalls muss man die Schrift irgendwo auf dem Server haben.

Code

Man erstellt also eine datei, die man später als Grafik aufruft. Die EInzelnen Komponenten der Datei sind direkt im Code dokumentiert

text.php
<?php
	// Settings
 
// Schriftpfad. Achtung, Serveradresse!
// Diese muss an dein System angepasst werden
// Zu finden in der phpinfo unter Apache Environment -> DOCUMENT_ROOT 
// und dann den Pfad bis zu der Schrift erweitern
	define('C_FONT', 'C:/xampp/htdocs/test/tools/font/ttf/Arial.TTF');
// Hintergrundfarbe. RGB in Zahlen    
	define('C_COLOR_BACKGROUND', '255,255,255');
// Schriftfarbe. RGB in Zahlen    
	define('C_COLOR_TEXT', '0,0,0');
// Schrift hat transparanter Hintergund
	define('C_TRANSPARENT', true);    
 
	// Uebergabeparameters:
	// txt      Der darzustellende Text
	// s        Schriftgrösse (optional)
	// r        Randbreite um die Schrift (optional)
 
	// Anforderungen
	// GD-Lib muss installiert sein. Die Schrift muss sich am richtigen Ort befinden (ttf-Format))
 
	// Beispielaufruf:
	// <img src="http://domain.de/font.php?txt=danke&nbsp;Yaslaw&s=30" alt="bunter Text">
 
 
	// Standarth&ouml;he
	$s = (isset($_GET['s'])) ? $_GET['s'] : 50;
	// Standartrahmen
	$r = (isset($_GET['r'])) ? $_GET['r'] : 10;
	// Standarttext
	$txt = (isset($_GET['txt'])) ? $_GET['txt'] : 'Es ist Kein Text definiert';
 
// Schriftpfad. Achtung, Serveradresse!
// Zu finden in der phpinfo unter Apache Environment -&gt; DOCUMENT_ROOT
 
	// Schriftbildgr&ouml;sse ermitteln
	$box=imagettfbbox($s,0,C_FONT,$txt);
 
	// Grafik erstellen
	$im = imagecreate ($box[4]+$r, abs($box[7])+$r);
 
	//Grundfarben definieren (rgb))
	// Background (Es empfiehlt sich diese ungef&auml;hr der Hintergrundtextur der Seite anzupassen,
	//da immer ein schwacher Rahmen bleibt. In unserem Fall nehm ich als Hintergrund Schwarz):
	$keys = array('r', 'g', 'b');
	$cA = array_combine($keys, explode(',', C_COLOR_BACKGROUND));
	$bc = ImageColorAllocate ($im, $cA['r'], $cA['g'], $cA['b']);
	// Textfarbe:
	$cA = array_combine($keys, explode(',', C_COLOR_TEXT));
	$tc = ImageColorAllocate ($im, $cA['r'], $cA['g'], $cA['b']);
 
	// Hintergrund mit Hintergrundfarbe f&uuml;llen
	imagefill($im,0,0,$bc);
 
	// Hintergrundfarbe als transparent definieren
	if(C_TRANSPARENT) imagecolortransparent($im,$bc);
 
	// Text einf&uuml;gen
	ImageTTFText ($im, $s, 0, 0, abs($box[7]) , $tc, C_FONT, $txt);
 
	// Header ausgeben
	Header ("Content-type: image/png");
 
	// Grafik als Png ausgeben
	ImagePNG ($im);
 
	// tempor&auml;re Grafik zerst&ouml;ren
	ImageDestroy ($im);
?>

Also, den ganzen Grümpel speichern und dann mal mit den Parametern aufrufen..

(Anmerkung: Viele haben wie ich auf dem Lokalen Server die GD-Lib nicht installiert. In diesem Fall mal alles auf den Webserver werfen…

Anwendung

Die Datei wird nachher einfach aus dem HTML-Code aufgerufen

<img src="http://domain.de/font.php?txt=danke Yaslaw&s=30" alt="bunter Text">
php/tutorials/textgrafik.txt · Last modified: 09.12.2013 09:39:54 (external edit)