Prog1_12th

Similar documents
Prog1_12th

Prog2_11th

<4D F736F F F696E74202D AC C8899E D834F E >

ガイダンス

ガイダンス

10/31 Java AWTの基本構造(Frameクラスの継承) 演習課題資料

ガイダンス

PowerPoint Presentation

Java言語 第1回

< F2D E E6A7464>

awt の主要なクラスを下記に示す クラス Component Container Button Label Panel Frame 説明画面にユーザインターフェイス要素として表示し, ユーザとのやり取りを行うコンポーネントを表すすべてのコンポーネントのスーパークラスになる ほかのコンポーネントを含

< F2D B838A835882CC8CF68EAE2E6A7464>

Prog1_15th

< F2D834F838C A815B A CC>

< F2D B825082CC96E291E82E6A7464>

Microsoft PowerPoint - OOP.pptx

Java言語 第1回

Java言語 第1回

GUIプログラムⅣ

< F2D82518E9F8AD CC95BD8D7388DA93AE2E6A7464>

PowerPoint Presentation

< F2D82518E9F8AD CC834F CC8CFC82AB82C68D4C>

text_12.dvi

Assignment_.java /////////////////////////////////////////////////////////////////////// // 課題 星の画像がマウスカーソルを追従するコードを作成しなさい 次 ///////////////////

< F2D A838B838D96402E6A7464>

Prog2_9th

ガイダンス

ガイダンス

< F2D89BA8EE882C E6A7464>

Microsoft Word - Java3.DOC

Prog1_6th

Prog1_3rd

< F2D8EA CE909482CC92EA82852E6A7464>

< F2D A839382CC906A2E6A7464>

ÿþ˜u#u·0¹0Æ0à0

< F2D F B834E2E6A7464>

問1

< F2D92DE82E8914B82CC977088D32E6A7464>

< F2D82B682E182F182AF82F12E6A7464>

Prog2_9th

Prog1_10th

GUI プログラミング第 4 Graph ~ 手書認識と関数グラフ描画 ~ マウスで数式を書いて認識し 関数グラフを描画する < 手書認識とグラフ描画のステップ> ステップ 1_1 フレームの作成 ステップ 1_2 マウスで自由に線を書く ステップ 2-1 手書認識認識結果を標準出力する ステップ

GUIプログラムⅤ

< F2D82518CC282CC D2E6A7464>

Prog2_10th

PowerPoint プレゼンテーション

< F2D825282CC947B909482CC A815B83682E6A>

次の演習課題(1),(2)のプログラムを完成させよ

Prog2_12th

アジェンダ 1 グラフィカルなインタフェース GUI(Graphical User Interface) の基礎 2 Swing を利用する Swing の基礎知識 2

Microsoft PowerPoint - swing3.ppt

