Question

Hello people,

I am trying to write an animated character for a multitouch screen. I want my object to have 5 eyes and each of whose pupil to be dragged and dropped differently, within the eye of course.

I have tried to do it all in a single class and the problem seems to be assigning mouse handlers to each of the five pupils! In other words, if I move one pupil, all the pupils are moving.

Then, I resorted to using a bespoke class just to the pupil. When I use it by itself, the pupil is draggable. However, when I use it as an object in the eyes class, the pupil is static! No clicks registered, no mouse activity tracked.

I have looked at tutorials, other related issues with mouse handlers and could not make any progress. I changed the code a dozen times from various tutorials and suggestions before finally posting here. Any ideas where I am missing the cue? Any pointers would be greatly appreciated.

Thanks in advance.

PS: I know I am yet to put the constraints on the pupil movement within the eye.

Code for main eyes class:

package rollEyes;

import java.awt.*;
import javax.swing.JFrame;
import javax.swing.JPanel;

public class FiveEyes extends JPanel
{
    private static final long serialVersionUID = 1L;
    private static final int SIZE = 512;
    private int a = SIZE / 2;
    private int b = a;
    private int r = 4 * SIZE / 5;
    private int n;
int circleSize=30;
Pupil dc = new Pupil(1);

    public FiveEyes(int n) 
    {
        super(true);
        this.setPreferredSize(new Dimension(SIZE, SIZE));
        this.n = n;
    }

    @Override
    protected void paintComponent(Graphics g) 
    {
        super.paintComponent(g);
        Graphics2D g2d = (Graphics2D) g;
            g2d.setRenderingHint(
            RenderingHints.KEY_ANTIALIASING,
            RenderingHints.VALUE_ANTIALIAS_ON);
        g2d.setColor(Color.black);
        a = getWidth() / 2;
        b = getHeight() / 2;
        int m = Math.min(a, b);
        r = 4 * m / 5;
        int r2 = Math.abs(m - r) / 2;


        int numOfEyes = 5;
    for (int i = 0; i < numOfEyes ; i++) 
            {
            Graphics2D g2d2 = (Graphics2D) g;
                double t = 2 * Math.PI * i / n;
                int x = (int) Math.round(a + r * Math.cos(t));
                int y = (int) Math.round(b + r * Math.sin(t));
                drawEyeSockets(g2d2, x,y, 2*r2,2*r2);
            }
    }


    public static void main(String[] args) 
    {
        EventQueue.invokeLater(new Runnable() 
        {
        @Override
            public void run() 
        {
                create();
            }
        });
    }

    public void drawEyeSockets(final Graphics2D g2, int x, int y, int w, int h)
    {
        g2.drawOval(x,y,w,h);
        dc.drawCircle(g2, x+12, y+12);
    }

    private static void create() 
    {
        JFrame f = new JFrame();
        f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        FiveEyes fivey = new FiveEyes(5);
        f.add(fivey);
        f.pack();
        f.setVisible(true);
    }

}

Code for the Pupil class:

package rollEyes;

import java.awt.Color;
import java.awt.EventQueue;
import java.awt.Graphics;
import java.awt.Graphics2D;
import java.awt.RenderingHints;
import java.awt.event.MouseAdapter;
import java.awt.event.MouseEvent;
import javax.swing.JFrame;
import javax.swing.JPanel;

public class Pupil extends JPanel 
{
private static final long serialVersionUID = 1L;
int radius=50;
int x_after = 50;
int y_after = 50;
MouseHandler mh ;
private static int n =1;
public Pupil(int n) 
{
    super(true);
}

protected void paintComponent(Graphics g) 
{
    super.paintComponent(g);
    Graphics2D g2d = (Graphics2D) g;
    g2d.setRenderingHint(RenderingHints.KEY_ANTIALIASING,RenderingHints.VALUE_ANTIALIAS_ON);
    drawCircle(g2d,x_after,y_after); 
}

public  void drawCircle(final Graphics2D g2d, int x, int y) 
{
        g2d.setColor(Color.BLUE);
        g2d.fillOval(x, y, radius/2, radius/2);
        mh = new MouseHandler();
        this.addMouseListener(mh);
        this.addMouseMotionListener(mh);
}

private static void create() 
{
    JFrame f = new JFrame();
    f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
    Pupil dc = new Pupil(n);
    f.add(dc);
    f.pack();
    f.setVisible(true);
}

public static void main(String[] args) 
{
    EventQueue.invokeLater(new Runnable() 
    {
        @Override
        public void run() 
        {
            create();
        }
    });
}

private class MouseHandler extends MouseAdapter
{
    boolean circleClicked=false;
    public void mouseReleased(MouseEvent e) 
    {
        circleClicked = false;
    }   
    public void mousePressed(MouseEvent me) 
    {
            circleClicked = true;
    }
        public void mouseDragged(MouseEvent me) 
        {
            if (circleClicked) 
        {
            x_after = me.getX();
            y_after = me.getY();
            repaint();
        }
        }
    }
}

Answer 1

You have Pupil extend JPanel, but really shouldn’t be doing that. Instead, use the concepts that you’ve learned in your current Pupil class — how to draw a movable circle, and extend it in the larger FiveEyes class, only this time create a List<Pupil> and draw them. My suggestions:

• Make Pupil not extend JPanel. Instead give it the machinery to draw circles in certain locations and to have that location changed.
• Also you will need to give it a way to recognize if its circle has been clicked by giving it a contains(Point p) method. One way to do this is to use a Shape object, or you can roll your own method.
• Give FiveEyes a List<Pupil> that in reality is an ArrayList<Pupil> and fill it with Pupil objects.
• In FiveEyes paintComponent(...) method, iterate through this List telling each Pupil to draw itself.
• In your FiveEyes MouseAdapter’s mousePressed(...) method, iterate through your Pupil List to see if a Pupil has been clicked on. If so, move it.
• Alternatively, you could create a Pupil BufferedImage, put it into an ImageIcon, and put that into a JLabel, and then allow your FiveEyes class’s MouseAdapter to drag the labels around.