Mostrar imagem na página sem distorcê-la

[ebotega 2]

Pessoal, para criar miniaturas e tal estou testando uma classe bem bacana, a 'ThumbLib.inc.php' (http://phpthumb.gxdlabs.com/), porém tem um exemplo chamado 'crop_basic_fromstring.php' que mostra a imagem em um arquivo html.

 

O problema é não a imagem não aparece... Alguém sabe como corrigir isso ou poderia baixar a classe e testar... :rolleyes:

 

A intenção real de tudo isso é mostrar a imagem em uma página sem distorcê-la, ou seja, se tenho uma imagem 300x300 e preciso colocá-la em um quadro 200x100, gostaria que ela não ficasse distorcida, com a classe conseguiria redimensionar e cropar a imagem de forma que aparecesse certo.

 

Se alguém souber como fazer isso sem usar a classe seria legal...

 

 

Valeu. :thumbsup:

[Guilherme Oderdenge 42]

Você quer recortar/redimensionar a sua imagem sem utilizar uma biblioteca personalizada, é isso?

 

Se sim, utilize o GD, que é uma biblioteca nativa do próprio PHP.

 

Para recortar a sua imagem, vamos fazer o seguinte:

  $file = 'imagem.jpg'; // Sua imagem à ser recortada
  list( $original_width, $original_height ) = getimagesize( $file ); // Aqui pegaremos a largura e altura original da sua imagem

  $resized_width = 200; // Largura à ser redimensionada
  $resized_height = 100; // Altura à ser redimensionada


  $true_color = imagecreatetruecolor( $resized_width, $resized_height ); // Cria uma nova imagem true color

  $current_image = imagecreatefromjpeg( $file ); // Cria uma nova imagem do arquivo ou URL

  imagecopy( $true_color, $current_image, 0, 0, '50', '50', $original_width, $original_height ); // Copia parte de uma imagem

  imagejpeg( $true_color, $file, 100); // A nossa "mágica"

Entendeu?

 

Espero que seja isso que você queria. Funções utilizadas:

• 
  

list()
getimagesize()
imagecreatefromjpeg()
imagecreatetruecolor()
imagecopy()
imagejpg()

 

E era isso!

[ebotega 2]

Fala Guilherme, beleza...

 

Tem a ver com cortar a imagem, não conhecia GD, muito bom. O que eu procuro na verdade é mostrar a imagem direto na página, lá na tag 'img', busco uma imagem 300x300 dentro de um diretório e mostro ela na página, numa div por exemplo, de 200x100, mas cortando-a de forma que não distorça a imagem, como se eu fosse fazer um upload e gravar uma miniatura.

 

Citei a classe, pois nela tem um exemplo, exemplo que não funfa...

 

:thumbsup:

[Guilherme Oderdenge 42]

Ah, entendi.

 

Então cara, para fazer com que não distorça, você deverá ter uma miniatura recortada. Eu pelo menos não conheço outro jeito.

 

No caso, quando o usuário for upar a imagem, utilize a sua biblioteca para recortar - mantendo a imagem original e a recortada. Assim, no img, você chama a recortada.

 

Entendeu?

[Henrique Barcelos 290]

Esse "corte" de imagens que você se refere aí é com CSS, propriedade clip

[Guilherme Oderdenge 42]

Eu nunca tinha associado o clip com essa finalidade. Sempre que precisei de miniaturas, utilizei o PHP. :huh:

 

De qualquer forma, estamos aqui para aprender, hueahuehe. Mas assim, ebotega, cuida que o clip só funciona com absolute e ele mantém a sua imagem original. Ou seja, se você tem uma imagem de 1000x1000, o HTML carregará essa imagem normalmente, exibindo apenas o pedaço que você informou através do clip.

 

Em outras palavras, se a imagem for muito grande, o clip poderá ser uma pedra no caminho, porque se ela demorar para carregar em seu tamanho original, demorará para carregar a miniatura igual. ;)

