演習2-1 GUIプログラミングの基礎のバックアップ(No.3)

TopPage > 演習課題 > 演習2-1 GUIプログラミングの基礎

GUIプログラミングの基礎 †

まず，下記のプログラムをダウンロードしてください．

GuiTest.java ダウンロード／ソースコードファイルを見る

↑

コンパイル＆実行 †

javacを使って，普通にコンパイルしてください．

コンパイルが終わったら実行します．実行すると，図1に示すメインウィンドウが表示されます．

図1. メインウィンドウ

メインウィンドウには，0から4までの番号が振られた，正方形のボタン(JButton)が５つ配置されています．

実行を終了するには，ウインドウを消すか，コマンドプロンプトの方で[Ctrl]+Cを入力します．

↑

説明 †

このプログラムは，GUI(Graphical User Interface)の基本的な機能を実装したものです．

プログラム中には，クラスが１つだけ(GuiTest)実装されています．このクラスは，JFrameというウィンドウの基となるクラスの性質を継承(extends)することで，少ないコード量でGUIプログラムを作成することが可能になっています．

少し詳しく見てみましょう．

1～6行目：import文．(C言語での#includeのようなもの)．
8行目：　GuiTestクラスの宣言．JFrameクラスを継承している．
```
public class GuiTest extends JFrame {
```
9～10行目：「ボタン(JButton)コンポーネント」と，コンテナ変数の宣言．
12～28行目：（関数）「コンストラクタ」と呼ばれるGuiTestクラスを初期化するときに呼ばれる関数．

15～16行目：ウィンドウのタイトル名(setTitle)，サイズ(setSize)を設定する．

this.setTitle("Gui Test");	//ウィンドウのタイトルを設定する
this.setSize(400,400);		//ウィンドウのサイズを設定する

17行目：ウィンドウの「コンテナ」を取得する．

c = this.getContentPane();	//フレームのペインを取得する

21行目：５個の要素を持つJButtonオブジェクトの配列を初期化する．

buttonArray = new JButton[5];	//ボタンの配列を５個作成する[0]から[4]まで使える

22～26行目：各JButton要素に対して，インスタンスの作成(23行目)，コンテナへの登録(24行目), JButton要素の場所と大きさの設定(25行目)を行う．

for(int i=0;i<5;i++){
  buttonArray[i] = new JButton(Integer.toString(i));//ボタンに数値を設定
  c.add(buttonArray[i]);//ペインに貼り付ける
  buttonArray[i].setBounds(i*45,10,45,45);//ボタンの大きさと位置を設定
}

30～33行目：プログラムのうち最初に実行されるメソッド．
ここでGuiTestクラスのインスタンスを作成する．
```
public static void main(String[] args) {
  GuiTest gui = new GuiTest();
  gui.setVisible(true);
}
```

GUIプログラミングの特徴は，

Frame(ウィンドウなど)を作成して，Containerを取得する．
Component(コンポーネント，コントロール)と呼ばれる「部品」を生成して，
Container(コンテナ)に登録するという流れになります．

↑

Javaのオブジェクト指向プログラミング †

Javaのオブジェクト指向の概説を軽く読んでください．

↑

練習 †

（１）表示されるボタン(JButton)のサイズを50x50に変更してください．

（２）メインウィンドウのサイズを450x450に変更してください．

（３）メインウィンドウ上に表示されるボタンの数を増やし，図2のように８ｘ８のタイルを描画してください．
　　　ヒント：for文を二つ重ねて使ってみましょう．(x軸方向とy軸方向用)
　　　　　　　自動オセロを作る人は，二次元配列にしておくと後が楽です．

図2. 8x8のボタンタイル

次の演習(2-2)

演習2-1 GUIプログラミングの基礎 のバックアップ(No.3)

GUIプログラミングの基礎 †

コンパイル＆実行 †

説明 †

Javaのオブジェクト指向プログラミング †

練習 †