PHP + GD = Desenhando com PHP

19 02 2007
Bom pessoal, faz algum tempinho que estou sem escrever nada, por falta de
tempo/idéias, mas nesse momento estou sem sono, e tive uma ideia para escrever
algo, então aqui estou.
Vou falar um pouco sobre PHP e GD, e demonstrar como fazer desenhos simples
usando essa extensão do PHP.
Inicialmente você precisa ter o GD compilado e instalado em sua máquina, e
precisa compilar o php com suporte a ele, usando o parametro '--with-gd' na
linha do seu './configure'.
Para averiguar se tudo funcionou corretamente, rode o seguinte comando:

$ php -m |grep gd
gd

    
Se aparecer a palavra gd para você, está tudo correto, e podemos seguir em
frente.
Quando o ambiente está pronto para se trabalhar com GD, o primeiro passo a se
tomar, é criar uma imagem, que servirá de base para trabalharmos. De maneira a
facilitar e agilizar as coisas, irei dar um exemplo, com algumas linhas de
código e explicar o que acontece:

<?php

    // É necessário especificar o header, para informar que se trata de uma
    // imagem
    header('Content-type: image/png');

    $imagem = imagecreatetruecolor( 640, 480 );
    $vermelho = imagecolorallocate( $imagem, 255, 0, 0 );
    imagefilledrectangle( $imagem, 0, 0, 640, 480, $vermelho );

    imagepng( $imagem );
?>

Esse código, irá criar um grande retangulo vermelho.
A nossa imagem é criada na chamada da função imagecreatetruecolor, que
cria uma imagem, e retorna um resource para a mesma. Praticamente todas as
funções (se não todas) que utilizamos com GD a partir disso, farão uso desse
resource. A partir daqui, o que nos resta a fazer é desenhar a nossa imagem.
Praticamente tudo o que desenhamos na imagem utiliza cor, então para isso,
precisamos criar um resource de cor, que será utilizado pelas funções que
desenham coisas propriamente ditas. A função imagecolorallocate toma 4
parametros que lhe permitem criar uma cor. O primeiro define a imagem para qual
essa cor deve ser alocada, os seguintes definem a intensidade de vermelho, verde
e azul (RGB). Logo na sequência desenhamos um retangulo vemelho do tamanho da
imagem, utilizando a função imagefilledrectangle, que toma 6 parametros,
que definem qual a imagem em que o retangulo deve ser desenhado, qual o ponto X
inicial, o ponto Y inicial, o ponto X final, o ponto Y final e a cor do
retangulo. A função imagepng renderiza nossa imagem, e a exibe na tela.
É importante saber que o eixo de cordenadas, começa no canto superior esquerdo
da tela, ou seja, a posicão X=0, Y=0 se encontra no canto superior esquerdo de
nossa imagem. Isso pode confundir um pouco no início, mas com o passar do tempo,
a gente vai pegando o jeito.
Os desenhos, vão sendo feitos na imagem, de acordo com a sequencia em que as
chamadas para as funções são feitas, logo se eu adicionasse uma nova função no
nosso código acima para desenhar um retangulo azul, por cima do vermelho, nós
veriamos apenas o retangulo azul, e não o vermelho.
Vejamos então, algumas funções que podemos utilizar com GD, para desenharmos
coisas na nossa imagem:
    imagerectangle( resource $imagem, int $x0, int $y0, int $x1, int $y1, int
$cor )
        Desenha um retangulo na tela, sem preenchimento. Lembrando que um
quadrado nada mais é que um retangulo de lados iguais.
    imageellipse( resource $imagem, int $cx, int $cy, int $largura, int
$altura, int $cor )
        Desenha uma elipse na tela, também sem preenchimento. A elipse terá o
seu centro definido na posição $cx;$cy, terá $largura de largura e $altura de
altura. Vale lembrar também que um círculo é uma elipse que tem a mesma largura
e altura. $cor, é a cor que criamos usando imagecolorallocate.
    imagestring( resource $imagem, int $font, int $x, int $y, string $s, int
$cor )
        Desenha uma string na imagem, que começa na posição $x,$y. Se fonte for
definido como um numero entre 1 e 5, uma fonte interna do PHP é usada. $sé a
string que desejamos desenhar, e $cor, é a cor que a nossa string deverá ter.
    imagesetpixel( resource $imagem, int $x, int $y, int $cor )]
        Desenha um pixel na posição $x, $y com a cor $color.
Conhecendo essas funções já podemos fazer algumas várias coisinhas. Vejamos
abaixo então um código de exemplo, que mostra a utilização dessas funções e de
mais algumas, que deixará tudo bem claro.

