Drag and Drop tremblant

**ji_louis** · 24/03/2010, 10h26

Bonjour,

Je souhaite faire une interface graphique avec plusieurs centaines de petites images que je déplace à la souris (pour un éditeur de patron de tricot).

Je commence donc par faire un essai avec une seule image que je déplace par drag and drop. Ça marche sauf que les positions renvoyées par la souris sont variables, "tremblantes", et ça ne peut décemment pas convenir.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
 
public class Start {public static void main(String[] args) {
		FrameDessin fd = new FrameDessin();
		fd.setVisible(true);
	}
}

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
import java.awt.Dimension;
import java.awt.Toolkit;
import javax.swing.JFrame;
import javax.swing.JMenuItem;
 
public class FrameDessin extends JFrame {
	private static final long serialVersionUID = -7402775664675188834L;
	public JMenuItem effacer, quitter, couleur;
	public Dessin dessin = new Dessin();
 
	public FrameDessin(){	
		setTitle("Dessinons !");	
		getContentPane().add(dessin);
		Dimension screenSize = Toolkit.getDefaultToolkit().getScreenSize();
		setLocation((screenSize.width - 600)/2, (screenSize.height-600)/2);
		setSize(600,600);
		setVisible(true);
		setResizable(false);
		setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
	}
}

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
import java.awt.event.MouseEvent;
import java.awt.event.MouseMotionListener;
import java.awt.image.BufferedImage;
import java.io.File;
import java.io.IOException;

import javax.imageio.ImageIO;
import javax.swing.ImageIcon;
import javax.swing.JColorChooser;
import javax.swing.JLabel;
import javax.swing.JPanel;

public class Dessin extends JPanel {
	private static final long serialVersionUID = -201260506438934324L;
	Color couleur = Color.white;
	BufferedImage image;
	JLabel label;
	
	public Dessin(){
		try {
			 image = ImageIO.read(new File("C:\\Images\\cochon.jpg"));
		} catch (IOException e) {
			System.err.println("Fichier invalide");
		}
		setBackground(Color.white);		
		setLayout(null); // pour pouvoir placer la vignette exactement là où je la veux		
		label = new Vignette (image);
		add(label);
	}

/* la classe Vignette est un JLabel qui réagit à la souris supporte une image
 * représentant pour l'exemple un cochon	*/
 class Vignette extends JLabel implements MouseMotionListener {

	public Vignette(BufferedImage image) {
		super(new ImageIcon(image));
		setBounds(0, 0, image.getWidth(), image.getHeight());
		setName("cochon");
		addMouseMotionListener(this);
		System.out.println("largeur = " + image.getWidth() + "\t hauteur = " + image.getHeight());
	}
	public void mouseDragged(MouseEvent e) {
		e.getComponent().setBounds(e.getX(), e.getY(), image.getWidth(), image.getHeight());
		System.out.println(e.getComponent().getName() + "\t x=" + e.getX() + "\t y=" + e.getY());
	}

	public void mouseMoved(MouseEvent e) {
        // méthode obligatoire que je laisse volontairement vide
	}	 
    }
}

Lors d'un drag and drop de l'image en diagonale, j'obtiens:

Envoyé par le log

largeur = 80 hauteur = 80
cochon x=54 y=35
cochon x=1 y=0
cochon x=54 y=36
cochon x=2 y=1
cochon x=55 y=37
cochon x=4 y=2
cochon x=56 y=38
cochon x=6 y=3
cochon x=57 y=40
cochon x=8 y=4
cochon x=59 y=42
cochon x=11 y=5
etc...

Quelqu'un pourrait-il (ou elle) m'expliquer pourquoi ce "tremblement"? Et comment y remédier?

**plegat** · 24/03/2010, 20h52

Salut,

Envoyé par ji_louis

Quelqu'un pourrait-il (ou elle) m'expliquer pourquoi ce "tremblement"? Et comment y remédier?

Les coordonnées de l'évènement que tu récupères sont, initialement, dans le repère label, qui est ensuite redessiné dans le repère container. Donc si tu cliques sur le pixel (1,1) du label, ça va te le redessiner au pixel (1,1) de la frame. Le coup d'après, vu que le label ne se trouve plus sous la souris, ça va récupérer des coordonnées par rapport au label décalé, et ça va te recaler le label sous la souris. D'où cette impression de clignotement.

Le truc à faire:
1) récupérer la position du clic lors d'un mousePressed

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
    public void MousePressed(MouseEvent e) {
        x0=e.getX();
        y0=e.getY();
    }

2) faire ensuite les décalages qui vont bien dans le mouseDragged:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
 
    public void MouseDragged(MouseEvent e) {
 
        int x=this.getX();
        int y=this.getY();
 
        e.getComponent().setBounds(x+e.getX()-x0, y+e.getY()-y0, image.getWidth(), image.getHeight());
 
     }

Code à corriger éventuellement, c'est de l'adapté pour coller un peu plus au tien...

**ji_louis** · 25/03/2010, 10h32

Le diagnostic semble le bon, mais pas le remède. En effet, les coordonnées renvoyées par la souris sont "bonnes" une fois sur deux, donc la correction est à faire seulement une fois sur deux. Je creuse la piste.

Autre symptome, les coordonnées de la vignettes semblent divisées par deux: Quand je tire la souris d'un bord à l'autre de la fenêtre, la vignette ne se déplace que d'un bord au centre et semble centrée entre le point du drag et celui du drop.
--------------------------------------------------------------------------
Après essais, j'ai supprimé l'écoute de la souris sur la vignette et l'ai laissée sur le panel, et ça marche: Le coin haut/gauche de la vignette suis la souris quand je DnD.

Maintenant, je dois travailler sur l'hypothèse de plusieurs vignettes et détecter laquelle est soumise au DnD.

**plegat** · 25/03/2010, 19h37

Envoyé par ji_louis

Le diagnostic semble le bon, mais pas le remède. En effet, les coordonnées renvoyées par la souris sont "bonnes" une fois sur deux, donc la correction est à faire seulement une fois sur deux. Je creuse la piste.

Autre symptome, les coordonnées de la vignettes semblent divisées par deux: Quand je tire la souris d'un bord à l'autre de la fenêtre, la vignette ne se déplace que d'un bord au centre et semble centrée entre le point du drag et celui du drop.

ça ce sont les symptômes que j'avais avec ton code initial...
Avec les lignes que je t'ai passé, ça fonctionne normalement...

Envoyé par ji_louis

Après essais, j'ai supprimé l'écoute de la souris sur la vignette et l'ai laissée sur le panel, et ça marche: Le coin haut/gauche de la vignette suis la souris quand je DnD.

Euh... ça doit aussi suivre si tu cliques à côté, non?