Publicidade (Anuncie Aqui)

Manipulando imagens no PHP

Manipulando imagens no PHP

Fala fala minha gente! Tudo na mais devida paz? :)

Hoje vou falar mais um pouquinho sobre a classe WideImage (agora na versão 9.09.04) que eu já falei um pouco no artigo Redimensionando imagens automaticamente com o PHP.

A classe WideImage te ajuda manipular imagens salvas no seu site de forma extemamente fácil e intuitiva, com ela você pode:

  • Redimensionar imagens;
  • Cropar (cortar) imagens;
  • Inserir marca d’agua na imagem;
  • Mesclar imagens;
  • Converter a imagem em escalas de cinza;
  • E muito mais…

Atenção: A classe WideImage tem alguns pré-requisitos:

  • PHP 5.2 ou superior (pode funcionar em versões anteriores, mas sem direito a suporte)
  • Extensão GD2 do PHP
  • Memória o suficiente para carregar as imagens

Carregando Imagens para a Memória

Quando você for usar a classe para manipular uma imagem você precisa, claro, carregar a imagem antes… Existem duas formas de fazer isso:

// Carrega a imagem de um arquivo
$img = WideImage::load('imagens/minha_foto.jpg');
// Carrega a imagem de um arquivo
$img = WideImage::loadFromFile('imagens/minha_foto.jpg');

Feito isso você carregou a imagem para e memória do PHP.

Redimensionando Imagens

Depois de carregada uma imagem pode ser redimensionada… Existem três tipos de redimensionamento:

  • inside – A imagem será redimensionada para caber dentro da largura e altura especificada, não distorce a imagem (tipo padrão)
  • outside – A imagem será redimensionada para preencher a largura e altura especificada, não distorce a imagem
  • fill – A imagem será redimensionada para preencher por completo a largura e altura especificada, distorce a imagem se necessário
// Redimensiona a imagem para caber em um quadrado de 200x200px
$img = $img->resize(200, 200, 'inside');

Isso fará com que a imagem seja redimensionada para caber dentro de um quadrado de 200×200 píxels… A imagem final poderá ter 200×200, 100×200 ou 200×100 pois todos esses tamanhos estão menores ou iguais a 200×200 píxels.

// Redimensiona a imagem para preencher um quadrado de 350x200px
$img = $img->resize(350, 200, 'outside');

Isso fará com que a imagem seja redimensionada para preencher um quadrado de 350×200 píxels… Se as proporcões da imagem forem maiores que essa proporção de 350×200 a imagem final será maior que o 350×200.
Suponhamos que imagem fosse um quadrado de 500×500, depois de redimensionada ela terá 350×350, pois ela está preenchendo o quadrado de 350×200 mas precisa manter a sua proporção original de 1:1… Se o tipo de redimensionamento fosse “fill” a imagem final teria sempre 350×200, mesmo que ela fosse menor antes, pois o fill distorce a imagem quando necessário.

Existe ainda um quarto parâmetro que é a “direção” do redimensionamento, os seus valores possíveis são:

  • any – A imagem será redimensionada sempre, seja ela maior ou menor que as dimensões de destino (direção padrão)
  • down – A imagem será redimensionada apenas quando ela for maior que as dimensões de destino
  • up – A imagem será redimensionada apenas quando ela for meno que as dimensões de destino

Cropando (cortando) Imagens

Você também pode cortar uma imagem carregada… O crop() é um dos métodos mais interessantes da WideImage, e usá-lo em conjunto com o método resize() é devastador…

O crop() tem quatro parâmetros: coorenada X onde o corte irá começar, coordenada Y onde o corte irá começar, largura do corte e altura do corte.

Vamos a alguns exemplos de crop:

// Corta um quadrado de 150x150px no canto superior direito da imagem
$img = $img->crop(0, 0, 150, 150);

Mas ninguém quer cortar um pedaço do canto superior direito da imagem… Geralmente precisamos fazer um corte no meio da imagem… É aí que o crop() mostra seu poder:

// Corta um quadrado de 100x80px no meio da imagem
$img = $img->crop('50% - 50', '50% - 40', 100, 80);

Veja que interessante: nos dois primeiros parâmetros usamos um posicionamento diferente… dizemos que o crop irá para a metade da imagem (50%) e voltará 50px para lagura e 40px para a altura e depois irá fazer um corte de 100×80… Genial não é? Isso fará um corte de 100×80 no meio da imagem.

E se a imagem for muito grande? Você pode acabar pegando um pedaço da imagem que não serve de nada… É aí que você aprende a usar o resize() em conjunto com o crop():

// Redimensiona a imagem para preencher uma area de 100x80
$img = $img->resize(100, 80, 'outside');
// Corta um quadrado de 100x80px no meio da imagem
$img = $img->crop('50% - 50', '50% - 40', 100, 80);

Se você gostar, também pode fazer tudo de uma vez, o que é bem mais interessante:

// Redimensiona e corta a imagem
$img = $img->resize(100, 80, 'outside')->crop('50% - 50', '50% - 40', 100, 80);

Salvando Imagens

Você já carregou sua imagem, redimensionou e cropou ela.. Agora só falta tirar ela da memória e salvar ela em um arquivo, substituindo (ou não) o anterior… E é assim que você faz isso:

// Salva a imagem em um novo arquivo
$img->saveToFile('/imagens/minha_foto_menor.jpg');

Quando a imagem for salva em JPG você também pode definir a qualidade da imagem, diminuindo assim o tamanho do arquivo:

// Salva a imagem em um novo arquivo com 80% de qualidade
$img->saveToFile('/imagens/minha_foto_menor.jpg', null, 80);

Enviando Imagens para o Navegador

Você também pode enviar imagens diretamente para o navegador, isso funciona bem quando você quer manipular uma imagem e exibí-la sem precisar salvá-la em um arquivo novo… É só tirar ela da memória e jogar para o navegador, assim:

// Define o tipo de cabeçalho para exibir a imagem corretamente
header("Content-type: image/jpeg");

// Envia a imagem para o navegador com 80% de qualidade
$img->asString('jpg', 80);

Outros Exemplos

Veja aqui um exemplo onde carregamos uma imagem do HD, redimensionamos, cropamos e salvamos no mesmo local, substituindo a anterior:

$arquivo = '/imagens/fotos/tiutalk.jpg';

// Carrega a imagem
$img = WideImage::load($arquivo);

// Redimensiona a imagem para um quadrado de 100x100
$img = $img->resize(100, 100, 'outside');

// Corta um quadrado de 100x100 no centro da imagem
$img = $img->crop('50% - 50', '50% - 50', 100, 100);

// Salva a imagem substituindo a antiga
$img->saveToFile($arquivo);

// Limpa a imagem da memória
$img->destroy();

E veja uma versão onde fazemos isso tudo numa linha:

$arquivo = '/imagens/fotos/tiutalk.jpg';

WideImage::load($arquivo)->resize(100, 100, 'outside')->crop('50% - 50', '50% - 50', 100, 100)->saveToFile($arquivo)->destroy();

E aí? Gostaram? :)

Você também vai gostar de ler:

Postado em Destaques, PHP, Tutoriais

Com as tags , , , , , , , , , , , , , , , , , , ,

Escrito por Thiago Belem

Gostou desse artigo?

Não se esqueça de assinar o RSS e divulgue-o para o mundo:

17 Comentários ou trackbacks

  1. Alexandre disse:

    show esse tutorial tava precisando algo parecido tipo posso usar isso para redimencionar imagem antes de enviar para o BD ? por formulario? vlw

  2. Muito bom cara o artigo… PARABENS!!!

    so corrige uma coisa, pra mostrar a imagem no navegador nao é o metodos asString

    $img->asString(‘jpg’, 80);// errado

    e sim usando o metodo output

    $img->output(‘jpg’, 80);// certo

    mas muito bom essa class, eu nao conhecia… dei uma linda no artigo e fui procurar a documentaçao no site… realmente uma excelente class…

    nos poupa muito trabalho!

    abraço!!!

  3. gasper_k disse:

    Hi, just wanted to let you know I’ve just released the next version, which also supports alignment coordinates, such as:
    $cropped = $image->crop(‘center’, ‘bottom’, 150, 100);

    Also, the liibrary supports outputting the image directly to the browser, and adds Content-type and Content-length headers automatically:
    $image->output(‘gif’);

    See the release notes:
    http://wideimage.sourceforge.net/2010/02/wideimage-10-02-08-released/

    Best regards and thanks for the article,
    Gasper

  4. Zucolli disse:

    Thiago, a imagem a ser manipulada pode ser EPS em CMYK?

    Obrigado!

  5. Zucolli disse:

    Olá Thiago…

    Muito legal!
    Vou tentar usar no meu projeto.

    Obrigado!

  6. rafael pinese disse:

    ótimo artigo thiago, parabéns !

  7. Fabio Nobre disse:

    Muito bom Thiago. Já fazia o resize com a biblioteca GD do PHP, mas com esse manipulador a coisa fica mais organizada. E se tivesse descoberto antes, teria economizado mais tempo… Existem tantas ferramentas na Web, se duvidar é só juntar os pedaços e sair criando.. hehe

    Muito bom seu site, e com exelentes dicas. Parabéns.

  8. ExplodeGame disse:

    BEm interessante, tava procurando algo parecido.

    []´s

  9. Gabriel Lau disse:

    O WhideImage é bem interessante mesmo. Eu já conhecia ele, e usava-o até certo tempo atrás… quando conheci esse script aqui: Verot.

    Eu achei esse script do Verot muito mais fácil de trabalhar e com muito mais opções de manipulação das imagens… e dá até pra fazer upload de arquivos alheios como: arquivos de áudio, ou documetos .PDF ou do word;

    Agora tem uma coisa que eu não estou conseguindo nem com o Wideimage, nem com o Verot: Redimensionar imagens em tempo de execução, ou seja, ná propria página HTML ou PHP, sem ter que salvar essa imagem em algum diretório.

  10. Jhony disse:

    Otemo artigo!!! poderia mostrar um sistema de noticias completo em OO

  11. Jhony disse:

    Otemo artigo!!!!!!!!!!! vc podia mostrar como fazer um sistema de noticia completo em OO

  12. Rodrigo Pires disse:

    Gostei muito… Teria como ensinar fazer o crop e o resize com o jquery junto com o php…

    Visito seu blog todo dia procurando novidades e te sigo no twitter…
    Aprendi muito aqui…

  13. Bem interessante esta classe e as explicações.
    Eu desenvolvi minhas proprias funções que fazem isso.
    Parabens pelo artigo.

Deixe um comentário

XHTML: Você pode usar essas tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Atenção: O seu comentário precisará ser aprovado antes de ser publicado

Trackbacks e Pings