<?php

    // É necessário especificar o header, para informar que se trata de uma
    // imagem
    header('Content-type: image/png');

    $imagem = imagecreatetruecolor( 640, 480 );

    // Criar algumas cores
    $vermelho = imagecolorallocate( $imagem, 255, 0, 0 );
    $verde    = imagecolorallocate( $imagem, 0, 255, 0 );
    $azul     = imagecolorallocate( $imagem, 0, 0, 255 );
    $preto    = imagecolorallocate( $imagem, 0, 0, 0 );
    $branco   = imagecolorallocate( $imagem, 255, 255, 255 );

    // Desenhar um retangulo vermelho
    imagerectangle( $imagem, 10, 100, 250, 150, $vermelho );

    // Escrever dentro do retangulo
    imagestring( $imagem, 3, 11, 120, 'Sou um retangulo sem preenchimento', $branco );

    // Desenhar um circulo azul
    imageellipse( $imagem, 100, 300, 100, 100, $azul );

    // Desenhar um quadrado verde preenchido dentro do circulo
    imagefilledrectangle( $imagem, 75, 275, 125, 325, $verde );

    // Desenhar uma linha de pixels coloridos, na vertical
    for( $i = 0; $i < 200; $i++ ) {
        imagesetpixel( $imagem, 300, $i, imagecolorallocate( $imagem, rand(0,255),rand(0,255),rand(0,255) ) );
    }

    // Desenhar um circulo preenchido verde
    imagefilledellipse( $imagem, 400, 300, 100, 100, $verde );

    imagepng($imagem);

?>

Bem, temos uma imagem com alguns desenhos, porém uma coisa ainda incomoda, e
essa coisa é a cor de fundo. Como mudar a cor de fundo? Basta usar a função
imagefill, que preenche uma determinada area com a cor especificada.
Podemos utilizar essa função para pintarmos apenas a parte interna do nosso
retangulo ou circulo que nao tem preenchimento. Vamos então a um ultimo exemplo
que usa essa função.

<?php

    // É necessário especificar o header, para informar que se trata de uma
    // imagem
    header('Content-type: image/png');

    $imagem = imagecreatetruecolor( 640, 480 );

    // Criar algumas cores
    $vermelho = imagecolorallocate( $imagem, 255, 0, 0 );
    $verde    = imagecolorallocate( $imagem, 0, 255, 0 );
    $azul     = imagecolorallocate( $imagem, 0, 0, 255 );
    $preto    = imagecolorallocate( $imagem, 0, 0, 0 );
    $branco   = imagecolorallocate( $imagem, 255, 255, 255 );

    // pintar o fundo de branco
    imagefill( $imagem, 0, 0, $branco );

    // Desenhar um retangulo vermelho
    imagerectangle( $imagem, 10, 100, 250, 150, $vermelho );

    // Pintar o retangulo de azul
    // 11 e 101, é uma posição dentro do retangulo
    imagefill( $imagem, 11, 101, $azul );

    imagepng($imagem);

?>

Temos ai então uma imagem branca, com um retangulo azul de borda vermelha.
Estamos sempre usando a função imagepng, mas existem outras, para criar a
imagem nos formatos gif e jpg por exemplo, sendo elas:
    imagejpeg
    imagegif

Bom, por hoje é isso. Espero que esse texto possa ter dado uma breve introdução
a extensão GD, e possa te ajudar com alguns problemas, como criação de captchas,
gráficos, e qualquer outra coisa mais que lhe possa ser util (Eu tinha umas
outras ideias, mas sao 3 da manha, e eu ralmente esqueci).
Para maiores informações e mais funções, consulte:
http://php.net/gd

[]s
Anúncios

Ações

Information

4 responses

22 10 2007
Ricardo Berti

Muito bom, resumiu o básico da GD!

Parabéns

25 07 2008
Alexandre

Justamente o que estava procurando, uma introdução rápida e com alguns exemplos simples da utilização GD.

Obrigado.

19 03 2009
ikky

boa

21 04 2009
Jerusa

Ola, você poderia especificar melhor a forma de instalação e compilação da gd para a utilização… pois realizei as seguintes alterações: no arquivo php.ini descomentei a linha da dll… e ao consultar o pfpinfo não apresenta que a gd tenha sido habilitada… o que eu faço, preciso fazer uma tela com imagens mas não consigo configurar, vc poderia me ajudar ?
obrigada

Deixe um comentário

Preencha os seus dados abaixo ou clique em um ícone para log in:

Logotipo do WordPress.com

Você está comentando utilizando sua conta WordPress.com. Sair / Alterar )

Imagem do Twitter

Você está comentando utilizando sua conta Twitter. Sair / Alterar )

Foto do Facebook

Você está comentando utilizando sua conta Facebook. Sair / Alterar )

Foto do Google+

Você está comentando utilizando sua conta Google+. Sair / Alterar )

Conectando a %s




%d blogueiros gostam disto: