学生向けプログラミング入門 | 無料

学生向けにプログラミングを無料で解説。Java、C++、Ruby、PHP、データベース、Ruby on Rails, Python, Django

Javaプログラミング入門その34 コンポーネントの利用と配置

>>この記事には書き直した新しいページがあります。<<


<<前  [TOP]  次>>


今まではAWTコンポーネントとして、Canvas、Frameなどを用いてプログラムを作成してきました。
今回からはさらに別のコンポーネントを組み合わせたプログラム制作を行っていきます。


まず、コンポーネントとコンテナの役割を再度確認します。

コンポーネント画面表示でき、ユーザと対話できるグラフィカルな表現を持つ
コンテナ他のコンポーネントを配置できるコンポーネント。
レイアウトマネージャーを使用することで、レイアウトを自由に変更できます。


AWTパッケージのコンポーネント
コンポーネント親クラス説明
ContainerComponent他のコンポーネントを含むコンポーネント
WindowComponentボーダーやメニューバーを持たないウィンドウ
FrameWindowタイトルバーとボーダーを持つトップレベルウィンドウ
DialogWindow確認ウィンドウ
FileDialogDialogファイルを選択するためのダイアログ
PanelContainerコンポーネントの一般的なコンテナ
ScrollPaneContainerスクロールバーつきのコンテナ
CanvasComponentグラフィックスを描画する
LabelComponent文字列を表示する
ButtonComponent動作を実行させる
CheckBoxComponentオンまたはオフの状態を持つ
ChoiceComponentテキストのエントリを含むポップアップメニュー
ListComponentテキストのエントリを含むスクロール可能なリスト
ScrollbarComponent項目をスクロールする
TextComponentComponentTextAreaとTextFieldの基本機能
TextAreaTextComponentスクロール可能な複数行のテキストフィールド
TextFieldTextComponent1行のテキスト入力


「Label」は、1行のテキストを配置するコンポーネントです。
ラベルはテキストを設定することで適当なサイズに設定されます。
ラベルのサイズを設定することで、「CENTER(中央揃え)」「LEFT(左寄せ)」「RIGHT(右寄せ)」でテキストを適当に表示することも出来ます。
「getText()」で設定されているテキストを取得し、「setText(String)」でテキストを設定できます。
ラベルの内容はプログラムでのみ設定できます。

Label label = new Label("ラベル");
String text = label.getText();    //テキスト(「ラベル」)を取得
label.setText("テスト");    //テキスト(「テスト」)に設定



「Button」はラベルつきのボタンです。
「getLabel()」でボタンのラベル(String)を取得でき、「setLabel(String)」でラベルの設定が行えます。

Button button = new Button("ボタン");

ボタンが押されると、processEventを呼び出されActionEventが発生して、ActionListenerに通知されます。
イベント処理は「actionPerformed()」に記述します。

public class Test implements ActionListener {

    /**コンストラクタ*/
    public Test() {
        ・
        ・
        Button button = new Button("ボタン");
        button.addActionListener(this);    //イベント通知の登録
             ・
            ・
    }

    /**Buttonが押された時の処理*/
    public void actionPerformed(ActionEvent evt) {
        //処理
     }
}



「Checkbox」は、選択(「オン」)か選択解除(「オフ」)ができるコンポーネントです。
CheckboxGroupを使用してグループ化することで、グループ内のいずれか一つだけしか選択できないようにすることも可能です。
「オン」「オフ」の状態は「getState()」で取得することが出来ます(返値がtrue=オン、false=オフ)。
また、設定は「setState(boolean)」で設定します(booleanがtrue=オン、false=オフ)。
また、ボタンと同様に「setLabel()」「getLabel()」も使用できます。

//cb1とcb2は同時にオンしたり、オフしたりが可能
Checkbox cb1 = new Checkbox("チェック1");
Checkbox cb2 = new Checkbox("チェック2", true);   //「オン」で生成

//cb3とcb4はどちらかしかオンできない
CheckboxGroup cbg = new new CheckboxGroup();    //グループ化のために生成
Checkbox cb3 = new Checkbox("チェック3", cbg, true);    //初期設定で「オン」
Checkbox cb4 = new Checkbox("チェック4", cbg, true);

Checkboxは「オン」「オフ」が選択されて状態が変わるとItemEventが発生して、ItemListenerに通知されます。
イベント処理は「itemStateChanged()」に記述します。

public class Test implements ItemListener {
    /**コンストラクタ*/
    public Test() {
        ・
        ・
        Checkbox cb = new Checkbox("チェックボックス");
        cb.addItemListener(this);    //イベント通知の登録
     }

    /**Checkboxの項目が変化したときの処理*/
    public void itemStateChanged(ItemEvent evt) {
        //処理
     }
} 



「List」は、テキスト項目のスクロールリストを表します。
選択されていない項目をクリックすると選択状態になり、選択状態の項目をクリックすると選択解除状態になります。
選択項目は設定により、ひとつでも複数項目でも取得できます。
リストへの項目追加は「add(String)」を用います。


選択されている値の取得の一例としては「getSelectIndex()」(返値は項目番号=int)や「getSelectedItem()」(返値は項目文字列=String)があります。
複数項目なら「int getSelectedIndexes()」「String getSelectedItems()」になります。


選択項目を設定するには「Select(int)」を使用します。

Panel p = new Panel();

//単一項目選択で、2項目分表示。複数選択で生成するなら「List(2, true)」
List list = new List(2);
list.add("項目1");
list.add("項目2");
list.add("項目3");
list.select(0);

//Panel(後述)にListを配置。項目はスクロール化され2項目を表示
p.add(list);

項目の変化が起こるとItemEventが発生して、ItemListenerに通知されます。
イベント処理は「itemStateChanged()」に記述します。
また、項目をダブルクリックした場合はActionEventが発生して、ActionListenerに通知されます。
イベント処理は「actionPerformed()」に記述します。


「Choice」は、選択範囲のポップアップメニューです。
選択された項目だけが表示されます。
リストへの追加項目は「add(String)」を用います。
選択されている値はListと同様に「getSelectedIndex()」(返値は項目番号=int)や「getSelectedItem()」(返値は項目文字列=String)などを使用します。

Choice choice = new Choice();
choice.add("項目1");
choice.add("項目2");

項目の変化が起こるとItemEventが発生して、ItemListenerに通知されます。
イベント処理は「itemStateChanged()」に記述します。


「Panel」は、最もシンプルなコンテナで、初期設定のレイアウトマネージャーはFlowLayout(通常は左から右に、表示しきれない場合は上から下へ表示)です。

Panel panel = new Panel();
Label label = new Label("ラベル");
Button button = new Button("ボタン1");

//パネルにコンポーネント(Label, Button)を配置
panel.add(label);
panel.add(button);



「Frame」は、フレームのレイアウトマネージャーはBorderLayout(上=NORTH, 下=SOUTH, 左=WEST,右=EAST, 中央=CENTER)で、通常「add()」するときに設定します。

Frame frame = new Frame("フレーム");
Panel panel = new Panel();
Button button = new Button("ボタン");
frame.add(panel, "Center");    //Centerの位置にpanelを配置
frame.add(button, BorderLayout.NORTH);    //別の記述方法。Northの位置に配置



スクロールバーを実現するにはScrollbarを利用します。
Scrollbarを設定する場合、「スクロールバー方向(垂直、水平)「初期値」「つまみの幅」「最小値」「最大値」の5つの項目を考慮する必要があります。
これら項目は生成時に指定することも出来ますし、「set○○()」で指定することも可能です。
また、「get○○()」で値を取得できます。
実際に取得する最大値は「指定最大値 - つまみ幅」となりますので注意してください。
また、このほかにスクロールバーの移動量は「setUnitIncrement(int)」で設定することが出来ます。

//水平方向のスクロールバーを生成(垂直はVERTICAL)
//初期値は0、つまみ幅は1、最小値は0、最大値は100
Scrollbar scrollbar = new Scrollbar(Scrollbar.HORIZONAL, 0, 1, 0, 100);
scroller.setUnitIncrement(10);    //移動間隔=10

