プログラミング演習3

プログラミング演習３
第２回 GUIの復習
そもそもGUIとはなにか？
GUI(Graphic User Interface)とは、マウスなどの
デバイスとCGを用いて、人が直感的に機械を操
作できる環境のこと
↑プログラミング入門で扱った
プログラムのGUI
JavaによるGUIアプリケーション
JavaでGUIアプリケーションを作成するにはSwingというGUIコン
ポーネントを使うのが主流です
Swingでは、フレームというウィンドウを生成しそこにボタンやラ
ベルなどのコンポーネントを追加することでGUIを作っていきま
す
メニュー
ラベル
ボタン
パネル
スクロールバー
(図形の描画)
GUIコンポーネントの階層
javax.swingパッケージ中のSwingコンポーネント
は以下の３階層に分類される JMenuBar
トップレベルコンテナ（JFrame等）
メインウィンドウとなる土台の役割
JPanel
中間コンテナ（JPanel等）
コンポーネント配置のためのコンテナの役割
コントロール（JLabel、JButton等）
ボタンやラベルなどのGUIコンポーネント
JScrollPane
Swingではこれらの階層のコンポーネントを組み合
わせて作成する
4
フレームの作成
早速プログラミングをはじめましょう
フレームを作るには、import javax.swingをインポートして、JFrameを継承しな
ければなりません
コンポーネントの配置が終わっ
てからsetVisible(true)で表示
ラベルの表示
画像はJavaファイルと
同じ場所に置く
FlowLayout（）は左上から順に配置するレイアウト
l0, l1, l2の順で追加
レイアウト
追加したコンポーネントを配置するためにFlowLayoutなどのレイ
アウトマネージャが用意されている
GridLayout(n,m)：格子状に配置
縦に３つ、横に１つ
配置
BorderLayout：東西南北に配置
North,South,East,
West,Centerの
どれかを指定す
る
パネル
パネルをうまく使うと複雑な
レイアウトを設定できます
p1
フレームのレイアウト
各パネルにもレイアウト
の設定を行う
フレームに各パネルの追加
p2
イベント処理
フレームにコンポーネントを配置するだけでは、機能を持たない
↓
コンポーネントが何のイベントを受け取るのか指定することにより、GUIに機能を持た
せることができる
イベントを受け取った際の処理をリスナーと呼ばれるクラスに記述することにより、イ
ベントを処理する
Button object(s)
ActionEvent
ActionEvent
クリック！
ActionListener
イベント処理の例
イベントを受け取りたいコンポーネントにリス
ナー(ボタンの場合はActionListener)を指定
この場合b1以外はリスナーが指定されていな
いので押しても何も起こらない
イベントを発生した時に行う処理を書く
ダイアログ
ユーザに対して緊急性のあ
るメッセージを表示する際に
ダイアログが使われます
クリック！
trueにするとダイアログを閉じない限り
プログラムを終了できない
図形の描画
図形の描画はJPanelクラスを継承し、paintComponentメソッドを
オーバーライドする
始めにsuper.paintComponentメソッドを呼び、その後ろに描画処
理を書く
このコンポーネントをJFrame内に描画領域としてレイアウトする
class ClassA extends JPanel{
/*略*/
class ClassB extends JFrame{
ClassA gp;
@Override
public void paintComponent(Graphics g) {
//これは必須
super.paintComponent(g);
/* 描画の処理 */
}
public ClassB() {
//レイアウトの設定
gp = new ClassA();
add(gp);
/*略*/
}
図形の描画のサンプル
JFrame側のコード
JPanel側のコード
図形の再描画
再描画する場合はrepaintメソッドを呼び出す
ボタンを押すと○の位置が変わるプログラム
クリックの検知
クリックされたかどうかを検
出するにはMouseListenerを
使う。このアプリでは、フレー
ム上でクリックするとコン
ソールに文字が表示される
演習
ボタンを使ってユーザに４桁の番号を入力させ、パス
ワード(1111)とマッチしたかどうかを表示するダイアロ
グを表示するアプリを作ってみましょう
数字ボタンをクリックする
と上部に押した番号が表
示される
入力例
正しい場合
クリアを押すと押した
番号は消去される
決定を押すとパスと
入力した番号を比較
しダイアログを表示
異なる場合
課題2
1. クリックしたところの座標を取得しコンソール
に表示してみましょう
ヒント：getPointメソッドで座標を取得出来ます
Point p = e.getPoint();
int x = p.x;
int y = p.y;
座標情報を持つクラス
java.awt.Point
課題2
2.
１回目で作ったSmallCircleのdrawメソッドを呼び出し、”SmallCircleを<ク
リックした座標>に描画”とコンソール出力してみましょう
※パッケージ名は特に指定しない
3.
クリックしたところに１回目で作成したSmallCircleを描画してみましょう
ヒント：図形のdrawメソッドも書き
換える必要があります

Download Report