[ebotega 2]

Henrique, dei uma olhada nessa propriedade e atente parcialmente o propósito, é bem isso que eu preciso, mostrar um 'pedaço' da imagem para não distorcê-la, mas como o Guilherme comentou, e comprovei em alguns testes, infelizmente surgem alguns impedimentos como ela ainda tomar o espaço todo da imagem.

 

Até pensei Guilherme em fazer uma miniatura pra isso, mas veja como está a estrutura: o cara faz upload de uma imagem, o código cria uma miniatura 70x70 e grava no diretório 'miniatura', grava outra cópia 500x500 do diretório 'zoom', cada uma com sua função, mas tenho uma página que gostaria de mostrar imagens 200x100 e pior, aleatoriamente, ou seja, cada vez que a página é carregada, uma imagem diferente é mostrada. Criar mais uma imagem 2000x100 de cada imagem upada não me parece uma solução inteligente pra isso.

 

Como falei, aquela classe tem um exemplo, mas que não funciona... :upset:

[Guilherme Oderdenge 42]

Ebotega, não posso estudar a biblioteca baseado na sua necessidade.

 

Criar mais uma imagem 2000x100 de cada imagem upada não me parece uma solução inteligente pra isso.

E por quê não?

 

Logicamente, eu não vejo outra saída. Já que clip e uma terceira miniatura não sejam a solução, o que exatamente você quer?

 

E assim, qual seria exatamente o problema que a biblioteca retorna? O "não aparecer" da imagem? É isso?

[Henrique Barcelos 290]

Dê uma olhada:

:seta: http://henriquebarcelos.in/blog/2011/10/25/manipulacao-de-imagens-com-php/

[ebotega 2]

Bem completo Henrique... excelente, mas eu já tenho duas imagens, zoom e miniatura, eu não queria mostrar outra, só mostrar na tela.

 

Hehe... pois é Guilherme, parece que é complicado mesmo... É que criar outra imagem fora o zoom e a miniatura acho que seria desperdício de recursos (espaço), mas acho que realmente não tenho muita saída, acho que terei que partir para uma nova imagem.

 

Vou dar uma estudada melhor na classe pra ver se consigo mostrar a imagem...

 

:thumbsup:

[ebotega 2]

cara... a imagem só não aparece no IE 8 ou inferior.

 

Tenho um camarada que fez um site e o cliente reclamava que uma determinada funcionalidade dava erro, depois do cara quebrar a cabeça viu que o cliente usava o IE 6 :huh: . Falou pro cara: vamos atualizar o seu navegador... aí funcionou.

 

Infelizmente não posso ignorar o fato de não funfar no IE 8, vai que o cliente e outra infinidade de usuários usem esse navegador pro resto da vida <_<

 

valeu pessoal.

[Guilherme Oderdenge 42]

Ebotega, nem a Microsoft dá suporte pra esse lixo navegador, por que você deve ser "o escolhido" e fazer isso por ela? :rolleyes:

 

E... qual solução você encontrou?

[Henrique Barcelos 290]

cara... a imagem só não aparece no IE 8 ou inferior.

Nesse caso, verifique o modo da imagem. Imagens para exibição em monitores normalmente estão no modo RGB, entretanto, o modo CMYK também é muito popular, pois é utilizado para impressos.

O IE tem um certo problema em exibir imagens CMYK.

[ebotega 2]

Pior que a imagem está tudo ok Henrique, cara... até no IE9 funciona <_< .

 

Então Guilherme, solução?!?!? Nenhuma ainda, acho que vou remodelar as miniaturas (70x70) para ficarem com uma qualidade melhor e usá-las nessas páginas, adequando a div que era 100x200 para uns 120x120 pra não ficar tão granulado, já que as miniaturas estão cortadas e não distorcidas, elas se adequarão sem problemas.

 

:thumbsup: