Java Swing を使用して Canvas を作成する

Mehvish Ashiq 2023年10月12日
Java Swing を使用して Canvas を作成する

Java では、Java AWT または Java Swing を使用して、2つの方法でキャンバスを作成できます。今日は、Java Swing を使用してキャンバスを作成して図形を描画する方法を学習します。

Java Swing を使用してキャンバスを作成する

サンプルコード(PaintPanel.java クラス):

// write your package here
package com.voidtesting.canvas;
// import necessary libraries
import java.awt.Graphics;
import java.awt.Point;
import java.awt.event.MouseEvent;
import java.awt.event.MouseMotionAdapter;
import javax.swing.JPanel;

public class PaintPanel extends JPanel {
  // count the number of points
  private int pointCounter = 0;
  // array of 10000 Point references
  private Point[] points = new Point[10000];

  // make GUI and register the mouse event handler
  public PaintPanel() {
    // handles frame mouse motion event
    addMouseMotionListener(new MouseMotionAdapter() {
      // store the drag coordinates and repaint
      @Override
      public void mouseDragged(MouseEvent event) {
        if (pointCounter < points.length) {
          // find points
          points[pointCounter] = event.getPoint();
          // increment point's number in the array
          ++pointCounter;
          // repaint JFrame
          repaint();
        } // end if
      } // end mouseDragged method
    } // end anonymous inner class
    ); // end call to the addMouseMotionListener
  } // end PaintPanel constructor

  /*
  draw oval in a 5 by 5 bounding box at the given location
  on the window
  */
  @Override
  public void paintComponent(Graphics g) {
    // clear drawing area
    super.paintComponent(g);
    // draw all points that we have in array
    for (int i = 0; i < pointCounter; i++) g.fillOval(points[i].x, points[i].y, 5, 5);
  } // end paintComponent method
} // end PaintPanel Class

サンプルコード(Canvas.java クラス):

// write your package here
package com.voidtesting.canvas;
// import necessary libraries
import java.awt.BorderLayout;
import java.awt.Label;
import javax.swing.JFrame;

public class Canvas {
  public static void main(String[] args) {
    // create JFrame Object
    JFrame jFrame = new JFrame("Canvas Using Java Swing");
    // create PaintPanel Object
    PaintPanel paintPanel = new PaintPanel();
    // add paintPanel in center
    jFrame.add(paintPanel, BorderLayout.CENTER);
    // place the created label in the south of BorderLayout
    jFrame.add(new Label("Drag the mouse to draw"), BorderLayout.SOUTH);
    // exit on close
    jFrame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
    // set frame size
    jFrame.setSize(500, 400);
    // set jFrame location to center of the screen
    jFrame.setLocationRelativeTo(null);
    // display frame
    jFrame.setVisible(true);
  }
}

出力:

Java Swing を使用してキャンバスを作成します-キャンバスに描画します

PaintPanet.java クラスでは、JPanel拡張して、描画用のコミットされた領域を作成します。クラス Point は x 座標と y 座標を表します。

Point クラスのオブジェクトを作成して、すべてのマウスドラッグイベントのすべての座標を保存し、Graphics クラスを使用して描画します。この例では、すべてのマウスドラッグイベントが発生する場所を格納する 10,000 ポイント/座標を含むポイントタイプの配列を使用します。

paintComponent がこれらの座標を使用して描画していることがわかります。pointCounter という名前のインスタンス変数は、マウスドラッグイベントを介してキャプチャされたポイントの総数を引き続き追跡することに注意してください。

10,000 の制限に達すると、もう描画できなくなります。

次に、PaintPanel クラスのマウスモーションイベントをリッスンできる MouseMotionListener を登録します。addMouseMotionListener() リスナー内に、MouseMotionAdapter という名前のアダプタクラスを拡張する匿名内部クラスのオブジェクトを作成します。

なぜ mouseDragged をオーバーライドするのですか?MouseMotionAdapterMouseMotionListener を実装しているため、匿名の内部クラスオブジェクトは MouseMotionListener です。匿名内部クラスは、デフォルトの mouseMoved および mouseDragged 実装を継承します。

