Tag Archives: códigos

Manipulação de imagens no PHP com a lib GD – Colagem de fotos

Em mais um post sobre manipulação de imagens usando a lib GD no PHP, veremos como é possível fazer sobreposição de imagens, resultando em uma espécie de colagem de fotos.

Primeiro Exemplo – Mural Warhol

Nesse primeiro exemplo vamos repetir a mesma foto em versões diferentes, aplicando filtro de cor para um resultado que lembra o estilo de Andy Warhol.

<?php
header("Content-type: image/jpeg");

$source = "foto_exemplos.jpg";

$tamanho = getimagesize($source);

$wi = $tamanho[0];
$he = $tamanho[1];

/* numero de colunas e linhas da montagem nXn, altere para modificar o n. de colagens */
$c = 2;
$l = 2;
$result = imagecreatetruecolor($wi*$c, $he*$l);

for($i=0;$i<$l;$i++)
{
	for($j=0;$j<$c;$j++)
	{
		$source = imagecreatefromjpeg("foto_exemplos.jpg");
		imagefilter($source, IMG_FILTER_COLORIZE, rand(0,255), rand(0,255), rand(0,255),40);
		imagecopyresampled($result, $source, $j*$wi, $i*$he, 0, 0, $wi, $he, $wi, $he);

	}

}

imagejpeg($result);

?>

O resultado será sempre diferente, pois os valores passados à função imagefilter são randômicos. Cada vez que você der reload no script ele irá gerar diferentes combinações de cores. Aqui está um exemplo de resultado:

Segundo Exemplo – Foto com Colagens / Moldura

Nesse exemplo você verá como é fácil colar imagens png com transparências em cima de uma foto. Vou colar um png de um passarinho no canto esquerdo superior, e depois uma árvore no canto direito inferior.

<?php
header("Content-type: image/jpeg");

$result = imagecreatefromjpeg("foto_exemplos.jpg");

$bird = imagecreatefrompng("bird.png");
imagecopyresampled($result, $bird, 0, 0, 0, 0, imagesx($bird), imagesy($bird),  imagesx($bird), imagesy($bird));

$tree = imagecreatefrompng("tree.png");
imagecopyresampled($result, $tree, imagesx($result)-imagesx($tree), imagesy($result)-imagesy($tree), 0, 0, imagesx($tree), imagesy($tree),  imagesx($tree), imagesy($tree));

imagejpeg($result);

?>

Resultado:

Seguindo esse mesmo princípio, é possível colar molduras e criar montagens bem interessantes. No exemplo abaixo, usando uma moldura com o mesmo tamanho da foto (o código é quase igual, colando a moldura na posição 0,0 da foto):

<?php
header("Content-type: image/jpeg");

$result = imagecreatefromjpeg("foto_exemplos.jpg");

$moldura = imagecreatefrompng("moldura.png");
imagecopyresampled($result, $moldura, 0, 0, 0, 0, imagesx($moldura), imagesy($moldura),  imagesx($moldura), imagesy($moldura));

imagejpeg($result);
?>

Resultado:

Como você pode ver, a aplicação de pngs e colagem de fotos é muito simples. O que dificulta mais o trabalho com esses métodos é o posicionamento e tamanho das imagens. Geralmente, você precisará utilizar algum esquema mais elaborado com javascript para definir a posição certa aonde colar as imagens, caso faça algo totalmente dinâmico. Redimensionamento também pode ser extremamente necessário.

Para maiores informações sobre a GD e referência das funções utilizadas aqui, verifique : http://www.php.net/manual/en/ref.image.php

Montando um site php com autenticação baseada em Twitter+OAuth e persistência

Neste artigo você verá como é possível criar um site em php com autenticação de usuários toda baseada no Twitter, usando a biblioteca Twittertools que desenvolvi.

Antes de começar, vamos ter uma idéia mais detalhada de como é feita a autenticação do usuário pelo Twitter através do seu site, que nesse fluxograma chamarei de APP:

  1. Usuário acessa APP. APP identifica que ele não está logado;
  2. APP faz uma requisição ao Twitter, identificando-se (com suas chaves consumer_key e consumer_key_secret )  os tokens de acesso (request_token e request_token_secret);
  3. APP faz nova requisição ao Twitter, identificando-se com suas chaves e passando o request_token, pedindo o link de autorização para o usuário; guarda o request_token_secret na sessão;
  4. Twitter retorna o link que APP deve passar para o usuário autorizá-la;
  5. Usuário acessa o link e autoriza APP;
  6. Usuário é redirecionado de volta para APP trazendo o request_token;
  7. APP recebe o request_token e faz uma nova requisição ao Twitter, informando o request_token e o request_token_secret, e solicitando o access_token e access_token_secret do usuário;
  8. Twitter responde com access_token e access_token_secret do usuário, e APP agora pode realizar qualquer requisição usando estas chaves.

As chaves consumer_key e consumer_key_secret devem ser obtidas ao registrar a sua aplicação no Twitter. Instruções detalhadas de como fazer isso podem ser encontradas aqui: http://erikafocke.com.br/twittertools . Uma vez com estas chaves, já é possível “começar a brincadeira”.

Download da biblioteca Twittertools: http://github.com/erikaheidi/Twittertools

No nosso exemplo, criaremos uma “mini” rede de usuários que serão listados na página principal. Veja a demonstração funcionando aqui: http://erikafocke.com.br/demos/happyelephant

Precisaremos criar uma tabela de usuários, para reconhecermos quando eles retornarem ao site. Guardaremos o id to usuário no Twitter, que será a nossa chave primária, e as chaves. A idéia de guardar as chaves é funcional para o caso de você realizar operações com a conta do usuário mesmo quando ele não estiver logado no seu site, ou quando você já possui um outro sistema de autenticação e quer apenas integrar o Twitter ao seu site, possibilitando que as pessoas façam login como de costume e possam postar atualizações no Twitter sem precisar repetir esse processo de autorização da aplicação.

A tabela básica para o nosso exemplo é a seguinte:

CREATE TABLE IF NOT EXISTS `tw_users` (
  `tw_id` int(11) NOT NULL,
  `access_token` varchar(200) NOT NULL,
  `access_token_secret` varchar(200) NOT NULL,
  `last_seen` datetime NOT NULL,
  PRIMARY KEY  (`tw_id`)
) ENGINE=MyISAM DEFAULT CHARSET=latin1;

Além das classes da TwitterTools, criei também uma classe de usuário, que irá salvar os dados em banco e atualizar a data/hora em que o usuário acessa o site, para sabermos quando foi a última vez que ele acessou. Essa classe também lista os usuários que já se “cadastraram” no site.

<?php

class User {

	var $tw_id;
	var $atoken;
	var $atoken_secret;
	var $last_seen;

	var $new;
	static $table = "tw_users";

	function __construct($tw_id,$atoken,$atoken_secret)
	{
		$this->tw_id = $tw_id;
		$this->atoken = $atoken;
		$this->atoken_secret = $atoken_secret;

	}

	function update()
	{
		$date = date("Y-m-d H:i:s");

		$query = mysql_query("SELECT last_seen FROM " . self::$table . " WHERE tw_id='$this->tw_id' ") or die(mysql_error());
		if(mysql_num_rows($query))
		{
			$this->last_seen = mysql_result($query,0);
			$upd = mysql_query("UPDATE " . self::$table . " SET last_seen='$date' WHERE tw_id='$this->tw_id' ") or die(mysql_error());
		}
		else
		{
			$this->new = 1;
			$ins = mysql_query("INSERT INTO " . self::$table . "(tw_id,access_token,access_token_secret,last_seen) VALUES('$this->tw_id','$this->atoken','$this->atoken_secret','$date') ") or die(mysq_error());
		}
	}

	static function getUsers($limit=30)
	{
		$query = mysql_query("SELECT tw_id FROM " . self::$table . " ORDER BY last_seen LIMIT $limit") or die(mysql_error());

		while($x = mysql_fetch_array($query))
		{
			if(empty($lista_users))
				$lista_users = $x['tw_id'];
			else
				$lista_users .= ",".$x['tw_id'];
		}
		return $lista_users;
	}

}
?>

No arquivo index.php você vai ver as coisas “funcionarem”. Não vou colar aqui pra não ficar grande demais o post! Vale mais a pena fazer o download :)

Você pode fazer download da pasta com todo o código completo desse exemplo aqui: happyelephant.zip

Dúvidas? Deixe um comentário :) Gostou? Comente também, aproveite e dê um retweet :P

Manipulação de imagens no PHP com a lib GD – gerar thumbnails

Continuando a série de posts sobre manipulação de imagens no PHP, dessa vez vamos trabalhar com outra funcionalidade muito comum e extremamente útil da GD: redimensionamento de imagens.

Ao se trabalhar com imagens enviadas pelo usuário através de um formulário, precisamos estabelecer limites de tamanho para que a imagem se enquadre ao nosso layout de site, além de evitar transtornos com o espaço em disco ocupado por imagens excessivamente grandes.

Para gerar um resultado fiel à imagem original, precisamos realizar um cálculo proporcional para definir o novo tamanho da imagem, baseado nos tamanhos máximos que iremos definir como limites.

O algoritmo é simples: passamos a largura e altura máximos, pegamos a largura e altura atuais da imagem. Caso ultrapassem os tamanhos máximos, iremos calcular usando regra de três quais serão os novos tamanhos da imagem (não podemos simplesmente definir que a imagem terá a largura e altura máximos definidos, pois isso poderá deixá-la com aspecto esticado em muitos casos). Após definir os novos tamanhos, criamos uma imagem em branco com o tamanho definido, copiamos a imagem original para dentro dessa nova imagem e salvamos o resultado.

Vamos ver como isso funciona na prática, usando a GD:

<?php
header("Content-type: image/jpeg");

$larguraMax = 200;
$alturaMax = 100;
$source = "foto_exemplos.jpg";

$tamanho = getimagesize($source);

$wi = $largura = $tamanho[0];
$he = $altura = $tamanho[1];

/* se for formato 'paisagem' */
if($largura > $larguraMax)
{
	$largura = $larguraMax;
	$altura = ($largura * $tamanho[1]) / $tamanho[0];
}
/* pode acontecer que mesmo depois do redimensionamento inicial baseado na LARGURA, a imagem continue
 * com a ALTURA maior que a permitida. por isso não usamos else aqui, e fazemos a checagem contraria.
 */
if($altura > $alturaMax)
{
	$altura = $alturaMax;
	$largura = ($tamanho[0] * $altura) / $tamanho[1];

	/* pode acontecer que mesmo depois do redimensionamento inicial baseado na ALTURA, a imagem continue
	 * com a LARGURA maior que a permitida. por isso não usamos else aqui, e fazemos a checagem contraria.
	 */
	if($largura > $larguraMax)
	{
		$largura = $larguraMax;
		$altura = ($largura * $tamanho[1]) / $tamanho[0];
	}
}

$thumb = imagecreatetruecolor($largura, $altura);
$imagem_orig = imagecreatefromjpeg($source);

/* argumentos da imagecopyresampled / imagecopyresized :
 * imagem destino, imagem origem, coordX destino, coordY destino, coordX origem, coordY origem,
 * largura destino, altura destino, largura origem, altura origem
 */
imagecopyresampled($thumb, $imagem_orig, 0, 0, 0, 0, $largura, $altura, $wi, $he);
/*
 * para salvar em disco, acrescente à imagejpeg os parâmetros: nome do arquivo e qualidade da imagem.
 * assim:	imagejpeg($thumb, "resultado.jpg", 100);
 * qdo você não define os dois parâmetros finais, o script joga a saída para STDOUT = browser
 */
imagejpeg($thumb);
?>

Veja o resultado após a execução do script. A imagem original de 300×300 foi redimensionada para 100×100, mantendo o aspecto e a proporção.

imagem original (300x300)

redimensionada = 100x100


Manipulação de imagens no PHP com a lib GD – efeitos

A manipulação/geração de imagens no PHP é um recurso muito útil e versátil, que pode ser usado tanto para operações comuns como o redimensionamento / corte de imagens, quanto para  operações mais complexas, como a criação de montagens, gifs animados e tratamento de fotos.

A biblioteca GD é a mais utilizada no php para essas operações, por já estar presente na maioria das instalações padrão de servidores por aí afora. Ela oferece muitos recursos interessantes, e apesar de ter limitações, serve para todas as operações básicas de manipulação de imagem: corte, redimensionamento, colagem, escrita com fontes true type, efeitos básicos para fotos, e geração de imagens diretamente para o browser (um arquivo .php se “transforma” em um jpg).

Para maiores informações e referência das funções da GD, acesse: http://www.php.net/manual/en/ref.image.php

Neste artigo você verá exemplos de utilização da GD para aplicar efeitos em fotos. Nos exemplos, utilizei a imagem “foto_exemplos.jpg”, no mesmo diretório do script, e joguei a saída diretamente para o browser, não salvando as alterações na imagem.

Brilho

No exemplo abaixo, aumentei o brilho da imagem em “50″. Para diminuir o brilho, basta passar um número negativo.

Brilho +50

<?php
$img = imagecreatefromjpeg("foto_exemplos.jpg");

if($img && imagefilter($img, IMG_FILTER_BRIGHTNESS, 50))
{
	header("Content-type: image/jpg");
	imagejpeg($img);
}
else
{
    echo "Ocorreu um erro.";
}

imagedestroy($img);

?>

Contraste

contraste -50

O contraste funciona de maneira similar ao brilho, porém para aumentar o contraste é que você passa um número negativo. Um número positivo irá diminuir o contraste.

<?php
$img = imagecreatefromjpeg("foto_exemplos.jpg");

if($img && imagefilter($img, IMG_FILTER_CONTRAST, -50))
{
	header("Content-type: image/jpg");
	imagejpeg($img);
}
else
{
    echo "Ocorreu um erro.";
}

imagedestroy($img);

?>

Filtro de Cor

O filtro COLORIZE permite a você aplicar um filtro de cor na imagem, passando os argumentos que definem a cor: R G B (red, green, blue), e mais um argumento opcional que define a transparência do filtro – de 0 a 127, onde 0 (o padrão) seria totalmente opaco e 127 totalmente transparente – que não fará diferença no resultado da imagem. No exemplo abaixo, usei 100% de verde e nenhuma transparência (R=0,G=255,B=0)

colorize

<?php
$img = imagecreatefromjpeg("foto_exemplos.jpg");

if($img && imagefilter($img, IMG_FILTER_COLORIZE, 0, 255, 0))
{
	header("Content-type: image/jpg");
	imagejpeg($img);
}
else
{
    echo "Ocorreu um erro.";
}

imagedestroy($img);

?>

No exemplo abaixo, defini a transparência para 100, acrescentando “100″ na lista dos argumentos.

colorize green c/ alpha=100

Preto e Branco

preto e branco

<?php
$img = imagecreatefromjpeg("foto_exemplos.jpg");

if($img && imagefilter($img, IMG_FILTER_GRAYSCALE))
{
	header("Content-type: image/jpg");
	imagejpeg($img);
}
else
{
    echo "Ocorreu um erro.";
}

imagedestroy($img);

?>

Sépia

Para atingirmos o efeito de “Sepia”, aplicamos dois filtros. Primeiro deixamos a imagem preto e branco, depois aplicamos um ‘colorize’ no tom de sépia (amarelado).

sepia tone

<?php
$img = imagecreatefromjpeg("foto_exemplos.jpg");

if($img && imagefilter($img, IMG_FILTER_GRAYSCALE))
{
	imagefilter($img, IMG_FILTER_COLORIZE, 90, 60, 40);
	header("Content-type: image/jpg");
	imagejpeg($img);
}
else
{
    echo "Ocorreu um erro.";
}

imagedestroy($img);

?>

Negativo

negativo

<?php
$img = imagecreatefromjpeg("foto_exemplos.jpg");

if($img && imagefilter($img, IMG_FILTER_NEGATE))
{
	header("Content-type: image/jpg");
	imagejpeg($img);
}
else
{
    echo "Ocorreu um erro.";
}

imagedestroy($img);

?>

Classe FlickR Simples

Esta classe é a mesma que utilizo aqui no site para exibir minhas fotos recentes do FlickR.

Você pode testar o funcionamento da classe aqui: http://www.erikafocke.com.br/demos/simpleflickr/

Exemplo de Utilização:

<?php
require_once("FlickR.php");
$username = "erikaheidi";

$fl = new FlickR();
$fl->getPhotos($username,10);

print_r($fl->fotos);

?>

O arquivo da classe está disponível para download aqui num zip (no final do post tem o link). Nesse zip tem a classe e um arquivinho .php de exemplo, pra mostrar como você vai usar, igual ao live demo.

Se tiver dúvidas, deixe um comentário!

Obs: Para que a classe funcione do jeito que está, o seu servidor precisa suportar a opção de abrir arquivos remotos com a função file_get_contents .

Download:  simpleflickr.zip