自分でBorderを作成する

広告

自分でBorderを定義してみましょう。自分で作成するボーダーを定義するためにはBorderインターフェースを使ったクラスを自分で作成します。定義が必要なメソッドは下記の3つとなります。

paintBorder
getBorderInsets
isBorderOpaque

では順に定義する方法を見ていきましょう。

getBorderInsetsメソッド

getBorderInsetsメソッドは枠の大きさを返します。戻り値はInsetsクラスのオブジェクトになります。

ボーダのインセットの値を返します。 

パラメータ:
  c - このボーダのインセットの値を適用するコンポーネント

例えば上下左右にそれぞれ5ピクセルの枠を作成する場合は下記のような記述となります。

class UserBorder implements Border {
  public Insets getBorderInsets(Component c){
    return new Insets(5, 5, 5, 5);
  }
}

ちなみにInsetsクラスのコンストラクタは下記のように記述されています。

新しい Insets オブジェクトを、指定された top、left、bottom、right イ
ンセットで作成して初期化します。 

パラメータ:
  top - 上部からのインセット
  left - 左側からのインセット
  bottom - 下部からのインセット
  right - 右側からのインセット

よって指定方法としては、上/左/下/右の順で枠の大きさを指定します。

isBorderOpaqueメソッド

isBorderOpaqueメソッドは枠が透明かどうかを返します。透明の場合は"true"、非透明の場合は"false"を返すだけです。

ボーダが不透明かどうかを返します。ボーダが不透明である場合、ボーダのバ
ックグラウンドはペイント時にボーダ自身によって塗りつぶされます。

実際に記述する場合は下記のような感じです。

class UserBorder implements Border {
  public boolean isBorderOpaque(){
    /* 非透明の場合 */
    return false;
  }
}

paintBorderメソッド

paintBorderメソッドの部分で実際にどのような枠にするかを具体的に記述します。

指定されたコンポーネントのボーダを、指定された位置およびサイズでペイ
ントします。 

パラメータ:
  c - このボーダがペイントされるコンポーネント
  g - ペイントのグラフィックス
  x - ペイントされたボーダの x 座標
  y - ペイントされたボーダの y 座標
  width - ペイントされたボーダの幅
  height - ペイントされたボーダの高さ

引数として渡されてきたGraphicsオブジェクトに対して線などを記述します。

座標に関しては、枠を描いた後のコンポーネントのサイズとなります。よって、左上座標が(x, y)、右下座標が(x + width, y + height)となります。枠自体の大きさはgetBorderInsetsメソッド内で自分で定義している値となります。

Graphicsクラスには色々なメソッドがありますが、例えば下記のようなものを使います。

drawLineメソッド

このグラフィックスコンテキストの座標系の点 (x1, y1) と点 (x2, y2) との
間に現在の色を使って線を描きます。 

パラメータ:
  x1 - 最初の点の x 座標
  y1 - 最初の点の y 座標
  x2 - 2 番目の点の x 座標
  y2 - 2 番目の点の y 座標

fillRectメソッド

指定された矩形を塗りつぶします。矩形の左端と右端はそれぞれ x と x + width - 1 
で、上端と下端はそれぞれ y と y + height - 1 です。これで指定される矩
形は、幅 width ピクセル、高さ height ピクセルの領域です。矩形は、グラ
フィックスコンテキストの現在の色を使って塗りつぶされます。 

パラメータ:
  x - 塗りつぶされる矩形の x 座標
  y - 塗りつぶされる矩形の y 座標
  width - 塗りつぶされる矩形の幅
  height - 塗りつぶされる矩形の高さ

setColorメソッド

このグラフィックスコンテキストの現在の色を、指定された色に設定します。
このグラフィックスコンテキストを使うこれ以降のグラフィック関連操作は、
ここで指定された色を使用します。 

パラメータ:
  c - 新しい描画色

実際に記述するには下記のようになります。

class UserBorder implements Border {
  public void paintBorder (Component c, Graphics g, int x, int y, 
    int width, int height){

    Insets insets = getBorderInsets(c);

    g.setColor(Color.gray);
    g.fillRect(x, y, insets.left, height);
    g.fillRect(x, y, width, insets.top);

    g.setColor(Color.darkGray);
    g.fillRect(x + width - insets.right, y, insets.right, height);
    g.fillRect(x, y + height - insets.bottom, width, insets.bottom);
  }
}

サンプル

では実際に1つボーダーを作成してコンポーネントに定義してみましょう。サンプルプログラムは下記のようになります。

import javax.swing.*;
import java.awt.event.*;
import java.awt.Color;
import java.awt.Insets;
import java.awt.Graphics;
import java.awt.Component;
import javax.swing.border.*;
import java.awt.Dimension;

public class SwingTest extends JFrame{
  public static void main(String[] args){
    SwingTest test = new SwingTest("SwingTest");

    test.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
    test.setVisible(true);
  }

  SwingTest(String title){
    setTitle(title);
    setBounds( 10, 10, 300, 200);

    JPanel p = new JPanel();

    JButton btn1 = new JButton("Tennis");
    btn1.setPreferredSize(new Dimension(100,100));

    JButton btn2 = new JButton("Golf");
    btn2.setPreferredSize(new Dimension(100,100));
    btn2.setBorder(new MyBorder());

    p.add(btn1);
    p.add(btn2);

    getContentPane().add(p);
  }

  /* 自分のBorderクラスを作成 */
  class MyBorder implements Border {
    public Insets getBorderInsets(Component c){
      return new Insets(5, 5, 5, 5);
    }

    public boolean isBorderOpaque(){
      return false;
    }

    public void paintBorder (Component c, Graphics g, 
      int x, int y, int width, int height){

      Insets insets = getBorderInsets(c);

      g.setColor(Color.blue);
      g.fillRect(x, y, insets.left, height);
      g.fillRect(x, y, width, insets.top);

      g.setColor(Color.blue.darker());
      g.fillRect(x + width - insets.right, y, insets.right, height);
      g.fillRect(x, y + height - insets.bottom, width, insets.bottom);
    }
  }
}

実行結果は下記のようになります。

自作のBorder

( Written by Tatsuo Ikura )

関連記事 (一部広告含む)