Adicionando texto em imagens em tempo real

Com o uso de PHP e a biblioteca GD, a manipulação de imagens, editando e inclusive inserindo textos antes de apresetar a imagem ao usuário se torna uma tarefa simples. Como estes dias tive de recorrer a este recurso para gerar cupons “on the fly” no site ComuniWEB, decidi escrever um artigo mostrando como isso é possível e apresentando a simplicidade da tarefa.

Primeiros passos

Atenção: Verifique se a biblioteca GD esta instalada no phpinfo(); Existem algumas formas de exibir o resultado de uma operação como esta, por exemplo:

  • salvar o arquivo em disco
  • apresentar na tela (como imagem, dentro do HTML)
  • apresentar na tela (somente imagem)

Neste exemplo vamos apresentar o arquivo como uma imagem, embutida no HTML como qualquer outra, para isso precisamos entender a seguinte estrutura. Geralmente uma tag do tipo “” aponta para um arquivo “.jpg” ou “.gif”, mas neste caso iremos apontar ela para um arquivo “.php” que irá retornar os dados como se fosse uma imagem sendo lida.

Com isso vamos ter a seguinte estrutura, dois arquivos, um chamado main.php e um chamado imagem.php. O arquivo main.php irá apresentar o HTML e mostrar a imagem, o arquivo imagem.php será o real responsável por buscar uma imagem e inserir texto nela, neste caso criamos mais um arquivo img.jpg para servir de exemplo.

main.php

Este arquivo é bem simples e direto, HTML com uma imagem, apenas um detalhe importante, no nome da imagem vamos passar um valor por GET com o texto que será escrito na imagem: ```html Veja abaixo seu certificado


**imagem.php**

Aqui começa a mágica, este arquivo deve recuperar a imagem original, o texto enviado e fazer a junção dos dois, então, vou explicar o processo passo a passo.

O primeiro passo é carregar a imagem em um recurso do PHP, basicamente carregar a imagem na memória. Para isso o PHP possui diversas funções dependendo do formato da imagem, [ImageCreateFromJPEG](http://br2.php.net/manual/pt_BR/function.imagecreatefromjpeg.php), [imageCreateFromGIF](http://br2.php.net/manual/pt_BR/function.imagecreatefromgif.php), etc...

```php
$rImg = ImageCreateFromJPEG("ex-img.jpg");

Agora para a escrita temos que preparar alguns dados para a escrita. Existem duas formas de escrever em uma imagem, caracter por caracter ou uma string completa (imagechar ou imagestring ). Neste caso vamos usar a função para strings, mas ambas recebem os mesmo valores, variando apenas o texto a ser escrito. Antes de chamar a função devemos ter pronto a cor com o qual será escrito o texto.

ara isso devemos usar a função imagecolorallocate que recebe como valores o ponteiro da imagem e a cor, em três parametros separados no formato RGB. Neste caso usamos preto:

$cor = imagecolorallocate($rImg, 0, 0, 0);

Agora sim podemos efetuar a escrita. A função imagestring recebe estes parametros, nesta ordem:

  • imagem: o ponteiro da imagem
  • font: um valor inteiro, de 1 a 5 (fonte padrão, quanto maior o número, maior a fonte) ou uma fonte de sistema
  • x: deslocamento horizontal (coordenada)
  • y: deslocamento vertical (coordenada)
  • string: texto que será escrito
  • color: variável com a cor definida anteriormente

Vale lembrar que x e y estão em relação ao topo esquerdo da imagem. Em relação a fonte, neste exemplo iremos utilizar a fonte padrão do PHP, mas geralmente é possivel utilizar qualquer fonte tty, vou descrever um pouco mais no final do artigo.

Esta é nossa imagem de base:

Vou escrever meu nome no local reservado, com isso levando em conta a posição (remova 2 a 3 pixels do topo de overhead da fonte), e o fato de que devo decodificar o texto com urldecode, o resultado final da função é este:

imagestring($rImg,5,126,22,urldecode($\_GET\['nome'\]),$cor);

Antes de finalizar o arquivo devemos definir o header indicando que estamos echoando uma imagem do tipo JPG e após isso podemos usar a função imageJPEG que intrui o PHP a jogar o código da imagem para a tela, existe a opção de passar um segundo parametro que indica o nome do arquivo que deve ser gerado.

header('Content-type: image/jpeg'); imagejpeg($rImg); 

Este é o resultado final:

E este o código completo: ```php < ?php

//Carregar imagem $rImg = ImageCreateFromJPEG(“ex-img.jpg”);

//Definir cor $cor = imagecolorallocate($rImg, 0, 0, 0);

//Escrever nome imagestring($rImg,5,126,22,urldecode($_GET[’nome’]),$cor);

//Header e output header(‘Content-type: image/jpeg’); imagejpeg($rImg,NULL,100);

?>


**Utilizando fontes personalizadas**

Temos a oportunidade de utilizar fontes personalizadas, Arial, Verdana, ou funções mais exóticas como Futura ou outras que não estão geralmente localizadas em qualquer sistema. Para utilizar fontes TrueType, podemos utilizar a função [imagettftext](http://br2.php.net/manual/pt_BR/function.imagettftext.php), que nos permite apontar para o arquivo .ttf da fonte que deverá ser usada, como demostrado abaixo:

```php
$font = 'arial.ttf'; imagettftext($im, 20, 0, 11, 21, $grey, $font, $text);
comments powered by Disqus

Related Posts

Optimizing code with __autoload()

Optimizing code with __autoload()

  • March 13, 2007

With the advent of PHP5 a new tool was available to all who wished to optimize their code, its called __autoload. This function can reduce the time lost by having to include object and class files in your code. But how do you proceed in creating an __autoload function to optimize code?

Read More
dmsAutoComplete versão 1.3

dmsAutoComplete versão 1.3

  • May 29, 2007

Após alguns meses de atraso devido a coisas mil (PHPDF Roadshow, BlogBlogs…) tive tempo de voltar ao meu script de autocomplete para a manutenção rotineira dele.

O primeiro passo que tomei foi re-organizar meu gerenciador de projetos pois ela havia sido “vandalizado” por robôs spammers que bagunçaram tudo, mas graças ao conceito de “history” consegui corrigir tudo.

Read More
MSN: Amigo ou Inimigo?

MSN: Amigo ou Inimigo?

  • July 14, 2006

Pesquisa rápida: Quem nunca passou pela experiência de ter o MSN bloqueado na empresa?

Read More