Tutorial de como fazer função Zoom[Resolvido]

Ajuda aí gente, fazendo favor!!!

Você tem uma imagem na web, quando o usuário clicar na imagem com a função de zoom in/out, será verificado o ponto X e Y da onde o usuário clicou.
Apartir desses dois pontos, de alguma maneira se pega essa imagem nesse ponto e redesenha ela maior ou menor.

Seria algo desse tipo? Será que alguem poderia me responder se ta certo isso?
E se tiver alguém tem como me dar uma luz de como fazer isso.

Eu consigo pegar o ponto x e y da onde eu cliquei na imagem. O que eu nao to conseguindo é imaginar como eu vou redesenhar a imagem naquele ponto aumentando ou diminuindo o tamanho dela.

Aguardo uma resposta.

Voce tem o AffineTransform da classe Graphics2D para fazer isso.

Ou então simplesmente recortar o Graphics e desenhar em uma area maior ou entao pegar tudo e desenhar em uma area menor. Mas desse jeito voce vai ter muita perda de qualidade.

Mark_Ameba, to tentando usar o AffineTransform aqui.
Já vi que com ele consigo mudar a escala, o que faz ele aproximar a imagem.
Mas é nessa escala que eu devo colocar o X e Y do clique do mouse?
E como usar um AffineTransform com uma BufferedImage?

Geralmente, basta setar o AffineTransform antes de começar o desenho na sua tela e pronto. Tudo fica com zoom.

Mesmo eu usando uma imagem que ta no meu computador???

Dá uma olhada no meu código e me fala qq eu tenho que fazer pq não to conseguindo meesmo…
Já to a quase 3 semanas empacado nesse zoom e não me desce que isso seja tão complicado.

package br.com.classesTestes;

import java.awt.BorderLayout;
import java.awt.Graphics2D;
import java.awt.RenderingHints;
import java.awt.geom.AffineTransform;
import java.awt.image.BufferedImage;
import java.io.File;
import java.io.IOException;

import javax.imageio.ImageIO;
import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JPanel;

@SuppressWarnings("serial")
public class TelaZoom extends JFrame{
	
	private JPanel jContentPane = null;
	private JPanel jPanelSul = null;
	private JButton jButtonZoomIn = null;
	private JImagePanel jip = null;
	private Mouse mouse = new Mouse();
	
	private BufferedImage bi = null;
	
	public TelaZoom() throws IOException{
		super();
		initialize();
	}
	
	private void initialize() throws IOException {
		this.setSize(807, 600);
		this.setContentPane(getJContentPane());
		this.setTitle("Imagem");
		this.setResizable(false);
	}
	
	private JPanel getJContentPane() throws IOException {
		if (jContentPane == null) {
			jContentPane = new JPanel();
			jContentPane.setLayout(new BorderLayout());
			jContentPane.add(getJImagePanel(), BorderLayout.CENTER);
			jContentPane.add(getJPanelSul(),BorderLayout.SOUTH);
		}
		return jContentPane;
	}
	
	private JPanel getJImagePanel() throws IOException {
		if (jip == null) {
			bi = readImage("C:/mapa.png");
			mouse.setBi(bi);
			jip = new JImagePanel(bi);
		}
		jip.addMouseListener(mouse);
		return jip;
	}
	
	private JPanel getJPanelSul(){
		jPanelSul = new JPanel();
		jPanelSul.add(getJButton());
		jPanelSul.addMouseListener(mouse);
		return jPanelSul;
	}
	
	private JButton getJButton(){
		jButtonZoomIn = new JButton();
		jButtonZoomIn.setText("Zoom In");
		jButtonZoomIn.addActionListener(new java.awt.event.ActionListener() {
			public void actionPerformed(java.awt.event.ActionEvent e) {

			}
		});
		return jButtonZoomIn;
	}
	
	
	public BufferedImage readImage(String file) throws IOException{ 
	    BufferedImage image = ImageIO.read(new File(file));
	    return image;
	}
}

Me fala aonde eu devo colocar o Affine, pq ja to ficando pirado com isso huauhahuahua

JImagePanel é o painel que o ViniGodoy criou certo?

Anyway… voce vai precisar alterar no método paintComponent dele para setar o AffineTransform no Graphics2D e então desenhar a imagem.

Isso mesmo, é a classe do Vini…fazendo umas pesquisas acabei achando ela e que por sinal me ajudou muito.

Vlw pela grande ajuda Vini.

Agora, seria isso que vc quis dizer Mark

protected void paintComponent(Graphics g)
    {
        super.paintComponent(g);
        AffineTransform at = new AffineTransform();
        Graphics2D g2d = (Graphics2D) g.create();
        g2d.transform(at);
        fillType.drawImage(this, g2d, image);        
        g2d.dispose();
    }

Acrescentei no código do Vini as linhas 4 e 6.

Seria isso?

Sim, voce só precisa passar os parametros pra essa classe agora.

Da uma olhada o que é possivel fazer.
http://java.sun.com/j2se/1.4.2/docs/api/java/awt/geom/AffineTransform.html

Blz Mark,

Coloquei a linha 6 desse código abaixo.
e na hora de desenhar ele me retornou a imagem aproximada.

protected void paintComponent(Graphics g)
    {
        super.paintComponent(g);
        AffineTransform at = new AffineTransform();
        Graphics2D g2d = (Graphics2D) g.create();
        at.scale(1.2, 1.2);
        g2d.setTransform(at);
        fillType.drawImage(this, g2d, image);        
        g2d.dispose();
    }

Abaixo ta a imagem normal

wu5e9h.png817×614

e abaixo ela usando o código acima com a linha acrescentada.

242y3k9.png817×614

Agora, como eu faço pra dar esse zoom de acordo com o local aonde o usuário irá clicar???

Oi,

Posso estar falando besteira, mais acredito que agora precisa ser pego a posição ou localidade do ponteiro do seu mouse e usa-las no método de imagem.

Algo como:

MouseInfo.getPointerInfo().getLocation(); 

ou

window.getMousePosition();

Como lhe falei por mp, estou sem eclipse e não sei se esses são os métodos certos.

Tchauzin!

Vlw Lina,
Vou testar amanhã e espero que o pessoal ai possa me dizer tbm se são esses os métodos para se usar…

Eu tava tentando isso através de pegar o ponto aonde eu clico com o mouse.

Pegar o X e o Y.

Só não to conseguindo ligar esse ponto aonde eu clico com o zoom.

Alguém sabe como???

Agradecendo desde já a ajuda de todos.

OI,

A ação do botão você terá que realiza-la em seu evento mouseClicked:

this.addMouseListener( new MouseAdapter(){ public void mouseClicked(MouseEvent e){ // Chama a ação do bptão <Zoom In> passando a localização do ponteiro do mouse. } } );

Tchauzin!

Certo, no meu código ta da seguinte forma, tenho essa classe que passei acima e tenho uma classe chamada Mouse, aonde ela da um implements MouseListener.

Nessa classe mouse tem os métodos mouseClicked, mousePressed, etc.

Como vcs viram no meu código acima, tenho um objeto da classe mouse e meu JImagePanel ta ouvindo as funções do mouse.
(nesse código acima coloquei que o JPanelSul tbm ouve, mas era só para fazer um teste aqui.)

Então quando eu clico na imagem que ta carregada nesse meu JImagePanel, ele me passa as informações de X e Y.

A função desse botão ZoomIn ainda não ta desenvolvida hehehe…
Esse botão eu criei pra fazer da seguinte forma. Quando eu clicar nele, o ponteiro do mouse vai virar uma lupa e só quando o usuário clicar no mapa que da o zoom.
Vou criar o botão de Zoom Out depois tbm, mas por enquanto tenho que descobrir como dar o zoom nos pontos X e Y.

Enfim…

O que ta faltando é saber essa função do botão zoomIn, de clicar nele e só dar o zoom quando o usuário clicar no mapa.

Alguém sabe dizer juntar AffineTransform com os pontos X e Y do clique do mouse???

Voce precisa fazer um calculo matematico para desenhar ele com o centro sendo exatamente onde voce clicou. Assim ele vai dar o zoom que voce quer.

Huuummmm
Essa eu não sabia.
Vou dar uma pesquisada sobre esse cálculo e se eu achar algo posto aqui.
Vlw Mark_Ameba.

Quem tiver mais dicas sobre como fazer zoom, vai postando ai.

Não lembro exatamente como fazer isso mas voce deve deslocar sua imagem para a esquerda/direita de acordo com o fator do zoom que voce quer dar.

Bom, já faz muito tempo que eu to tentando e realmente não to conseguindo fazer uma função Zoom.
Fora esse problema, eu tbm tenho que desenvolver a função Pan(arrastar a imagem com o efeito do zoom) e tbm fazer uma função de consulta de acordo com a posição do meu mapa.

São três funções que no começo pareciam simples de ser desenvolvidas, mas que com o tempo, para mim, vi que eram funções complicadas de resolver.

Se alguém puder me ajudar passando um código de função zoom ou de pan, eu agradeceria muito. EU REALMENTE TO PRECISANDO, só que não to conseguindo desenvolver.

Aguardo uma resposta.

Abraço a todos.

Depois de um bom tempo, finalmente eu consegui.
Insistindo um pouco vi que não era nada complicado e passava de uma coisa bem simples.

Eu possuo um Objeto da classe Rectangle e esse objeto eu utilizava no meu desenho.
Entre os métodos dessa classe, se encontra o método grow(). Apenas com esse método consegui desenvolver minha função de Zoom sem perder qualidade da imagem.
Aproveitando tbm, com o mesmo objeto fiz a função Pan (mover a imagem que está com o zoom arrastando o mouse) usando o setLocation().

Quem tiver alguma dúvida sobre como usar o grow() e o setLocation(), perguntem ai que posso tentar ajudar.

Agradeço a ajuda de todos.

Att.