プログラミング基礎ａ 第12回 Java言語による図形処理入門（３） アニメーション入門 2012.01.18 プログラミング基礎ａ 第12回 Java言語による図形処理入門（３） アニメーション入門 坂口利裕
Javaによるアニメーション表現 アニメーションの原理 プログラミング上の技法 GUIによる制御 Threadクラスによるマルチスレッド化 プログラミング基礎ａ 2012.01.18 Javaによるアニメーション表現 アニメーションの原理 プログラミング上の技法 Threadクラスによるマルチスレッド化 sleepによる動作の一時停止 GUIによる制御 2012.01.18 プログラミング基礎ａ 坂口利裕
アニメーションの原理 コマ 少しずつ変化する 絵を連続的に描画 残像に残る程度の時間間隔を空ける。 2012.01.18 プログラミング基礎ａ 2012.01.18 アニメーションの原理 コマ 少しずつ変化する 絵を連続的に描画 残像に残る程度の時間間隔を空ける。 2012.01.18 プログラミング基礎ａ 坂口利裕
マルチスレッド Threadクラスの オブジェクトによ り，同時進行で きる別の“流れ” を生成 init() start() run() イベント処理 リスナなど stop() paint() イベント待ちのループ 2012.01.18 プログラミング基礎ａ
練習（１） プログラム内容を比較してみなさい 静止画による表現 jprog06 アニメーションによる表現 jprog07 2012.01.18 プログラミング基礎ａ
jprog07のポイント init()メソッド run()メソッド paint ()メソッド プログラムが呼び出される時に1度だけ実行 反復内容の記述 repaint()による描画図形の表示→ 変数 t の更新→ （残像を発生させるために）一定時間動作を休止 paint ()メソッド アニメーションの1コマ分に相当する図形の描画 t に依存して位置を決定→ 描画メソッドを用いた描画処理 2012.01.18 プログラミング基礎ａ
練習（２） 円軌道の中心からボールの中心まで線分を描くようにし，1点を中心に回っていることを強調させる メソッド paint () を修正 座標の考え方は，右図を参照 400 x -y 半径 400 2012.01.18 プログラミング基礎ａ
面白みを増すための改造の例 動きを複雑にする ボールの動きに応じて色を変化させる ボール以外の図形を回転させる プログラミング基礎ａ 2012.01.18 面白みを増すための改造の例 動きを複雑にする ボールを増やす 逆向きに動くようにする 楕円軌道で動くようにする ボールの動きに応じて色を変化させる １周ごとに色が変化 じょじょに色が変化 軌跡に色づけ ボール以外の図形を回転させる 円以外の図形描画を使用 画像ファイルを使用 ボタンなどのGUIを追加して動作を制御できるようにする Stop/Startを制御 回転の向きを制御 運動の半径やボールの大きさ・色を指示 2012.01.18 プログラミング基礎ａ 坂口利裕
練習（３） 回転するボールを独自の画像に変更する 「ペイント」で画像を作成 Imageクラスの変数を用意 drawImageで描画 キャンバスの大きさを50×50に変更 PNG形式でJavaプログラムと同じフォルダに保存 Imageクラスの変数を用意 初期化メソッドinit()で画像情報をファイルから読む drawImageで描画 描画メソッドpaint()でfillOvalの代わりに使用 2012.01.18 プログラミング基礎ａ
練習（４） GUIを追加して停止・実行できるように改良 リスナー ActionListenerを追加 プログラミング基礎ａ 2012.01.18 練習（４） GUIを追加して停止・実行できるように改良 リスナー ActionListenerを追加 動作状態を boolean型変数（たとえばisRunning）で保持 回転中→true，停止中→false Buttonオブジェクト（たとえばbtn1）を生成し画面上に登録しリスナーを追加，動作状態を初期化 イベント処理用メソッドactionPerformedを追加 ボタンがクリックされたら 動作状態を反転 動作状態に応じて Buttonのラベルを setLabel(“…”)メソッドで変更 動作状態に応じて角度の更新を行うように run を修正 2012.01.18 プログラミング基礎ａ 坂口利裕