プログラミング演習３第２回 GUIの復習そもそもGUIとはなにか？ GUI(Graphic User Interface)とは、マウスなどのデバイスとCGを用いて、人が直感的に機械を操作できる環境のこと ↑プログラミング入門で扱ったプログラムのGUI JavaによるGUIアプリケーション JavaでGUIアプリケーションを作成するにはSwingというGUIコンポーネントを使うのが主流です Swingでは、フレームというウィンドウを生成しそこにボタンやラベルなどのコンポーネントを追加することでGUIを作っていきますメニューラベルボタンスクロールバーパネル (図形の描画) GUIコンポーネントの階層 javax.swingパッケージ中のSwingコンポーネントは以下の３階層に分類される JMenuBar トップレベルコンテナ（JFrame等）メインウィンドウとなる土台の役割中間コンテナ（JPanel等）コンポーネント配置のためのコンテナの役割コントロール（JLabel、JButton等） JPanel ボタンやラベルなどの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にするとダイアログを閉じない限りプログラムを終了できない図形の描画 Swingでは、図形を描画する際にpaintComponentメソッドをオーバーライドし、始めに親クラスのメソッドを呼ぶ JframeはJComponentの子クラスではないので通常はJPanelに描画してJframeに追加する class ClassA extends JComponent{ /*略*/ @Override public void paintComponent(Graphics g) { //これは必須 super.paintComponent(g); /* 描画の処理 */ } 似た名前の ”paintComponents”というメソッドとの混同に注意図形の描画のサンプル Jframe側のコード JPanel側のコード図形の再描画再描画する場合はrepaintメソッドを呼び出すボタンを押すと○の位置が変わるプログラムクリックの検知クリックされたかどうかを検出するにはMouseListenerを使う。このアプリでは、フレーム上でクリックするとコンソールに文字が表示される演習ボタンを使ってユーザに４桁の番号を入力させ、パスワード(1111)とマッチしたかどうかを表示するダイアログを表示するアプリを作ってみましょう数字ボタンをクリックすると上部に押した番号が表示される入力例正しい場合クリアを押すと押した番号は消去される決定を押すとパスと入力した番号を比較しダイアログを表示異なる場合 Homework 1. クリックしたところの座標を取得しコンソールに表示してみましょうヒント：getPointメソッドで座標を取得出来ます Point p = e.getPoint(); int x = p.x; int y = p.y; 座標情報を持つクラス java.awt.Point Homework 2. １回目で作ったSmallCircleのdrawメソッドを呼び出し、”SmallCircleを<クリックした座標>に描画”とコンソール出力してみましょう ※パッケージ名は特に指定しない 3. クリックしたところに１回目で作成したSmallCircleを描画してみましょうヒント：図形のdrawメソッドも書き換える必要があります