Interaction sur une image
Bonjour,
J'ai réussi à afficher une image dans une JFrame et à lui ajouter la fonction de zoom.
Par contre je voudrais afficher des petites boules sur cette image, par un exemple ajout d'un listener dés réception de coordonnées (x,y) ,j'affiche une boule dans cette image.
Auriez vous une idées de la façon dont je dois procéder pour afficher ces petites boules à divers instants. Merci d'avance.
Voici mon code qui affiche l'image avec la fonction de zoom.
Code:
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
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
|
import java.awt.*;
import java.awt.event.*;
import java.awt.geom.*;
import java.awt.image.BufferedImage;
import java.io.*;
import java.net.*;
import javax.imageio.ImageIO;
import javax.swing.*;
import javax.swing.event.*;
import net.atos.graphics.Circle;
public class ZoomTest
{
public static void main(String[] args)
{
ImagePanel panel = new ImagePanel();
ImageZoom zoom = new ImageZoom(panel);
JFrame f = new JFrame();
f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
f.getContentPane().add(zoom.getUIPanel(), "North");
f.getContentPane().add(new JScrollPane(panel));
f.setSize(400,400);
f.setLocation(200,200);
f.setVisible(true);
}
}
class ImagePanel extends JPanel
{
BufferedImage image;
double scale;
public ImagePanel()
{
loadImage();
scale = 1.0;
setBackground(Color.black);
}
protected void paintComponent(Graphics g)
{
super.paintComponent(g);
Graphics2D g2 = (Graphics2D)g;
g2.setRenderingHint(RenderingHints.KEY_INTERPOLATION,
RenderingHints.VALUE_INTERPOLATION_BICUBIC);
int w = getWidth();
int h = getHeight();
int imageWidth = image.getWidth();
int imageHeight = image.getHeight();
double x = (w - scale * imageWidth)/2;
double y = (h - scale * imageHeight)/2;
AffineTransform at = AffineTransform.getTranslateInstance(x,y);
at.scale(scale, scale);
g2.drawRenderedImage(image, at);
}
/**
* For the scroll pane.
*/
public Dimension getPreferredSize()
{
int w = (int)(scale * image.getWidth());
int h = (int)(scale * image.getHeight());
return new Dimension(w, h);
}
public void setScale(double s)
{
scale = s;
revalidate(); // update the scroll pane
repaint();
}
private void loadImage()
{
File file = new File("E:/route1_28.png");
try
{
//URL url = getClass().getResource("file:///E:/route1_28.png");
image = ImageIO.read(file);
}
catch(MalformedURLException mue)
{
System.out.println("URL trouble: " + mue.getMessage());
}
catch(IOException ioe)
{
System.out.println("read trouble: " + ioe.getMessage());
}
}
}
class ImageZoom
{
ImagePanel imagePanel;
public ImageZoom(ImagePanel ip)
{
imagePanel = ip;
}
public JPanel getUIPanel()
{
SpinnerNumberModel model = new SpinnerNumberModel(1.0, 0.1, 1.4, .01);
final JSpinner spinner = new JSpinner(model);
spinner.setPreferredSize(new Dimension(45, spinner.getPreferredSize().height));
spinner.addChangeListener(new ChangeListener()
{
public void stateChanged(ChangeEvent e)
{
float scale = ((Double)spinner.getValue()).floatValue();
imagePanel.setScale(scale);
}
});
JPanel panel = new JPanel();
panel.add(new JLabel("scale"));
panel.add(spinner);
return panel;
}
} |
Je voudrais par exemple, à un moment donné dessiner sur la cette image qui est affiché , une boule rouge de cette façon :
Code:
1
2
3
4
5
6
7
8
9
10
11
| public class Circle extends JPanel{
private Graphics g ;
public void paintComponent(int x, int y){
g.setColor(Color.RED);
g.fillOval(500, 618, 50, 20);
}
} |
Mais comment superposés une boule sur une image à chaque fois que j'ai de nouveaux coordonnées !!
Merci d'avance
Interaction sur une image
Bonjour,
Merci pour votre réponse , j'ai rajouté l'Ellipse.
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
|
protected void paintComponent(Graphics g)
{
super.paintComponent(g);
Graphics2D g2 = (Graphics2D)g;
g2.setRenderingHint(RenderingHints.KEY_INTERPOLATION,
RenderingHints.VALUE_INTERPOLATION_BICUBIC);
int w = getWidth();
int h = getHeight();
int imageWidth = image.getWidth();
int imageHeight = image.getHeight();
double x = (w - scale * imageWidth)/2;
double y = (h - scale * imageHeight)/2;
AffineTransform at = AffineTransform.getTranslateInstance(x,y);
at.scale(scale, scale);
g2.drawRenderedImage(image, at);
Shape s = new Ellipse2D.Double(500,389, 100, 15);
g2.fill(s); } |
Le problème est que cette Ellipse ne suit pas la translation avec le scale.
Je voudrais qu'elle subisse aussi la même Transformation que l'image initiale pour avoir de la cohérence. (Appliquer un AffineTransform) c'est compliqué à appliquer.
Auriez vous une idée pour que cette Ellipse puisse être en norme avec l'image ?
Merci d'avance
Interaction sur une image
oh la la , pleins de méthode drawImage(..) :calim2: , laquelle choisir 8O , j'ai bien compris que tu me conseille de mettre le tout dans le graphique et affecter la transformation pour tous.
As tu essayé de faire tourner le code ca a marché pour toi ? quel méthode as tu choisi ?
Merci
Interaction sur une image
Bonjour,
Merci ca fonctionne très bien :ccool:
Bonne année A tous par la même occasion :mouarf:
