La programación a veces puede ser hasta divertido y muestra de ello es poder crearnos imágenes simples o con cierta complegidad; para ello vamos a usar las librerías GD que nos permite tratar imágenes tanto JPEG, GIF o PNG. Para empezar lo primero es comprobar que esta instalado y configurado en el PHP, para ello simplemente haciendo un phpinfo() lo podemos ver.
Creo que la mejor forma de entenderlo es hacer un ejemplo sencillito, para ello vamos a crear un botón con un texto personalizable (al final del ejemplo pondré el código entero).
Comenzamos definiendo el texto que queremos introducir en el botón: en nuestro caso será "HOLA" y haremos que este centrado.
$tamano_fuente = 3;
$nombre = "HOLA";
$cantidadCaracteres = strlen($nombre);
$textoAltura = imagefontheight($tamano_fuente) * $cantidadCaracteres;
$textoAncho = imagefontwidth($tamano_fuente) * $cantidadCaracteres;
El primer paso que hemos realizado ha sido definir tanto el tamaño de la fuente (va desde el 1 al 10) y luego el texto que vamos a querer utilizar, a continuación como vamos a crear un botón de forma dinámica y el tamaño puede variar lo que hacemos es calcular cuanto espacio va a ocupar el texto. Todavía no vamos a pintarlo en pantalla ya que la forma de tratar todo las librerías GD es sobreponiendo, es decir si pones 2 objetos estando el uno sobre el otro, el que se verá es el último que se ha programado.
Una vez sabemos el tamaño del texto, lo que haremos será crear el fondo sobre el que escribiremos el texto, para ello usaremos la herramienta que te permite dibujar rectángulos.
$ancho = $textoAncho + 20;
$alto = $textoAltura + 10;
// Para crear una imagen desde 0 usaremos:
$imagen = imagecreatetruecolor($ancho, $alto);
// Para crear una imagen desde un archivo usaremos:
$imagen = imagecreatefromjpeg('la_ruta_del_archivo');
imagefilledrectangle($imagen, 0, 0, $ancho, $alto, 'color_que_deseamos_de_fondo');
En este paso lo que hemos realizado es definir el ancho y el alto de la imagen final, para ello como vamos a meter el texto centrado lo que hacemos es darle un poco más de tamaño (hay que tener en cuenta que ese espacio de más que se da hay que dividirlo entre 2 para saber cuanto margen habrá entre el borde la imagen y el principio/fin del texto por cada lado).
Otra peculiaridad de GD es que podemos trabajar con una imagen en vacío o bien usar una imagen externa; en el caso de un fondo vacio habría que usar imagecreatetruecolor pero para usar una imagen usaremos imagecreatefromjpeg. En este último caso dependiento del tipo de imagen que usemos, hablando en plata el formato, habría que usar imagecreatefromjpeg, imagecreatefromgif o imagecreatefrompng.
Y ya como último paso para definir el fondo es crear el rectángulo con el mismo tamaño de la imagen. Los campos qe hay que definir por orden son: identificador de la imagen, posición X inicial, posición Y inicial, posición X final, posición Y final, color en formato RGB. Para el color, podemos definir una variable antes llamada $color por ejemplo y se definiría así:
$color = ImageColorAllocate($imagen, 255, 0, 0);
$color_texto = ImageColorAllocate($imagen, 255, 255, 255);
Ya casi hemos terminado el ejemplo, sólo nos queda pintar el texto y fin.
$xCentrado = ($ancho – $textoAncho) / 2;
$yCentrado = ($alto – $textoAltura) / 2;
imagestring($imagen, $tamano_fuente, $xCentrado, $yCentrado, $nombre, $color_texto);
Poca explicación hace falta no? lo importante es calcular en qué posición exacta ha de empezar el texto tanto en coordenadas X como en Y y poco más.
Con esto la imagen en si ya esta terminada y solo nos queda enviar las cabeceras adecuadas para pintarlo en el navegador. En nuestro ejemplo, nosotros vamos a mostrarlo como un archivo PNG así que lo que hay que colocar al final del código es lo siguiente:
header("Content-type: image/png");
imagepng($imagen);
imagedestroy($imagen);
Bien pues eso ha sido todo para generar una imagen muy sencillita que en nuestro caso será un botón con un texto en el centro pero se pueden hacer verdaderas casi obras de arte.
Ah! esta imagen que hemos creado, la podemos almacenar en el disco duro del servidor de la siguiente forma para así no sobrecargarlo al tener que hacer esta operación muchas veces.
imagepng($imagen, 'ruta_completa_con_nombre_de_archivo_y_extenxión_incluida');
Si hacemos esto último, debemos añadirlo junto antes de destruir la imagen porque sino mal lo llevamos 