interaction sur une image

Question

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.


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 :

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

Utilisateur anonyme · Answer

Salut,

Vite fait, en regardant ton code, je vois que tu utilises la classe JPanel pour représenter un élément graphique étant un cercle. Avec cette façon de faire, je te conseille plutôt de passer par JComponent car superposer des JPanels et un processus assez lourd, les JComponent sont plus appropriés pour ce genre de choses. Une fois ceci fait, tu peux passer (si mes souvenirs sont bons) par une méthode add() qui aura en paramètre un objet de ta classe Circle. J'ai cependant un doute concernant l'objet qui doit faire l'appel de add. Essaye de voir si tu peux le faire directement avec ton JPanel, sinon regarde avec son Graphics mais j'en doute.

Je pense qu'une classe héritant de JComponent est préférable à une classe héritant de JPanel car tu peux passer si ne je me trompe pas par des méthodes comme setPosition() pour définir où tu veux ajouter ton cercle sur ton panel.

Si tu as d'autres questions, n'hésite pas (ça fait un p'tit moment que j'ai fait du Swing donc je peux m'être trompé).


-- 
Pylouq
Heureux sont ceux qui lisent le Réglement, ils ne finiront peut-être pas au bûcher.

cs_Taz1984 · Answer

Bonjour, 

Merci pour la réponse.

En fait , en rajoutant dans l'objet Graphics ca a l'air de m'afficher le cercle. 

  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);
             
g2.setColor(Color.RED);
g2.fillOval(500,389, 50, 20);

    }  

.

j'aurai deux petites questions .

1 /L'image et le cercle se superpose , par contre je n'arrive pas à translater le point également par rapport au scale. l'image arrive à se fixer dans le cadre par contre le cercle est complètement mal positionné, je ne vois pas comment je peux appliquer la même translation j'ai essayé avec ca mais ca marche pas 
 at.translate(tx, ty) 

2/ Y a t il un Listener générique, sans le mouseAction ou autre, par exemple une un Listener qui peut consulter une file JMS ou qui peut consulter si un enreg est présent en BDD de ce genre là.


Merci d'avance

Utilisateur anonyme · Answer

Salut,

1 /L'image et le cercle se superpose , par contre je n'arrive pas à translater le point également par rapport au scale. l'image arrive à se fixer dans le cadre par contre le cercle est complètement mal positionné, je ne vois pas comment je peux appliquer la même translation j'ai essayé avec ca mais ca marche pas 

Je ne vois pas où tu veux en venir. Que cherches-tu à translater et par rapport à quoi ?

2/ Y a t il un Listener générique, sans le mouseAction ou autre, par exemple une un Listener qui peut consulter une file JMS ou qui peut consulter si un enreg est présent en BDD de ce genre là. 


Non, il n'y en a pas. Un Listener est à utiliser pour de la programmation évènementielle ce qui diffère un peu de ce que tu veux faire. Par contre, rien ne t'empêche de faire ta/tes propre(s) classe(s) pour pouvoir t'en créer un.

-- 
Pylouq
Heureux sont ceux qui lisent le Réglement, ils ne finiront peut-être pas au bûcher.

cs_Taz1984 · Answer

Salut, 

En fait l'image qui je charge subit une transformation pour être afficher correctement, je voudrais rajouter par exemple une Ellipse :
    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);     


    }

L'image est chargé et elle est OK, cependant l'Ellipse est déphasé par rapport à l'image , les positions x,y n'ont pas subit de transformation.

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.


Aurais tu  une idée pour que cette Ellipse puisse être en norme avec l'image ? 

Merci d'avance

Interaction sur une image

4 réponses

Votre réponse

Discussions similaires