//現在地を取得
int value = scroller.getValue();

Scrollbarは状態が変わるとAdjustmentEventが発生して、AdjustmentListenerに通知されます。
イベント処理は「adjustmentValueChanged()」に記述します。

public class Test implements AdjustmentListener {
    /**コンストラクタ*/
    public Test() {
        ・
        ・
        //この場合は、位置VERTICAL,初期値0、最小値0、最大値100,移動量1、
         //ブロック増分値領域(つまみの両側のトラック部分)が
        //押されたときの移動量(block increment)
         Scrollbar scroller = new Scrollbar();
        scroller.addAdjustmentListener(this);   //イベント通知の登録
             ・
            ・
    }

    /**Scrollbarの値が変化したときの処理*/
    public void adjustmentValueChanged(AdjustmentEvent evt) {
        //処理
     }
}



スクロールペインは配置されたコンポーネントに対して、垂直(水平)のスクロールを付加するコンテナです。
ScrollPaneは配置したコンポーネントの可視領域を適当に制御してくれます。
また、ホールマウスによるホイールも使用可能です(不可にすることも出来ます)。
初期設定では、スクロールバーが必要な場合だけ付加されますが、生成時などに指定することが出来ます。
「SCROLLBARS_ALWAYS=常に表示」「SCROLLBARS_AS_NEEDED=必要な場合に表示」「SCROLLBARS_NEVER=表示しない」


また、それぞれのスクロールバーの情報はScrollPaneのオブジェクトから取得できるjava.awt.ScrollPaneAdjustableクラスで行います。
取得はgetHAdjustable()、getVAdjustable()です。
ただし、最小値などの設定はScrollPane内部で適当に処理されているので再設定などはしないで下さい。

//キャンバスを生成して、サイズを(500, 300)に設定
Canvas canvas = new Canvas();
canvas.setSize(500, 300);

//スクロールペインを生成して、サイズを(200, 100)と水平方向の移動量(10)を設定
ScrollPane scroller= new ScrollPane();
scroller.setSize(200, 100);
scroller.getHAdjustable().setUnitIncrement(10);
scroller.add(canvas);    //canvasを配置



では、以下のサンプルプログラムを作成してみましょう。


【AwtComponentTest.java】

/**
* 各種コンポネートを配置したサンプル
*/

import java.awt.*;
import java.awt.event.*;

public class AwtComponentTest extends Canvas implements ActionListener, ItemListener {

	private Panel panel, cbPanel, zukeiPanel;
	private Button startButton, clearButton, quitButton;
	private Checkbox drawCheckbox, fillCheckbox;
	private List zukeiList;
	private Choice colorChoice;
	private boolean clearFlag;
	private Color color;

	/** コンストラクタ */
	public AwtComponentTest() {

		setSize(400, 300);

		//パネルにラベルとボタンの配置
		panel = new Panel();
		Label label = new Label("Push Button");
		startButton = new Button("Start");
		clearButton = new Button("Clear");
		quitButton = new Button("Quit");
		panel.add(label);
		panel.add(startButton);
		panel.add(clearButton);
		panel.add(quitButton);

		//チェックボックスをグループ化して、パネルに配置
		CheckboxGroup cbg = new CheckboxGroup();
		cbPanel = new Panel();
		drawCheckbox = new Checkbox("Draw", cbg, true);
		fillCheckbox = new Checkbox("Fill", cbg, false);
		cbPanel.add(drawCheckbox);
		cbPanel.add(fillCheckbox);

		//図形を指定するリストを生成し、パネルに配置
		zukeiPanel = new Panel();
		zukeiList = new List(2);
		zukeiList.add("Oval");
		zukeiList.add("Rect");
		zukeiList.select(0);	//一番の項目(oval)を選択した状態にする
		zukeiPanel.add(zukeiList);

		//色を指定するチョイスを生成
		colorChoice = new Choice();
		colorChoice.add("Blue");
		colorChoice.add("Red");
		
		clearFlag = false;
		color = Color.blue;

		//イベントの通知先を登録
		startButton.addActionListener(this);
		clearButton.addActionListener(this);
		quitButton.addActionListener(this);
		drawCheckbox.addItemListener(this);
		fillCheckbox.addItemListener(this);
		zukeiList.addItemListener(this);
		colorChoice.addItemListener(this);
		drawCheckbox.addItemListener(this);
	}

