プログラミング実習（Java）

プログラミング実習（Java）
グラフィクス処理とGUIプログラミング
講師：坂口利裕（横浜市立大学）
自己紹介

氏名


本務先


横浜市立大学
専門分野


坂口利裕
社会工学（都市・地域計画，都市解析）
その他は．．．

後ほどホームページで
2008.08.14～15
プログラミング実習(Java)
2
はじめに

成績評価

「実習」なので出席することが大前提


欠席は１時限まで
出欠のチェック



１日目：１回（この後）
２日目：レポートもどきの自己診断票の提出で代替
授業の進め方

テキストの記載順にスライド（PowerPoint）による解説＋実習



１時間に１度は休憩


テキストはあえて分冊にしているので相互補完的に利用
スライド資料はWeb上にも掲載
各自での作業の際は体調に合わせて随時
質問は積極的に

2008.08.14～15
面接授業の利点を有効活用
プログラミング実習(Java)
3
「プログラミング実習（Java）」で学ぶこと

プログラミング体験者を対象





Java言語の基礎・オブジェクト指向プログラミングの概
念の理解
GUIを備えたアプリケーション作成
グラフィクス処理を備えたアプリケーション作成
Java言語による実用アプリケーション作成のための基
礎知識の習得
例題と演習による実習




まず体験－「習うより慣れよ」
既存のプログラムの改良・拡張による理解
まず自身で考えよう
他の受講生とのディスカッションや質問で不足分を補う
2008.08.14～15
プログラミング実習(Java)
4
第1日の目標
Javaプログラムの実行手順を知る
 Javaの構文になじむ
 Javaのグラフィクス機能を知る
 JavaによるGUIの表現方法を知る
（テキストp.40～第３章の終わりまで）

2008.08.14～15
プログラミング実習(Java)
5
第１章

Javaによるオブジェクト指向プログラミング

構造化プログラミング


プログラムの部品化
オブジェクト指向
手続き重視型
 イベント駆動型


はじめに「クラス」ありき
属性→（インスタンス）変数
 機能→メソッド

2008.08.14～15
プログラミング実習(Java)
6
オブジェクト指向
第1章

手続き重視型から

第2章
手続きをパッケージ化


第3章

構造化プログラミング

第4章

部品をパッケージ化


2008.08.14～15
機能単位に部品化
イベント駆動型へ

第5章
手続きの抽象化
データとは独立
属性と機能を不可分なものとして抽象化
部品の振舞いは部品ごとに書き下す
プログラミング実習(Java)
7
Java言語の特徴
第1章
第2章

Sun Microsystems社が開発し普及に努め
ている言語
 文法の基本は，C，C++に類似

第3章


第4章

第5章
2008.08.14～15
変数宣言や計算表現などはほぼ同じ
制御構造（if,for,while）もほぼ同じ
「クラス」概念によるデータ中心（オブジェクト指
向）の言語
グラフィクス処理が標準で可能
ソース互換，バイナリ互換でもある
 個人ベースの開発環境は無償配布

プログラミング実習(Java)
8
Javaにおける
アプリケーションとアプレット
第1章

アプリケーション

第2章
第3章


アプレット

第4章

第5章
2008.08.14～15
CUIプログラミングは比較的容易
GUIプログラミングはやや難

他のアプリケーション内（Webブラウザなど）で
動作することを前提とした小さなプログラム
GUIを前提としたプログラミングが比較的容易
アプレットで学んだ技法はアプリケーション開発
にも適用可能
プログラミング実習(Java)
9
Javaアプレットの特徴
第1章
第2章
第3章

Webブラウザで動作することが前提
呼出し用のHTMLファイルが必要
 ひとつのHTMLファイル内でいくつでも呼
び出し可能
 ネットワーク経由で実行可能

第4章
第5章
2008.08.14～15
プログラミング実習(Java)
10
Javaアプレットの観察（１）
第1章
第2章
第3章
第4章
第5章
2008.08.14～15

授業用ホームページ
各自のID/パスワードでログオン
 Internet Explorerを起動
 アドレスバーに
http://sakkun.cc.yokohama-cu.ac.jp/
を入力
⇒「2005年度担当授業」
⇒「プログラミング実習（Java）」へ

プログラミング実習(Java)
11
Javaアプレットの観察（２）
第1章

Javaアプレット・サンプル
それぞれ実行してみる
 ソースを見ながら特徴・雰囲気をつかむ

第2章
テキストの第Ⅱ部を活用
 自分の知っている言語と比較
第3章
第4章
第5章
2008.08.14～15


Sunのデモンストレーション

Javaの適用範囲をつかむ
プログラミング実習(Java)
12
サンプル教材のセットアップ
第1章
第2章
第3章
第4章
第5章
2008.08.14～15

テキストp.20～21も参照
プログラム例のセットアップをクリック
 ［上記の場所から実行］に切り替え［OK］
 セキュリティ警告には［実行する（はい）
（OK）］で応答
 保存先［z:\］であることを確認して［OK］
 Internet Explorerを閉じて終了

プログラミング実習(Java)
13
第２章

