描画用パネルを部品とする

  1. 描画用パネルクラス
    1. パネル部品
      パネル部品はその中に部品を配置するための領域としてよく利用されますが、JPanelクラスは描画用にも利用できます。パネルクラスをグラフィックス部品として使用すると、その内部のみで描画するので、グラフィックスが外部にはみ出す心配がありません。また、マウスイベントのパネル内部でのみ発生します。
       AWTのPanelクラスは部品の配置はできますが、グラフィックの描画はできないようです。グラフィック表示をするにはJPanelクラスを利用します。

    2. パネルクラス部品の組み込み
       パネル部品をそのまま組み込んだのでは、アプレット(フレーム全体)のグラフィックと区別ができません。JPanelクラスを継承したクラスを作成し、その内部で、描画やイベント処理を行います。ただし、通常のJbuilderの部品組み込みでは、作成したクラスの部品を配置できません。
       ただし、自分で作成した部品のクラスを配置する機能が用意されています。部品を表示するツールバーの横(白抜き矢印の下)に「bean]選択ボタンがあります。



       これをクリックすると現れる「bean選択」ウインドウから、自分で定義したクラスの配置可能クラスの部品をクリックします。これで、、カーソルがドラッグ用の + に変り、配置ウインドウにこの部品を配置できます。

    3. ベクタクラス
      ここでは、クリックした点の位置を記録するのに ベクタ を利用しています。ベクタクラスは次のように利用します。
       Vector cv=new Vector();
      ベクタオブジェクトに点位置を追加をするには、次のようにします。
       Point pt=new Point();
        pt.x=e.getX(); pt.y=e.getY();
       cv.add(pt);
      このベクタから、すべての点を取り出すには、次のように、Iteratorクラスのオブジェクト it に変換します。it.next() で、it から次の要素を取り出すことができます。ベクタクラスはObject クラスで、特定のクラスではありませんから、利用するクラス(この場合 Point)にキャストする必要があります。it.hasNext() は it に要素が残っている場合 true を返します。
        Iterator it=cv.iterator();
          while(it.hasNext()){
            Point pt=(Point)it.next();
            g.drawOval(pt.x-10,pt.y-10,20,20);
          }

  2. プロジェクトの作成
    1. アプレットクラス
      ここでは、PanelTestの名前でプロジェクトを作成します。クリックすると円を表示する JPanel クラス部品を組み込みます。また、描画した円をクリアする クリア ボタンを用意します。

    2. JPanelクラスの作成
       ファイルメニューから「新規クラス」作成を選びます。クラス作成ウインドウが表示されます。クラス名を drPanel、ベースクラスを javax.swing.JPanel とします。これで、dePanel クラスが生成されます。
       public class drPanel extends JPanel { }
      プロジェクトメニューの「メイク」を行うとJbuilderで配置可能なクラスが作成できます。

    3. drPanel の配置
       アプレットの「設計」画面で、「bean]選択をクリックし、リストから プロジェクト名「PanelTest]をクリックし、配置部品 dePanel を選択します。これで、設計画面に drPanel を配置できます。結果として、次のようなコードが生成されます。
       private drPanel drPanel1 = new drPanel();
       drPanel1.setBounds(new Rectangle(38, 43, 314, 175));
       this.add(drPanel1, null);
      Jbuilderを利用しなくても、上のプログラムを作成すれば、組み込む可能です。

    4. drPanelクラスの設計
       
      1. マウスイベント
         マウスイベント処理用のメソッドを定義します。Jbuilderのプロジェクトペインで drPanel.java を選択し、内容ペインで設計画面を表示します。インスペクタ(右側のペイン)のプロパティで、「background]を 「白」とします。また、イベントに切り替え「mousuClicked]をダブルクリックします。これで、マウスをクリックしたイベントを処理する
         void this_mouseClicked(MouseEvent e) {}
        が生成されます。ここでは、マウスの位置を、ベクタ cv に記録し、repaint()を行います。
        cvは このクラスの先頭で Vector cv=new Vector(); と定義しておきます。
          void this_mouseClicked(MouseEvent e) {
            Point pt=new Point();
            pt.x=e.getX();
            pt.y=e.getY();
            cv.add(pt);
            repaint();
          }

      2. 描画処理
         部品内部では、
          public void paintComponent(Graphics g){ }
        で描画処理を行います。アプレットの paint() が実行されると、その部品である、drPanelクラスの paintComponent(Graphics g) が呼び出されます。ここでは、文字列を表示後、ベクタ内部の点を中心に円を描きます。
         先頭で、 super.paintComponent(g); が必要です。これは、継承した Jpanel クラスの paintComponent(g) の実行を指示します。

          public void paintComponent(Graphics g){
            super.paintComponent(g);
            g.drawString("Draw Component",10,20);
            Iterator it=cv.iterator();
            while(it.hasNext()){
              Point pt=(Point)it.next();
              g.drawOval(pt.x-10,pt.y-10,20,20);
            }
          }
      3. クリア処理
         アプレットの clear ボタンで呼び出されます。
         cv.removeAllElements();
        で、ベクタの要素を削除します。

  3. 実行
    起動すると、白い背景のパネルが表示されます。この内部でクリックすると円が表示されます。境界近くでクリックしても、円がはみ出すことはありません。また、パネル外部では、クリックしてもイベントは発生しません。円の位置を記憶して表示していますから、アプレットの画面を一度隠しても再描画できます。Clear ボタンで、円を消去できます。

     

  4. プロジェクト
     このプロジェクトをダウンロードできます。次の行をクリックして、jPanelTest.exeファイルを適当なフォルダに保存します。
    ダウンロード開始
    このファイルは自己解凍型の圧縮ファイルです。このファイルを実行すると指定したフォルダに必要なファイルが生成されます。