6. レイアウトマネージャ

基本的なレイアウトについて説明します。

(1) 部品配置の基本ルール

 Java ではレイアウトを指定して部品を配置します。レイアウトを指定するためのメソッドは Container クラスの

setLayout(LayoutManager m)

 というメソッドです。引数が LayoutManager 型になっていますが、 この LayoutManager とはインタフェースです。 つまり、LayoutManager インタフェースを実装したクラスであれば、指定することができるという意味です(入門編18章参照)。

 このメソッドを見てもわかるように、レイアウトはクラスとして表現されます。レイアウトの基本として FlowLayout、BorderLayout、GridLayout の3種類を見ていきますが、これらはすべてクラスの名前で、 LayoutManager インタフェースを実装しています。

 レイアウトを設定するには、これらのレイアウトクラスのオブジェクトを生成し、setLayout の引数に指定します。

(2) FlowLayout は左から右へ流れます

 まず1つ目は FlowLayout です。このレイアウトは部品をコンテナに追加した順に左から右へ置いていきます。GUI 部品を使うので java.awt パッケージのインポートをします。また、ボタンの作り方の詳細は後の章で解説します。

  実行例  (画像をクリックすると実際の FlowLayoutTest のアプレットが起動します)

FlowLayoutTest



  FlowLayoutTest.java

import java.awt.*;
import java.applet.Applet;

public class FlowLayoutTest extends Applet {
    public void init() {
        // レイアウト設定
        FlowLayout fl = new FlowLayout();
        setLayout(fl);
        
        // ボタン生成
        Button b1 = new Button("ぼたん1");
        Button b2 = new Button("ぼたん2");
        Button b3 = new Button("ぼたん3");
        
        // アプレット(コンテナ)に追加
        add(b1);
        add(b2);
        add(b3);
    }
}


  FlowLayoutTest.html

<APPLET CODE=FlowLayoutTest.class width=300 height=100>
</APPLET>

 今回はアプレットがコンテナになります。 Applet クラスは Container クラスのサブクラスです。このコンテナに部品を追加するには、スーパークラスの Component クラスにある、
add(Component c)

 という形式のメソッドを使います。表示されるアプレットの大きさを変えてみましょう。 小さくなった場合でも、改行はされますが、左から右のルールは守られていることがわかります。


(3) BorderLayout の置く場所

 次は BorderLayout です。このレイアウトは部品を上下左右と真ん中の5つの位置に、場所を指定して配置します。  上(North)、下(South)、左(West)、右(East)、真ん中(Center)となります。部品を配置するときは、位置を指定する add メソッドを使います。

  実行例  (画像をクリックすると実際のアプレットが起動します)



  BorderLayoutTest.java

import java.awt.*;
import java.applet.Applet;

public class BorderLayoutTest extends Applet {
    public void init() {
        // レイアウト設定
        BorderLayout bl = new BorderLayout();
        setLayout(bl);
        
        // ボタン生成
        Button b1 = new Button("North");
        Button b2 = new Button("South");
        Button b3 = new Button("West");
        Button b4 = new Button("East");
        Button b5 = new Button("Center");
        
        // アプレット(コンテナ)に追加
        add(b1,"North");
        add(b2,"South");
        add(b3,"West");
        add(b4,"East");
        add(b5,"Center");
    }
}


  BorderLayoutTest.html

<APPLET CODE=BorderLayoutTest.class width=250 height=100>
</APPLET>

 1つの場所には1つのコンポーネントしか置けません。例題はすべての位置に部品を置きましたが、どれか1つ部品を置かなかった場合、どんな表示になるか試してみてください。


(4) GirdLayout はマス目上に配置

 最後は GridLayout です。これは行数、列数を指定してマス目上に部品を配置します。コンストラクタは、
GridLayout(int row,int col)

 です。1つ目の引数で行数、2つ目で列数を指定します。配置の順番は左から右、指定した列数分右へ行くと、次の行に行きます。

  実行例  (画像をクリックすると実際のアプレットが起動します)



  GridLayoutTest.java

import java.awt.*;
import java.applet.Applet;

public class GridLayoutTest extends Applet {
    public void init() {
        // レイアウト設定
        GridLayout gl = new GridLayout(3,2);
        setLayout(gl);
        
        // ボタン生成
        Button b1 = new Button("ぼたん1");
        Button b2 = new Button("ぼたん2");
        Button b3 = new Button("ぼたん3");
        Button b4 = new Button("ぼたん4");
        Button b5 = new Button("ぼたん5");
        
        // アプレット(コンテナ)に追加
        add(b1);
        add(b2);
        add(b3);
        add(b4);
        add(b5);
    }
}


  GridLayoutTest.html

<APPLET CODE=GridLayoutTest.class width=250 height=100>
</APPLET>



(5) 複雑なレイアウトのとき

 下のコンポーネント配置を見てください。このレイアウトは今までの3種類のどれにも属さないレイアウトです。

  実行例  (画像をクリックすると実際のアプレットが起動します)




 このように1つのレイアウトだけでは実現できないものは、パネルというコンポーネントとレイアウトの組み合わせで実現します

 パネルは Panel クラスを使います。これは目には見えないコンテナです。複雑なレイアウトをする場合、まずはパネルに部品を追加し、その後でパネルごとコンテナに追加するという方法を使います。

 パネルはコンテナですからそれぞれにレイアウトの指定が可能です。例題では、まずアプレットに BorderLayout を適用します。 BorderLayout の1つの場所には1つのコンポーネントしか 置けませんから、Center の位置には Panel を1つ用意し、ここにボタンを2つ追加し、パネルごと Center の位置に追加します。このとき、パネルには FlowLayout を適用しておきます。

  MixLayoutTest.java

import java.awt.*;
import java.applet.Applet;

public class MixLayoutTest extends Applet {
    public void init() {
        // パネル作成
        Panel panel1 = new Panel();
		
        // ボタン作成
        Button b1 = new Button("1");
        Button b2 = new Button("2");
        Button b3 = new Button("3");
        Button b4 = new Button("4"); 
        Button b5 = new Button("5");
		
        // レイアウト設定
        setLayout(new BorderLayout());
        panel1.setLayout(new FlowLayout());
        
        // コンポーネント追加
        panel1.add(b4);
        panel1.add(b5);
        add(b1,"North");
        add(b2,"West");
        add(b3,"East");
        add(panel1,"Center");
    }
}


  MixLayoutTest.html

<APPLET CODE=MixLayoutTest.class width=250 height=100>
</APPLET>


前の章(5.AWTとは?)   次の章(7.イベント処理)