Javaによるグラフィクスプログラミング

Javaのプログラミングツール
Microsoft Studio .NET 2003のVisual J#
 Sun MicrosystemsのSDK（JDK）


グラフィクスの基礎
グラフィクスの基礎
 描画メソッド


Javaプログラムの制御構造

2008.08.14～15
C（C++）に酷似
プログラミング実習(Java)
14
ソース互換
第1章
ソース
プログラム
各OS・ハードウェア
の環境下で再コン
パイルが必要
第2章
第3章
第4章
第5章
2008.08.14～15
Windows用
コンパイラ
MacOS用
コンパイラ
Windows用
プログラム
OS
ハード
ウェア
Windows
DOS/V
Linux用
コンパイラ
MacOS用
プログラム
互
換
性
な
し
MacOS
Macintosh
プログラミング実習(Java)
Linux用
プログラム
互
換
性
な
し
Linux
DOS/V
15
バイナリ互換
第1章
ソース
プログラム
第2章
（Windows用）
Javaコンパイラ
VM=Virtual Machine
OSの一部として動作するよ
うに作られた擬似的ハード
ウェア（実態はソフトウェア）
第3章
第4章
OS
実行
プログラム
特定の環境でコン
パイルされたプロ
グラムであっても
他のマシン上で実
行可能
Windows+JavaVM
MacOS+JavaVM
Linux+JavaVM
DOS/V
Macintosh
DOS/V
第5章
ハード
ウェア
2008.08.14～15
プログラミング実習(Java)
16
グラフィックスの基礎
第1章

原理・基本事項

第2章

第3章
第4章


光の点（pixel）の集まりで画面が構成されてい
る
画面を表すメモリー（VRAM）に情報を書き込む
ビデオ制御用のチップがVRAMの内容に応じて
映像信号に変換
座標系（左上が原点，右向き，下向き），色情報
（RGB）
第5章
2008.08.14～15
プログラミング実習(Java)
17
画面の大きさのいろいろ
第1章


第2章
第3章
大きさの違い

色の違い

第4章
第5章
2008.08.14～15
VGA(640x480)，SVGA(800x600)，
XGA(1024x768)
3ビット(8)，4ビット(16)，8ビット(256)，16
ビット(約6万5千)，24ビット(1600万)，32
ビット(??)
プログラミング実習(Java)
18
プログラミング言語による制御
第1章

第2章
国際規格はあるにはある（ライブラリ
の規約）

第3章
第4章
第5章
2008.08.14～15

GKS，Phigsなど
プログラミング言語としての規格
BASICの描画命令など
 Java言語

（Javaスクリプトとは別物）
 文法ではなく標準のクラス・ライブラリ

プログラミング実習(Java)
19
Java言語によるグラフィクス処理
第1章
第2章
第3章

アプレットによる場合
ソースプログラムを作る（～.java）
 コンパイルする（javac ～.java）
 表示用のHTMLファイルを作る
（～.html）

第4章
第5章


HTMLファイルをWebブラウザで閲覧

