Text onto images via drag and drop in Applets

Question

I need to show an image in a java applet, with a text element (label) to move to a point chosen by the user. Is it possible by dragging and dropping the text over the image? What methods would I need to use?

I am looking for something similar to this.

Edit: Thanks you for your useful response. The code below works fine! But how to get a text position by x,y coordinates within the image?

public class MouseDragTest extends JPanel {

    private static final String TITLE = "Drag me!";
    private static final int W = 640;
    private static final int H = 480;
    private Point textPt = new Point(W / 2, H / 2);
    private Point mousePt;
    Image img;

    public MouseDragTest() {
        img = Toolkit.getDefaultToolkit().createImage("my_image.jpg");
        this.setFont(new Font("Serif", Font.ITALIC + Font.BOLD, 32));
        this.addMouseListener(new MouseAdapter() {

            @Override
            public void mousePressed(MouseEvent e) {
                mousePt = e.getPoint();
                repaint();
            }
        });
        this.addMouseMotionListener(new MouseMotionAdapter() {

            @Override
            public void mouseDragged(MouseEvent e) {
                int dx = e.getX() - mousePt.x;
                int dy = e.getY() - mousePt.y;
                textPt.setLocation(textPt.x + dx, textPt.y + dy);
                mousePt = e.getPoint();
                repaint();
            }
        });
    }

    @Override
    public Dimension getPreferredSize() {
        return new Dimension(W, H);
    }

    @Override
    public void paintComponent(Graphics g) {
        super.paintComponent(g);
        int w2 = g.getFontMetrics().stringWidth(TITLE) / 2;
        g.drawImage(img, 0, 0, null);
        g.drawString(TITLE, textPt.x - w2, textPt.y);
    }

    public static void main(String[] args) {
        EventQueue.invokeLater(new Runnable() {

            public void run() {
                JFrame f = new JFrame(TITLE);
                f.add(new MouseDragTest());
                f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
                f.pack();
                f.setLocationRelativeTo(null);
                f.setVisible(true);

            }
        });
    }
}

+1 for [sscce](http://sscce.org/). – trashgod Jan 31 '13 at 17:58 — trashgod, Jan 31 '13 at 17:58

score 1 · Accepted Answer · edited May 23 '17 at 10:24

1

You can use drawImage() in paintComponent() to show your invoice, like they show here, and drag the text, like they show here. Another way is to use the The Glass Pane.

edited May 23 '17 at 10:24

Community

1
1

answered Jan 31 '13 at 12:51

Catalina Island

7,027
2
23
42

score 1 · Answer 2 · answered Jan 31 '13 at 17:54

How to get a text position by x,y coordinates within the image?

It sounds like you want to edit the text and location repeatedly. When you're done dragging, textPt will be the point at which you want to draw the text when you next load that image. You can store the details in java.util.Preferences and restore them when you restart.

private static class AnnotatedImage {
    File file;
    List<String> notes;
    List<Point> points;
}

As you are using createImage(), use this as the image observer when drawing.

g.drawImage(img, 0, 0, this);

Text onto images via drag and drop in Applets

2 Answers2