	/** 再描画が必要な場合の処理 */
	public  void update(Graphics g) {
		int x, y, width, height;

		// clearFlagがtrueなら設定色でクリア
		if (clearFlag) {

			g.setColor(Color.green);
			g.fillRect(0, 0, getSize().width, getSize().height);
			clearFlag = false;
			return;
		}

		//メニューで設定された色
		g.setColor(color);
		
		//乱数で図形の位置指定
		x = (int)(Math.random()*400);
		y = (int)(Math.random()*300);
		width = (int)(Math.random()*200) + 10;
		height = (int)(Math.random()*150) + 10;

		// zukeiListの項目文字列で楕円か矩形かをチェック
		// drawCheckboxの状態をチェックして塗りつぶしか否かを決定
		if(zukeiList.getSelectedItem().equals("Oval")) {
		
			if(drawCheckbox.getState()) {

				g.drawOval(x, y, width, height);
			}
			else {
				g.fillOval(x, y, width, height);
			}
		}
		else if (zukeiList.getSelectedItem().equals("Rect")) {
			if(drawCheckbox.getState()) {	
				g.drawRect(x, y, width, height);
			}
			else {
				g.fillRect(x, y, width, height);
			}
		}
	}

	/** プログラム起動時と絵の復活時の処理 */
	public void paint(Graphics g) {

		// paintが呼ばれたときは画面クリア
		g.setColor(Color.green);
		g.fillRect(0, 0, getSize().width, getSize().height);
	}

	/** メニューのイベントを処理 */
	public void actionPerformed(ActionEvent evt) {

		Object obj = evt.getSource();

		if(obj.equals(startButton)) {
			repaint();	//グラフィックス描画
		}
		else if (obj.equals(quitButton)) {
			System.exit(0);		//システム終了
		}
		else if (obj.equals(clearButton)) {
			clearFlag = true;
			repaint();
		}
	}

	/** itemの状態が変更された場合のイベント処理*/
	public void itemStateChanged(ItemEvent evt) {
		Object obj = evt.getSource();

		if (obj.equals(zukeiList)) {

			repaint();
		}
		else if(obj.equals(colorChoice)) {

			//項目番号でチェック
			if (colorChoice.getSelectedIndex() == 0) {

				color = Color.blue;
			}
			else {

				color = Color.red;
			}
		}
	}

	/** main() */
	public static void main(String[] args) {

		AwtComponentTest draw = new AwtComponentTest();
		MyFrame frame = new MyFrame("ComponentTest");

		//フレームにコンポーネント(コンテナ)を配置
		frame.add(draw, "Center");
		frame.add(draw.panel, "North");
		frame.add(draw.cbPanel, "South");
		frame.add(draw.zukeiPanel, "West");
		frame.add(draw.colorChoice, "East");
		frame.pack();
		frame.setVisible(true);
	}
}



実行してみます。
前回作成した[MyFrame.java]を利用していますのでクローズボタンを使って終了できます。
各項目を選択して、「start」を押すとキャンバスに選択した図形がランダムな位置に表示されます。
ただし、OvalとRectは選択しただけで描画されてしまいます。
「clear」を押すとキャンバスがクリアされます。
「Quit」を押すとプログラムが終了します。








もう一つ、Scrollbarで画面をスクロール表示させるサンプルプログラムを作ってっみましょう。


【AwtScrollbarTest.java】

/**
*画面をスクロール表示する
*/

import java.awt.*;
import java.awt.event.*;

public class AwtScrollbarTest extends Canvas implements AdjustmentListener {

	private Scrollbar scroller;
	private Panel panel;
	private Image image;
	private int x;

