Efeito de explosão para imagens em Java ME

Comments

(no comments yet)

Log in or Join to leave comments.

Dados do artigo

---

Exemplo de código

Código fonte: Media:J2me_image_explode_effect.zip

---

Artigo

Tradução:

Originado de Explode effect for Java ME Images

Por maiconherverton

Última alteração feita por hamishwillee em 08 Dec 2011

Introdução

A classe ExplodingImage pode ser usada para adicionar um efeito de "explosão" em imagens J2ME.

Você pode ver o efeito em ação aqui: Imagem em J2ME efeito de explosão em ação.

Código fonte: Classe ExplodingImage

Vamos começar com a nossa classe!

import javax.microedition.lcdui.Graphics;
import javax.microedition.lcdui.Image;
 
public class ExplodingImage
{
}

Começamos definindo algumas propriedades úteis:

//força do efeito
public static final int DEFAULT_LEVEL = 7;
public int level = 7;
 
//peças horizontal e vertical da imagem explodida
public int vPieces = 4;
public int hPieces = 8;
 
//A instância da imagem
Image image = null;
 
//Propriedades da imagem
int imageWidth = 0;
int imageHeight = 0;
 
//tempo do efeito, duração e início
long duration = 0;
long startTime = 0;
 
//Estado das propriedades do efeito
public boolean exploding = false;
public boolean ended = false;

Agora podemos definir o construtor da classe ExplodingImage, que vai aceitar os seguintes argumentos:

• uma instância de uma Imagem
• um nível que indica a intensidade do efeito
• 2 int indicando a horizontal e a vertical da imagem que explodiu

public ExplodingImage(Image image, int level, int hPieces, int vPieces)
{
	this.level = level;
	this.hPieces = hPieces;
	this.vPieces = vPieces;
 
	this.image = image;
 
	this.imageWidth = image.getWidth();
	this.imageHeight = image.getHeight();
}

Agora, vamos definir o método explode, que será usado para iniciar o efeito

public void explode(long duration)
{
	this.duration = duration;
	this.startTime = System.currentTimeMillis();
 
	ended = false;
	exploding = true;
}

Finalmente, estamos prontos para desenhar a nossa imagem!

public void paint(Graphics g, int x, int y, int constraints)
{
	// se a imagem explodiu não pintá-la
	if(ended)
	{
		return;
	}
 
	if(!exploding)
	{
		g.drawImage(image, x, y, constraints);
	}
	else
	{
		//cache anterior da propriedade clipping
		int cx, cy, cw, ch;
 
		cx = g.getClipX();
		cy = g.getClipY();
		cw = g.getClipWidth();
		ch = g.getClipHeight();
 
		//Agora devemos normalizar as coordenadas de acordo com as restrições Gráficas
		int translateX = (constraints & Graphics.RIGHT) > 0 ? x - imageWidth :
				((constraints & Graphics.HCENTER) > 0 ? x - imageWidth / 2 :
					x);
		int translateY = (constraints & Graphics.BOTTOM) > 0 ? y - imageHeight :
				((constraints & Graphics.VCENTER) > 0 ? y - imageHeight / 2 :
					y);
 
		g.translate(translateX, translateY);
 
		//Agora vamos buscar se muito tempo se passou desde o início
		long timeDiff = System.currentTimeMillis() - startTime;
 
		//e se o efeito terminou
		if(timeDiff > duration)
		{
		timeDiff = duration;
 
			ended = true;
 
			exploding = false;
		}
 
		//e vamos pintar as peças únicas!			
		int perc = (int)(100 * timeDiff / duration);
 
		int pieceEndX = 0;
		int pieceEndY = 0;
		int pieceX = 0;
		int pieceY = 0;
		int pieceWidth = imageWidth / hPieces;
		int pieceHeight = imageHeight / vPieces;
 
		int centerX = (imageWidth - pieceWidth) / 2;
		int centerY = (imageHeight - pieceHeight) / 2;
 
		for(int i = 0; i < hPieces; i++)
		{
			for(int j = 0; j < vPieces; j++)
			{
				pieceEndX = i * pieceWidth + (i * pieceWidth - centerX) * level;
				pieceEndY = j * pieceHeight + (j * pieceHeight - centerY) * level;
 
				pieceX = i * pieceWidth + (pieceEndX - i * pieceWidth) * perc / 100;
				pieceY = j * pieceHeight + (pieceEndY - j * pieceHeight) * perc / 100;
 
				g.setClip(pieceX, pieceY, pieceWidth, pieceHeight);
 
				g.drawImage(image, pieceX - i * pieceWidth, pieceY - j * pieceHeight, Graphics.TOP | Graphics.LEFT);
			}
		}
 
		//Vamos traduzir para anterior e restaurar o clipping anterior
		g.translate(- translateX, - translateY);
 
		g.setClip(cx, cy, cw, ch);
	}
}

Código fonte: o uso da amostra

Você pode começar a instanciar um ExplodingImage desta forma:

Image sourceImage = Image.createImage("/image.png");
 
ExplodingImage image = new ExplodingImage(sourceImage, 5, 8, 8);

Then start exploding with the explode() method:

image.explode(2000L);

And paint it with its paint() method:

image.paint(g, 50, 50, Graphics.HCENTER | Graphics.VCENTER);

E, finalmente, para verificar se o efeito de explodir terminou, você pode verificar as propriedades ended:

if(image.ended)
{
	//fim do efeito
}

Download

Você pode baixar o código fonte completo, juntamente com uma classe ExplodingImage usando Canvas, : [[Media:J2me_image_explode_effect.zip|Image| aqui ]