2008.08.14～15
<applet>タグを使用
コンパイルされたclassファイルがブラウザ内
で実行される
プログラミング実習(Java)
20
図形描画のメソッド（１）
第1章
第2章
 g.drawLine( 始点のｘ座標，始点のｙ座標，
終点のｘ座標，終点のｙ座標） ;
第3章
第4章
第5章
2008.08.14～15
プログラミング実習(Java)
21
図形描画のメソッド（２）
第1章
 g.drawRect(
左上のｘ座標，左上のｙ座標，幅，高さ） ;
第2章
第3章
第4章
第5章
 g.fillRect(
左上のｘ座標，左上のｙ座標，幅，高さ） ;
2008.08.14～15
プログラミング実習(Java)
22
図形描画のメソッド（３）
第1章
 g.drawOval(
左上のｘ座標，左上のｙ座標，幅，高さ） ;
第2章
第3章
第4章
第5章

2008.08.14～15
g.fillOval (
左上のｘ座標，左上のｙ座標，幅，高さ） ;
プログラミング実習(Java)
23
図形描画のメソッド（４）
第1章

drawPolygonまたはfillPolygon

第2章
第3章
第4章
第5章
2008.08.14～15

各頂点の座標をint型の配列に納める
int[] xarray = new int[3], yarray=new int[3] ;
xarray[0]=0 ; yarray[0]=30 ; …など
（固定位置なら初期値に設定してもよい）
（位置や向きを変化させるならそのつど計算）
頂点の数を指示して呼び出す
//輪郭
backG.drawPolygon(xarray,yarray,3) ;
//塗り潰し
backG.fillPolygon(xarray,yarray,3) ;
プログラミング実習(Java)
24
図形描画のメソッド（５）
第1章
第2章
第3章

色の変更
Color c =
new Color( Rの値(0～255), G, B ) ;
 g.setColor( c ) ;
を呼び出してから描画関数を使用

第4章
第5章
2008.08.14～15
プログラミング実習(Java)
25
練習
第1章
第2章
第3章
第4章

sample01.javaに対して
図形の色を変えてみよ
 日本の国旗（日の丸）を描くプログラムを
作成せよ
 いわゆる「三色国旗」と呼ばれる国の国
旗を描くプログラムを作成せよ


第5章
2008.08.14～15
見本は
外務省ホームページ（日本語）-世界の国旗を参照
プログラミング実習(Java)
26
「日本の国旗」（大きさの目安）
50
50
300
200
2008.08.14～15
プログラミング実習(Java)
27
「日本の国旗」（座標の計算）
g.setColor(Color.white)
g.fillRect(x,y,w,h);
50
50
300
200
g.setColor(Color.red)
g.fillOval(x,y,w,h);
2008.08.14～15
プログラミング実習(Java)
28
Javaの変数
第1章
第2章

暗黙の変数はない

型（クラス）を明示的に指定して宣言

第3章

型（クラス）名変数名 ;
配列は次元ごとに[ ]を添えて宣言
型名[ ] 変数名 ; // 1次元配列
 型名[ ][ ] 変数名 ; // 2次元配列
 初期値で与えられた場合はその数だけ割付
 new 型名[要素数]【 [要素数] …】で明示的
に割付

第4章
第5章
2008.08.14～15
プログラミング実習(Java)
29
Javaの演算機構
第1章

四則演算


第2章

代入演算

第3章

第4章
第5章


＝＝！＝＜＞＞＝＜＝
論理演算

2008.08.14～15
単純 =
四則演算＋＝－＝＊＝／＝％＝
インクリメント＋＋デクリメント－－
関係演算


＋－＊／％（整数値の剰余）
べき乗はない（Mathのメソッドで対応）
論理積＆＆論理和｜｜論理否定！
プログラミング実習(Java)
30
Javaの制御機構
第1章

条件分岐

第2章
第3章

第4章
第5章
2008.08.14～15

if（論理式） {
文１
}
【else {
文２
}】
switch(式) {
case 値１: 文;
【break;】
case 値２: 文;
【break;】
…
【default: 文; 】
}
プログラミング実習(Java)
反復



for(初期化;
論理式;
再初期化) {
文
}
while(論理式) {
文
}
do {
文
} while(論理式) ;
31
練習
第1章
第2章
第3章
第4章

sample02.java に対して
線の形を変える
 線の数を変える
 平行移動の幅を変える
 2重の反復処理に拡張する

第5章
2008.08.14～15
プログラミング実習(Java)
32
第３章

JavaによるGUIプログラミングの基礎

GUI部品の制御
各部品の生成と配置
 イベントの監視（リスナー）


マウスの制御

2008.08.14～15
イベントの監視と位置の取り出し
プログラミング実習(Java)
33
Javaにおける代表的GUI部品
第1章
第2章
第3章
第4章
第5章
2008.08.14～15
テキストフィールド
 テキストエリア
 ボタン
 ラベル

プログラミング実習(Java)
34
TextField
第1章


第2章

第3章
第4章
変数として定義
実体を割り付ける


TextField sinchouRan ;
sinchouRan = new TextField(6) ;
画面に割り付ける

add(sinchouRan) ;
第5章
2008.08.14～15
プログラミング実習(Java)
35
TextFieldからのデータ取り出し
第1章

文字列の場合

第2章

第3章
第4章
第5章
2008.08.14～15
整数値の場合


String s ;
s = shinchouRan.getText() ;
int i ;
i = Integer.parseInt(shinchouRan.getText() ) ;
実数値の場合

float f ;
f=
Float.valueOf(shinchouRan.getText()).floatValue(
);
プログラミング実習(Java)
36
イベント処理
第1章

ボタンのクリック・ダブルクリック
 マウスの移動・マウスのクリック

第2章
第3章
第4章
ある部品に対するアクション

プログラムで受信して処理

リスナーを定義して処理内容を記述して
おく
第5章
2008.08.14～15
プログラミング実習(Java)
37
イベントとアプレット内のメソッド
第1章
プログラマが必要
に応じて規定
第2章
システムから
ユーザから
イベント
イベント
repaint()
リスナ
共通変数の初期化
第3章
init()
（復帰）
update()
第4章
start()
プログラマが規定
paint()
第5章
イベント待ち
（復帰）
プログラマが必要
に応じて書換え
アプレット全体の流れ
2008.08.14～15
プログラミング実習(Java)
38
練習（GUI部品の扱い方）
第1章
第2章

sample04.javaに対して
判定結果による背景色の変更
 ローレル指数をBMIに変更

第3章

第4章
BMI=Body Mass Index
BMI = 体重[kg]/身長2[m]
= 体重[kg]*10000 / (身長[cm]*身長[cm]）
BMIに基づく標準体重の（計算と）表示
 グラフ風の表現

第5章
2008.08.14～15
プログラミング実習(Java)
39
練習（マウスの扱い方）
第1章
第2章

sample05.javaに対して

ドラッグへの対応

第3章

ドラッグに対応するリスナを追加
形・色の追加
配列に情報を追加
 描画用メソッドの拡張

第4章

大きさの制御
第5章
2008.08.14～15
プログラミング実習(Java)
40

Download Report