	/** コンストラクタ */
	public AwtScrollbarTest() {

		//イメージ表示用のx座標
		x=0;

		MediaTracker tracker = new MediaTracker(this);
		Toolkit tk = Toolkit.getDefaultToolkit();

		image = tk.getImage("contents01.jpg");
		tracker.addImage(image, 0);


		try {

			tracker.waitForAll();
		}
		catch (InterruptedException ex) {

			System.err.println(ex);
			System.exit(1);
		}

		//Canvas のサイズ(400, 300)にする
		setSize(400, 300);

		//Scrollbarを生成
		//水平方向、初期値=0、つまみ(bubble,thumb)幅=1、
		//最小値=1、最大値はイメージの幅
		scroller = new Scrollbar(Scrollbar.HORIZONTAL, 0, 1, 0, image.getWidth(this));

		scroller.setUnitIncrement(10);	//移動間隔=10
		
		// Panelを生成後、Scrollbarを配置
		panel = new Panel();
		panel.add(scroller);

		//イベント通知登録
		scroller.addAdjustmentListener(this);
	}

	/**プログラム起動時と絵の復活時の処理*/
	public void paint(Graphics g) {
		g.drawImage(image, x, 0, this);
	}

	/**スクロールバーが変化したときの処理*/
	public void adjustmentValueChanged(AdjustmentEvent evt) {
		System.out.println(scroller.getValue());
		x = -(scroller.getValue());	//xをマイナス領域へ
		repaint();
	}

	/**main()*/
	public static void main(String[] args) {

		AwtScrollbarTest canvas = new AwtScrollbarTest();
		MyFrame frame = new MyFrame("ScrollbarTest");
		frame.add(canvas, "Center");
		frame.add(canvas.scroller, "South");
		frame.pack();
		frame.setVisible(true);
	}
}



なお、このプログラムを実行するには、「contents01.jpg」ファイルが必要になります。
[contents01.jpg]


では、実行してみます。
[MyFrame.java]を利用していますのでクローズボタンを使って終了できます。
フレーム内に画像が表示されます。
画像のサイズがフレームのサイズより大きいので、横に移動するスクロールバーが付いています。
コマンドプロンプト上にスクロールバーの位置が表示されます。








最後に、ScrollPaneで画面をスクロール表示するサンプルプログラムを作ってっみましょう。


【AwtScrollPaneTest.java】

/**
*画像をスクロール表示する
*/

import java.awt.*;

public class AwtScrollPaneTest extends Canvas {

	private ScrollPane scroller;
	private Image image;

	/**コンストラクタ*/
	public AwtScrollPaneTest() {

		MediaTracker tracker = new MediaTracker(this);
		Toolkit tk = Toolkit.getDefaultToolkit();

		image = tk.getImage("contents01.jpg");
		tracker.addImage(image, 0);

		try {

			tracker.waitForAll();
		}
		catch (InterruptedException ex) {

			System.err.println(ex);
			System.exit(1);
		}

		//画像の大きさに合わせて、Canvasのサイズを決定
		setSize(image.getWidth(this), image.getHeight(this));

		//ScrollPaneを(400, 300)の大きさで生成
		scroller = new ScrollPane();
		scroller.setSize(400, 300);

		//水平方向のUnitIncrementを設定
		scroller.getHAdjustable().setUnitIncrement(10);
		scroller.add(this);	//ScrollPaneにCanvasを配置
	}

	/** プログラム起動時と絵の復活時の処理*/
	public void paint(Graphics g) {

		g.drawImage(image, 0, 0, this);
	}

	/**main()*/
	public static void main(String[] args) {

		AwtScrollPaneTest canvas = new AwtScrollPaneTest();
		MyFrame frame = new MyFrame("ScrollPaneTest");
		frame.add(canvas.scroller, "Center");
		frame.pack();
		frame.setVisible(true);
	}
}



このプログラムを実行するためにも「contents01.jpg」ファイルが必要になります。
[contents01.jpg]


では実行してみます。
[MyFrame.java]を利用していますのでクローズボタンを使って終了できます。
フレーム内に画像が表示されます。
画像のサイズがフレームのサイズより大きいので、横に移動するスクロールバーが縦と横に付いています。








<<前  [TOP]  次>>