用Java精确绘制图像

Question

In the code below I convert a 2dim array to a buffered image (which works, the image is binary (back and white)). Then I display this image.

My question now is how can I update this image (because I want to draw something in every run of a loop which is not displayed here).

This also brings me to my second question: how can I draw a point on this image . (This also means that if I want to draw a point on 150,100 ; it should be on pixel 150,100 of the image).

public void showImage(int xPoint, int yPoint) throws IOException {

    // Two dim array conversion to a bufferedImage
    BufferedImage bimg = new BufferedImage(width, height, BufferedImage.TYPE_INT_RGB);
    for (int y = 0; y < width; y++) {
        for (int x = 0; x < height; x++) {

            tempValue = (pixelArray[y][x]==1) ? 255 : 0;
            int value = tempValue << 16 | tempValue << 8 | tempValue;
            bimg.setRGB(x, y, value);

        }
    }

    JFrame canvas = new JFrame();
    canvas.setSize(bimg.getWidth(), bimg.getHeight());
    canvas.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
    canvas.setTitle("Contour");
    Container pane = canvas.getContentPane();
    ColorPanel panel = new ColorPanel(bimg,xPoint,yPoint);
    pane.add(panel);
    canvas.setVisible(true);
}

and

    class ColorPanel extends JPanel {
    BufferedImage bimg;
    int x;
    int y;

    public ColorPanel(BufferedImage image,int _x, int _y) {
        bimg = image;
        x = _x;
        y = _y;
    }

    public void paintComponent(Graphics g) {
        super.paintComponent(g);
        Graphics2D g2d = (Graphics2D) g;
        g2d.drawImage(bimg, null, 0, 0);
    }
}

what I tried was:

  g2d.setColor(Color.RED);
  g2d.drawLine(x, y, x, y);

Though a new window opened on every run and I don't think the point was on the right

Answer 1

I did a small example for you.

Basically it is a JFrame with a custom JPanel called ColorPanel (which is much like yours with a few extra methods namely drawDot(..) and setBufferedImage(..) )

The JFrame will initialize and add the JPanel with an BufferedImage (completely black in this case). Thereafter white dots/pixels will be drawn on the Image at random co-ordinates (within the images bounds) every 2 seconds using BufferedImage#setRGB(...) .

I set the timer to faster (200milis) and this is what the picture begins to look like:

NB its accurate, make it color an obvious co-ordinate like drawPoint(0,0) and you will see ( i did not demonstrate this as a screenshot would than not be possible or of any use)

import java.awt.Dimension;
import java.awt.Graphics;
import java.awt.Graphics2D;
import java.awt.event.ActionEvent;
import java.awt.image.BufferedImage;
import java.net.URL;
import java.util.Random;
import javax.imageio.ImageIO;
import javax.swing.AbstractAction;
import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.SwingUtilities;
import javax.swing.Timer;

public class PixelDotOnImage {

    public PixelDotOnImage() throws Exception {
        JFrame frame = new JFrame();
        frame.setTitle("Random Pixel Dots On Image with Timer");
        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        frame.setResizable(false);

        initComponents(frame);

        frame.pack();
        frame.setVisible(true);
    }

    public static void main(String[] args) {

        //create frame and components on EDT
        SwingUtilities.invokeLater(new Runnable() {
            @Override
            public void run() {
                try {
                    new PixelDotOnImage();
                } catch (Exception ex) {
                    ex.printStackTrace();
                }
            }
        });
    }

    private void initComponents(JFrame frame) throws Exception {

        final BufferedImage bi = ImageIO.read(new URL("http://2.bp.blogspot.com/_KI3IRH6RxSs/S-uuLsgGJ3I/AAAAAAAAA5E/AA5mWBMLIvo/s1600/mat-black-lg.jpg"));
        final ColorPanel cPanel = new ColorPanel(bi);
        frame.add(cPanel);

        //create timer to color random pixels
        Timer timer = new Timer(2000, new AbstractAction() {
            int xMax = bi.getWidth(), yMax = bi.getHeight();
            Random rand = new Random();

            @Override
            public void actionPerformed(ActionEvent ae) {

                int x = rand.nextInt(xMax);
                int y = rand.nextInt(yMax);

                if (cPanel.drawDot(x, y)) {
                    System.out.println("Drew white dot at: (" + x + "," + y + ")");
                } else {
                    System.out.println("Cant draw white dot at: (" + x + "," + y + ")");
                }

            }
        });

        timer.start();
    }
}

class ColorPanel extends JPanel {

    private BufferedImage bimg;
    private Dimension dims;

    public ColorPanel(BufferedImage image) {
        bimg = image;
        dims = new Dimension(bimg.getWidth(), bimg.getHeight());
    }

    @Override
    public void paintComponent(Graphics g) {
        super.paintComponent(g);
        Graphics2D g2d = (Graphics2D) g;
        g2d.drawImage(bimg, 0, 0, null);
    }

    //this method will allow the changing of image
    public void setBufferedImage(BufferedImage newImg) {
        bimg = newImg;
    }

    //ths method will colour a pixel white
    public boolean drawDot(int x, int y) {

        if (x > dims.getWidth() || y > dims.getHeight()) {
            return false;
        }

        bimg.setRGB(x, y,  0xFFFFFFFF);//white

        repaint();
        return true;
    }

    @Override
    public Dimension getPreferredSize() {
        return dims;
    }
}

Hope this helps.

Answer 2

Rather than building an image then adding it to a JPanel, you might consider looking into drawing right on the panel by overriding it's paintComponent method, like so:

public class PainterPanel extends JPanel {
    public void paintComponent(Graphics g){     
        super.paintComponent(g);

        // draw a diagonal line from top left to bottom right
        Dimension d = getSize();
        g2.draw(new Line2D.Double(0,0,d.width,d.height));
    }
}

This method gets called every time the repaint() method is called (for instance by resizing the frame, or by calling it manually yourself). You can do any sort of complex processing you need including plotting a matrix of points.

The only catch (and this would be true if you stuck with your original behavior too) is the repainting happens in a separate thread, so you need to be careful about when and how you update your data, so that it's done in a threadsafe way.

Answer 3

how can I update this image

• To draw on the image use the graphics obtained by bimg.getGraphics() (and then use it just like you would in a paintComponent ). See Javadocs

how can I draw a point on this image

• To paint on a specific point of the Buffered Image, use any method of the graphics object retrieved from above answer. Example g.drawLine(150,100,150,100)