[Java] バッファーを使ってお絵描き機能を実現するときの不具合

Question

前提

Javaでお絵描きプログラムを作ろうとしています。
基本仕様は自由にお絵描きしてSaveボタンを押すと、
バッファーを使って描いた絵をJPEG形式で保存するという形になります。

しかし、描いた線がパネルに表示されていない問題が発生しました。
色々調べましたが、解決方法が見つからず、
もしご存じの方いらっしゃいましたら、
教えていただけないでしょうか。

すみませんが、わたしは留学生ですので、もし失礼なところがあれば本当に申し訳ございません。
何卒宜しくお願い致します。

発生している問題・エラーメッセージ

セーブされた画像は描いた絵が表示されているが、
絵を描いている途中パネルには描いた線が表示されていません。
また、画面をクリアして描きなおす機能もうまく稼働できません。

該当のソースコード

import java.awt.*;
import java.awt.event.*;
import java.awt.image.BufferedImage;
import java.io.*;
import javax.imageio.ImageIO;
import javax.swing.*;


public class Painting extends JFrame implements ActionListener{
	JPanel DrawPanel, SendPanel;
	JButton ButtonSave; //button for saving picture
	JButton ButtonClean; //button for cleaning the screen
	String path = System.getProperty("user.dir");
	String name = "test";
    int startX,startY,endX,endY; //Drawing cursor
    int width = 400;
    int height = 400;
    
    BufferedImage bufferImage = null;
    Graphics2D bufferGraphics = null;


    
    private void createBuffer(int width, int height) {
    	bufferImage = new BufferedImage(width, height, BufferedImage.TYPE_INT_RGB);
    	bufferGraphics = bufferImage.createGraphics();
    	bufferGraphics.setBackground(Color.white);
    	bufferGraphics.clearRect(0, 0, width, height);
    }
    
    public void initGui(){
    	DrawPanel = new JPanel();
    	SendPanel = new JPanel();
    	ButtonSave = new JButton("Save");
    	ButtonClean = new JButton("Clean");

    	
    	//Set Button on SendPanel
    	SendPanel.add(ButtonSave);
    	SendPanel.add(ButtonClean);
    	SendPanel.setLayout(new FlowLayout(FlowLayout.CENTER));
    	
    	//Set DrawPanel size
		DrawPanel.setPreferredSize(new Dimension(width,height));
		DrawPanel.setLayout(new FlowLayout(FlowLayout.CENTER));
		if(bufferGraphics == null) createBuffer(width, height);
		
		//when mouse push reset startX and startY
    	DrawPanel.addMouseListener(new MouseAdapter(){
			public void mousePressed(MouseEvent e){
				startX = e.getX();
				startY = e.getY();
			}
		});
    	
        //Paint setting
    	DrawPanel.addMouseMotionListener(new MouseAdapter(){
			public void mouseDragged(MouseEvent e){
				endX = e.getX();
				endY = e.getY();
				
				bufferGraphics.setColor(Color.BLACK);
			    bufferGraphics.setStroke(new BasicStroke(5));
				bufferGraphics.drawLine(startX,startY,endX,endY);
				
				startX = endX;
				startY = endY;
			}
		});
		
    	//Button setting
    	ButtonSave.addActionListener(this);
    	ButtonClean.addActionListener(this);
    	
    	
		//set JFrame
    	setLocation(400,200);
    	setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
    	add(DrawPanel, BorderLayout.CENTER);
    	add(SendPanel, BorderLayout.SOUTH);
    	pack();
    	setVisible(true);
	}
	
 
    public void paintComponet(Graphics2D g) {
    	super.paintComponents(g);
    	if(bufferImage != null) g.drawImage(bufferImage, 0, 0, this);
    }


    
    @Override
    public void actionPerformed(ActionEvent e) {
    	if(e.getSource() == ButtonSave) { //press Save button to save picture
    		savePic(path + name + ".jpg");
    	}else if(e.getSource() == ButtonClean){ //press Clean button to reset picture
    		DrawPanel.repaint();
    	}
    } 
    
    
    //capture picture
    public void savePic(String path){
		try {
				ImageIO.write(bufferImage, "jpg", new File(path));
		} catch (IOException e) {
			e.printStackTrace();
		}
    }
    
    
    public static void main(String[] argv) {
    	Painting paint = new Painting();
    	paint.initGui();
    }
 
}