したがって、それはすでにインターフェースのすべてのメソッドを実装しています。ただし、デフォルトのメソッドは、それらが呼び出されるたびに何も実行しません。そのため、mouseDragged をオーバーライドして、マウスドラッグイベントのポイントをキャプチャし、それらを Point オブジェクトとして保存します。

if ステートメントは、容量がある場合にのみ配列内のポイントを保存することを保証します。getPoint() メソッドを呼び出して、イベントが発生した座標を取得し、それらをインデックス pointCounterpoints 配列に保存してから、pointCounter もインクリメントします。

if ステートメントを取得する前に、ペイントサイクルの更新を処理する repaint() メソッドを使用します。次に、paintComponent メソッドは、PaintPanel をコンピューター画面に表示する必要があるときに自動的に呼び出される Graphics のパラメーターを受け取ります。

paintComponent メソッド内で、paintComponent のスーパークラスを呼び出して、描画領域をクリアします。super キーワードを使用して、スーパークラスのメソッドとインスタンスにアクセスすることを忘れないでください。

fillOval() メソッドが実線の楕円を描画している間、pointCounter まで上がることができる配列内のすべてのポイントによって、指定された場所に 5x5 の楕円を描画します。

さて、メインクラスの Canvas.java に来てください。JFramePaintPanel のオブジェクトを作成します。

次に、add() メソッドを使用して、PaintPanel のオブジェクトを JFrame ウィンドウの中央に追加します。BorderLayout.CENTER を使用して、JFrame ウィンドウの中央に追加します。

次に、BorderLayout.SOUTH を使用して、JFrame ウィンドウの南に Label を追加します。その後、setDefaultCloseOperation()setSize()setLocationRelativeTo()、および setVisible() メソッドを使用して、ユーザーが十字記号(X)をクリックしたときにウィンドウを閉じ、JFrame ウィンドウのサイズで、JFrame ウィンドウをコンピューター画面の中央に移動し、それぞれ表示します。

キャンバスに手動で描画する代わりに、プログラムで描画することができます。

サンプルコード(Draw.java クラスには main メソッドがあります):

// write your package here
package com.voidtesting.canvas.draw;
// import necessary libraries
import java.awt.BorderLayout;
import java.awt.Color;
import java.awt.Graphics;
import javax.swing.JFrame;
import javax.swing.JPanel;

public class Draw extends JPanel {
  @Override
  public void paintComponent(Graphics g) {
    // call method of the super class
    super.paintComponent(g);
    // set background color
    this.setBackground(Color.cyan);

    // set color of the shape
    g.setColor(Color.red);
    // draw line
    g.drawLine(5, 30, 380, 30);

    // set color of the shape
    g.setColor(Color.blue);
    // draw rectangular
    g.drawRect(5, 40, 90, 55);

    // set color of the shape
    g.setColor(Color.BLACK);
    // draw string
    g.drawString("Hi, how are you?", 100, 50);

    // set color of the shape
    g.setColor(Color.green);
    // draw filled rectangular
    g.fill3DRect(5, 100, 90, 55, true);
    // draw filled oval
    g.fillOval(150, 100, 90, 55);
  }

  public static void main(String[] args) {
    // create JFrame Object
    JFrame jFrame = new JFrame("Canvas");
    // add the object of Draw Class in center
    jFrame.add(new Draw(), BorderLayout.CENTER);
    // exit on close
    jFrame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
    // set frame size
    jFrame.setSize(300, 200);
    // set jFrame location to center of the screen
    jFrame.setLocationRelativeTo(null);
    // display frame
    jFrame.setVisible(true);
  }
}

出力:

Java Swing を使用してキャンバスを作成する-プログラムでキャンバスに描画する

著者: Mehvish Ashiq
Mehvish Ashiq avatar Mehvish Ashiq avatar

Mehvish Ashiq is a former Java Programmer and a Data Science enthusiast who leverages her expertise to help others to learn and grow by creating interesting, useful, and reader-friendly content in Computer Programming, Data Science, and Technology.

LinkedIn GitHub Facebook

関連記事 - Java Swing