はじめに
今回は、コンポーネントの表示について考えてみることにしましょう。Swingのコンポーネントは、AWTのように完成されたものがそのまま表示されるわけではなく、非常に多くの要素によって構成されています。それらを個別に設定していくことで、表示を自由にカスタマイズできます。
単純に、前景色・背景色、表示フォントといったものを変えるのなら、おそらく誰でもできるでしょう。これらはAWTとほとんど同じですから、迷うことはまずありません。けれど、それだけで終わっていたのでは、ちょっともったいない。もう一歩進んで、「ボーダー」や「ルックアンドフィール」などについても自由に操作できるようになりたいものです。
対象読者
- Javaの基本機能は一通り覚えた、というビギナーを卒業しかけている人。
- Swingはマスターした？ といわれると、ちょっと自信がない人。
- これからはクライアントサイドが注目されると信じる人。
ボーダー、変えられますか？
Swingの利点は、AWTよりもはるかに柔軟であるという点です。AWTのコンポーネントは決まりきった表示しかできませんが、Swingでは自由に表示を変えられます。――と、わかってはいても、実際に「GUIをカスタマイズ」したことありますか？ デフォルトのコンポーネントのまま使ったことしかない人が圧倒的ではないでしょうか。
まずは、ボーダーからです。実際にボーダーを変更してみることにしましょう。
package jp.codezine; import java.awt.*; import javax.swing.*; import javax.swing.border.*; public class SampleApp extends JFrame { private static final long serialVersionUID = 1L; public SampleApp(){ this.setSize(new Dimension(200,200)); this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); GridLayout layout = new GridLayout(3,1); layout.setHgap(5); layout.setVgap(5); this.setLayout(layout); for(int i = 0;i < 3;i++){ JButton btn = new JButton("button" + i); btn.setFont(new Font("Serif",Font.PLAIN,18)); BevelBorder border = new BevelBorder(BevelBorder.RAISED, new Color(255,200,200),new Color(100,100,200)); btn.setBorder(border); this.add(btn); } } public static void main(String[] args) { new SampleApp().setVisible(true); } }
これは、BevelBorderというボーダーを作成してJButtonに組み込んだ例です。BevelBorderは、コンポーネントの周辺部のベベル（立体感を出すため斜めに表示された部分）を持ったボーダーです。インスタンス作成時に、凸か凹か、光が当たっている側と当たっていない側の色をそれぞれ設定することができます。作成したボーダーは、そのままコンポーネントにsetBorderで組み込むだけで使えるようになります。
さまざまなボーダーを使ってみる
ボーダーのクラスは標準でいくつも用意されていますから、それらを使えるようになるだけでもGUIの表現はずいぶんと広がるでしょう。一例として、もう少し違ったボーダーの例を挙げておきましょう。
package jp.codezine; import java.awt.*; import javax.swing.*; import javax.swing.border.*; public class SampleApp extends JFrame { private static final long serialVersionUID = 1L; public SampleApp(){ this.setSize(new Dimension(200,200)); this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); GridLayout layout = new GridLayout(3,1); layout.setHgap(5); layout.setVgap(5); this.setLayout(layout); for(int i = 0;i < 3;i++){ JButton btn = new JButton("button" + i); btn.setFont(new Font("Serif",Font.PLAIN,18)); Border border = new MatteBorder(new Insets(1,5,3,10), new Color(255,100,100)); btn.setBorder(border); this.add(btn); } } public static void main(String[] args) { new SampleApp().setVisible(true); } }
これは、MatteBorderというボーダーを利用したサンプルです。このMatteBorderは、特定の色で塗りつぶしたボーダーです。作成時に上下左右のボーダー幅を示すInsetsと色を指定することで、コンポーネントの周りを決まった色で縁取ることができます。
では、「ボーダーをなくしたい」と言うときは？ これは「EmptyBorder」というものを利用すれば可能です。このボーダーは、大きさとなるInsetsを指定してnewするだけの非常に単純なものです。
public SampleApp(){ this.setSize(new Dimension(200,200)); this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); GridLayout layout = new GridLayout(3,1); layout.setHgap(5); layout.setVgap(5); this.setLayout(layout); for(int i = 0;i < 3;i++){ JButton btn = new JButton("button" + i); btn.setFont(new Font("Serif",Font.PLAIN,18)); Border border = new EmptyBorder(new Insets(0,0,100,30)); btn.setBorder(border); this.add(btn); } }
これで、ボーダーのないボタンが作成できます。ちょっと面白いのは、ボーダーがなくなると、表示されるテキストも消えてしまうという点です。表示テキストもボーダーの一部として扱われているのです。
この他にも、ボーダークラスは用意されていますので、興味ある方は一度調べてみましょう。ボーダーが変わるだけでも、GUIの雰囲気はがらりと変わるものですよ。