ウィンドウの構成ウィンドウはタイトルバーとウィンドウ枠からなります タイトルバーには最小化 / 最大化ボタンや閉じるボタンがあります また ウィンドウはクライアント領域をもちます クライアント領域にはボタンなど GUI 部品が配置されます GUI 部品配置 ( レイアウト ) ウィンドウ ( ステー

PowerPoint プレゼンテーション

Microsoft PowerPoint - OOP.pptx

Prog1_2nd

HCI プログラミング 8 回目ボタン チェックボックス ラジオボタン 今日の講義で学ぶ内容 ボタンとアクションイベント ボタンのカスタマイズ チェックボックスとラジオボタン ボタンとアクションイベント 1 ボタンを配置してみましょう ボタンは ラベルと同じようにフォントやその色 画像の貼り付けなど

PowerPoint プレゼンテーション

以下に java.awt.graphics クラスの主なメソッドを示す (Graphics クラスの ) メソッド drawline(int x1, int y1, int x2, int y2) drawrect(int x, int y, int width, int height) fillr

Microsoft PowerPoint ppt

HCI プログラミング 5 回目ウィンドウに画像を表示してみよう 今日の講義で学ぶ内容 画像の表示 画像のエフェクト 画像のビューポート指定 画像の表示 1 画像を表示してみましょう 画像の表示はクラス ImageView により管理されます ソースファイル名 :Sample5_1.java //

HCI プログラミング 10 回目テキストフィールドとキーイベント 今日の講義で学ぶ内容 テキストフィールドの利用 キーイベントの処理 テキストフィールドの利用 1 テキストフィールドを配置してみましょう テキストフィールドを用いることにより 数値や文字列などのデータ入力が可能になります ソースファ

メディプロ1 Javaプログラミング補足資料.ppt

Javaの作成の前に

Java 2 - Lesson01

アプレットⅣ

PowerPoint プレゼンテーション

GUIプログラムⅡ

JAVA入門

Prog1_13th

JavaプログラミングⅠ

2 static final int DO NOTHING ON CLOSE static final int HIDE ON CLOSE static final int DISPOSE ON CLOSE static final int EXIT ON CLOSE void setvisible

2

Microsoft PowerPoint - swing2.ppt

第1章 ビジュアルプログラミング入門

PowerPoint プレゼンテーション

Microsoft PowerPoint - prog03.ppt

JavaプログラミングⅠ

Microsoft PowerPoint Java基本技術PrintOut.ppt [互換モード]

Prog1_11th

public class Kadai _02 { public static void main(string[] args) { MyFrame frame = new MyFrame("Kadai _02"); (2) フレームのクラス名は MyFrame とし 以下

Java言語 第1回

プログラミング基礎I(再)

IE6 2 BMI chapter1 Java 6 chapter2 Java 7 chapter3 for if 8 chapter4 : BMI 9 chapter5 Java GUI 10 chapter6 11 chapter7 BMI 12 chap

JavaプログラミングⅠ

Object MenuComponent MenuBar MenuItem Menu CheckboxMenuItem

ブロック崩し Step1 矢印キーで左右に動かせるパドルを描画する < パドルの表現方法 > パドルは java.awt パッケージの Rectangle という Java が用意しているクラスを使う これは四角形を表すクラスで 左上の点の座標と幅 高さをもっている (x, y) Rectangle

Javaプログラムの実行手順

State 特徴ときどきの状態に合わせて動作の内容を変更するパターン各状態を異なるクラスで表現し, クラスを切り替えることにより状態を変化させるパターンクラス図 Context State requestx( ) requesty( ) requestz( ) State methoda( ) me

PowerPoint プレゼンテーション

プログラミング入門1

text_13.dvi

Java - Visual Editor

(Microsoft PowerPoint - \223\306\217KJAVA\221\346\202R\224\ ppt)

Microsoft PowerPoint - prog12.ppt

2

Microsoft PowerPoint ppt

最初に

Microsoft Word - Java3.DOC

メソッドのまとめ

// ステージを設定します stage.setscene(scene); stage.settitle(" キャンバス "); // ステージを表示します stage.show(); public static void main(string[] args) launch(args); キャンバス

Transcription:

2018 年 7 月 5 日 ( 木 ) 実施 GUIプログラミング今回の授業では,Java 言語での GUI(Graphical User Interface) プログラミングの基礎について学習する GUIツールキット Java 言語では,GUI プログラミング用のツールキットとして, 次のものが用意されている 1) AWT(Abstract Window Toolkit) 2) Swing AWT は Java 言語の当初から実装されていた標準の GUI ツールキットで,OS のネイティブな GUIコンポーネント (GUI を構成するパーツ, ウィジェット ) を利用するため, 扱いが容易で動作が速い半面, 実行環境による制約がある Swing は Java 言語で実装された GUI ツールキットであるので, 実行環境には依存しないが, 動作が遅くなる Eclipse では両者の長所を生かした SWT(Standard Widget Toolkit) が提供されている これは Java 言語の標準ではないが,Eclipse をインストールしていない環境にも SWT のみを導入することが可能である 今回は,AWT を用いた GUI プログラミングについて学ぶ インタフェース AWT には, インタフェースという, 実装の無いクラスが多用されている ここで, 実装とは, 枠組みだけが定義されているものに, 中身を与えることである インタフェースはクラスの階層にとらわれずに実装が可能であるが, 記述出来る内容は定数フィールドと抽象メソッドに限られる ここで, 抽象メソッドとは, インタフェースを実装したクラスの中で必ずオーバーライドしなければならないメソッドである インタフェースの定義の一般形は次のようになる 修飾子 interface インタフェース名 { 型フィールド名 ; 戻り値のデータ型メソッド名 ( 引数 ); インタフェースでは明示しなくても, 全てのフィールドは public static final の修飾子を付けた扱いとなる また, 全てのメソッドは public abstract の修飾子を付けた扱いとなり, その処理の定義は記述しないので, ブロックにはならず, セミコロンを必要とする なお, インタフェースは直接インスタンス化することが出来ないので, コンストラクタを宣言 - 1 -

することは出来ない ( インタフェースを実装するクラスには, コンストラクタを宣言出来る ) インタフェースを実装するクラスは,implements( 実装 ) により, 次の様に定義する ( コンス トラクタを用いる場合 ) 修飾子 class クラス名 implements インタフェース名 1 [, インタフェース名 2, ]{ 型フィールド名 ; 修飾子コンストラクタ名 ( 引数 ) { コンストラクタの中身 修飾子戻り値のデータ型メソッド名 ( 引数 ) { メソッドの中身 * クラスの継承とインタフェースの実装とを同時に行うクラスの作成が可能である ** インタフェースを extends で継承したサブインタフェースの作成も可能である GUI コンポーネント GUI コンポーネントには 3 つの階層があり, これらを重ね合わせて用いる フレーム (Frame) トップレベルコンテナ パネル (Panel) ラベル (Label) ボタン (Button) 中間コンテナ アトミック コンポーネント TestAWT クラス TestAWT2 クラス TestAWT3 クラス Eclipse で jimbo の様に 自分の名前 のパッケージを指定して, 次の TestAWT,TestAWT2, TestAWT3 の 3 つのクラスを作成せよ ( これ等は直接実行出来ないクラス 後の例題に利用する ) import java.awt.borderlayout; import java.awt.button; import java.awt.frame; import java.awt.label; - 2 -

import java.awt.event.actionevent; import java.awt.event.actionlistener; import java.awt.event.windowadapter; import java.awt.event.windowevent; public class TestAWT extends Frame implements ActionListener { Label l1 = new Label(); public TestAWT(){ this.setsize(400,300); Button b1 = new Button("Go!"); b1.addactionlistener(this); this.add(b1, BorderLayout.CENTER); this.add(l1, BorderLayout.SOUTH); this.addwindowlistener(new WindowAdapter() { public void windowclosing(windowevent wevent) { System.exit(0); メソッド宣言がスーパークラスのメソッド宣言 ); をオーバーライドすることを示す ( オーバーラ イドに誤りがあればエラーメッセージを出す ) @Override public void actionperformed(actionevent e) { // TODO 自動生成されたメソッド スタブ l1.settext("hello GUI World!"); 解説 1.Frameクラスはフレームの作成に用いられる 2.actionPerformed は, インタフェース ActionListenerのメソッドをオーバーライドしている 3.setSize(400,300) は, 幅を 400 ピクセル, 高さを 300 ピクセルに設定する 4.addActionListener は, このボタンからアクションイベントを受け取るために, 指定されたアクションリスナーを追加する 5.BorderLayoutは,NORTH( 上端 ),SOUTH( 下端 ),EAST( 右端 ),WEST( 左端 ) 及びCENTER( 中央 ) という 5 つの領域に収まるように, コンポーネントを整列, サイズ変更して, コンテナに配置する NORTH WEST CENTER EAST SOUTH - 3 -

6.addWindowListener は, このウィンドウからウィンドウイベントを受け取るために, 指定されたウィンドウリスナーを追加する 7.WindowAdapterは, ウィンドウイベントを受け取るための抽象アダプタクラスと呼ばれるものである このクラスのメソッドは全て空となっているので,WindowEventリスナーを作成するには, このクラスを拡張して関係のあるイベント用のメソッドをオーバーライドする ここでは, ユーザがウィンドウのシステムメニューでウィンドウを閉じようとしたときに呼び出される windowclosing メソッドを System.exit(0); でオーバーライドしている 8.addWindowListener メソッドの引数では, メソッド内に new でインスタンスを作成する際に, メソッドを定義している これを無名クラスと呼ぶ 無名クラスにはフィールドも定義出来る なお,eclipse では新規のクラスを作成する際に, 第 9 回の教材で学んだ様に, スーパークラスを指定することが出来るが, 更に次の様にして, 実装するインタフェースも指定することが出来る ( 続きは次のページ ) - 4 -

- 5 -

この位置にフィールド およびコンストラクタ を記述する この中にアクションイベント を記述する import java.awt.gridlayout; import java.awt.label; import java.awt.panel; public class TestAWT2 extends TestAWT { public TestAWT2(){ Panel p1 = new Panel(); Panel p2 = new Panel(); Label l2 = new Label("Click Button!"); setlayout(new GridLayout(2, 1)); add(p1); add(p2); p1.setlayout(new GridLayout(1, 2)); p2.setlayout(new GridLayout(1, 1)); p1.add(l2); p2.add(l1); 解説 1.TestAWT2 クラスは TestAWT クラスを継承しているので, インスタンス化する際に TestAWT クラスのコンストラクタが先ず呼び出される 2.setLayout はContainer クラスのメソッドで, このコンテナのレイアウトマネージャを設定する ここでコンテナとは, 他の AWT コンポーネントを含むことが出来るコンポーネントである 3.GridLayout クラスは, コンテナのコンポーネントを矩形グリッドで配置するレイアウトマネージャであり, コンテナは等しいサイズの矩形に分割され, 各矩形にコンポーネントが 1つずつ配置される - 6 -

p1 b1 l2 p2 l1 import java.awt.borderlayout; import java.awt.color; import java.awt.frame; import java.awt.graphics; import java.awt.label; import java.awt.event.mouseadapter; import java.awt.event.mouseevent; import java.awt.event.windowadapter; import java.awt.event.windowevent; public class TestAWT3 extends Frame { static final int x1 = 145, y1 = 120, width1 = 60, height1 = 60; static final int x2 = 100, y2 = 100, width2 = 150, height2 = 100; public TestAWT3(){ this.setsize(400,300); Label l1 = new Label("Click Window!"); this.add(l1,borderlayout.north); this.addmouselistener(new MouseAdapter() { public void mouseclicked(mouseevent mevent) { Graphics gr = getgraphics(); ); gr.setcolor(color.orange); gr.fillrect(x2, y2, width2, height2); gr.setcolor(color.red); gr.filloval(x1, y1, width1, height1); this.addwindowlistener(new WindowAdapter() { public void windowclosing(windowevent wevent) { System.exit(0); ); 解説 1.addMouseListener は, このコンポーネントからマウスイベントを受け取るために, 指定されたマウスリスナーを追加する - 7 -

2.MouseAdapterクラスは, マウスイベントを受け取る抽象アダプタクラスである 3. それぞれのコンポーネントは Graphics クラスのインスタンスを持っているので,getGraphics メソッドで描画オブジェクトを取得出来る 4.setColor は, このグラフィックスコンテキスト ( 描画情報を格納しておくためのもの ) の現在の色を指定された色に設定する 5.fillRect(x2, y2, width2, height2) は, 指定された矩形を塗りつぶす 矩形の左端, 右端はそれぞれ x2,x2+width2-1 で, 上端, 下端はそれぞれy2,y2+height2-1である これで指定される矩形は, 幅 150 ピクセル, 高さ 100 ピクセルの領域である パラメータの意味は次の通りである (x2, y2) x2 - 塗りつぶされる矩形の x 座標 y2 - 塗りつぶされる矩形の y 座標 width2 - 塗りつぶされる矩形の幅 height2 - 塗りつぶされる矩形の高さ width2 height2 6.fillOval(x1, y1, width1, height1) は, 指定された矩形の中の楕円形を現在の色で塗りつぶす パラメータの意味は次の通りである (x1, y1) x1 - 描画される楕円の左上隅の x 座標 y1 - 描画される楕円の左上隅の y 座標 width1 - 塗りつぶされる楕円の幅 height1 - 塗りつぶされる楕円の高さ インポートの編成でこのダイアログが出たら, java.awt.event.mouseevent の方を選択する - 8 -

例題 1 ( ボタンとラベルの表示 ) 次のプログラムを入力し, ビルドして, 実行せよ ここで, クラス名は Sample12_1, ソース ファイル名は Sample12_1.java とする なお, プログラムを終了するには, ウィンドウを閉じる public class Sample12_1 { public static void main(string[] args) { // TODO 自動生成されたメソッド スタブ TestAWT testawt = new TestAWT(); testawt.setvisible(true); 解説 setvisible は引数が true の場合にコンポーネントを表示し, そうでない場合はコンポ ーネントを隠す 例題 2( パネルを使ったレイアウト ) 次のプログラムを入力し, ビルドして, 実行せよ ここで, クラス名は Sample12_2, ソース ファイル名は Sample12_2.java とする public class Sample12_2 { public static void main(string[] args) { // TODO 自動生成されたメソッド スタブ TestAWT2 testawt2 = new TestAWT2(); testawt2.setvisible(true); 例題 3( 描画 ) 次のプログラムを入力し, ビルドして, 実行せよ ここで, クラス名は Sample12_3, ソースフ ァイル名は Sample12_3.java とする public class Sample12_3 { - 9 -

public static void main(string[] args) { // TODO 自動生成されたメソッド スタブ TestAWT3 testawt3 = new TestAWT3(); testawt3.setvisible(true); 演習 Graphics java をキーワードとして Web 上で検索を行い,docs.oracle.com のサイトにある Java Platform SE 7のドキュメントを探して読み, 図形の描画について調べ, ウィンドウをクリックすると, 自分のデザインした図形の描画を行うプログラムを作成し, ビルドして実行せよ ここでは,Frameクラスを継承したサブクラス TestAWT4 を新規に作成して, 自分のデザインした図形の描画を行うコンストラクタを作成する ( ソースプログラム名は TestAWT4.java) ものとし, 更にそのインスタンスを生成する main メソッドを含むプログラム ( クラス名は Ex12, ソースプログラム名は Ex12.javaとする ) を作成して, ビルド 実行する 提出物 : 1) 演習のソースプログラムのファイル TestAWT4.java 及び Ex12.java をメールに添付する 2) 第 11 回の授業の復習の内容を埋めたファイル Review_11th.txt をメールに添付する - 10 -