Answer 1

セーブされた画像は描いた絵が表示されているが、
絵を描いている途中パネルには描いた線が表示されていません。

paintComponetはつづりが違いますし、JFrameにはありません。
つまり呼ばれることはありません（savePicのようにdoya91さんが定義した独自メソッド扱いです）
@Overrideをつけるようにすれば、こういったミスを防げます。

paintComponentを使うためにPainting extends JPanelとして、DrawPanelのかわりにするのがいいでしょうか。
JComponent#paintComponent (Java Platform SE 8 )

また、画面をクリアして描きなおす機能もうまく稼働できません。

bufferGraphicsに描いているのですから、当然クリアする処理がいるでしょう。

import java.awt.BasicStroke;
import java.awt.BorderLayout;
import java.awt.Color;
import java.awt.Dimension;
import java.awt.Graphics;
import java.awt.Graphics2D;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import java.awt.event.MouseAdapter;
import java.awt.event.MouseEvent;
import java.awt.image.BufferedImage;
import java.io.File;
import java.io.IOException;
import javax.imageio.ImageIO;
import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JPanel;


public class Painting extends JPanel implements ActionListener {
    public static void main(String[] args) {
        new Painting();
    }

    private final String name = "test";
    private final int width = 400;
    private final int height = 400;
    private final JButton ButtonSave = new JButton("Save");
    private final JButton ButtonClean = new JButton("Clean");

    private int startX, startY, endX, endY;
    private final BufferedImage bufferImage;
    private final Graphics2D bufferGraphics;


    private Painting() {
        JPanel sendPanel = new JPanel();
        sendPanel.add(ButtonSave);
        sendPanel.add(ButtonClean);

        setPreferredSize(new Dimension(width, height));

        // createBuffer
        bufferImage = new BufferedImage(width, height, BufferedImage.TYPE_INT_RGB);
        bufferGraphics = bufferImage.createGraphics();
        bufferGraphics.setBackground(Color.white);
        bufferGraphics.clearRect(0, 0, width, height);

        addMouseListener(new MouseAdapter() {
            public void mousePressed(MouseEvent e) {
                startX = e.getX();
                startY = e.getY();
            }
        });

        addMouseMotionListener(new MouseAdapter() {
            public void mouseDragged(MouseEvent e) {
                endX = e.getX();
                endY = e.getY();

                bufferGraphics.setColor(Color.BLACK);
                bufferGraphics.setStroke(new BasicStroke(5));
                bufferGraphics.drawLine(startX, startY, endX, endY);

                startX = endX;
                startY = endY;
                repaint();
            }
        });

        ButtonSave.addActionListener(this);
        ButtonClean.addActionListener(this);

        // set JFrame
        JFrame frame = new JFrame();
        frame.setLocation(400, 200);
        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        frame.add(this, BorderLayout.CENTER);
        frame.add(sendPanel, BorderLayout.SOUTH);
        frame.pack();
        frame.setVisible(true);
    }

    @Override public void paintComponent(Graphics g) {
        super.paintComponent(g);
        g.drawImage(bufferImage, 0, 0, this);
    }

    @Override public void actionPerformed(ActionEvent e) {
        if (e.getSource() == ButtonSave) {
            savePic(name + ".jpg");
        } else if (e.getSource() == ButtonClean) {
            bufferGraphics.clearRect(0, 0, width, height);
            repaint();
        }
    }

    private void savePic(String path) {
        try {
            ImageIO.write(bufferImage, "jpg", new File(path));
        } catch (IOException e) {
            e.printStackTrace();
        }
    }
}

Comments

[doya91]

paintComponent及びJComponentとJPanelの関係性をもう一度見直して理解しました。
ありがとうございました。本当に助かりました。