- STORY 5 -

ＪＡＶＡプログラミング講座　宇宙のＪＡＶＡさん

- STORY ５ -

くま先生　では、宇宙（そら）のＪＡＶＡさんをはじめます！！

ミャンちゃん　みゃみゃみゃ・・・

うし君　もーもーもーもーもー

くま先生　前回の「お絵かきアプレット」、覚えてますか？？
暇だったので少し手を加えてみました。

ミャンちゃん　みゃ？？？

くま先生　円が作画されるのではなく、線が作画されるようにしました。
さっそくこれを動かしてください。
もちろん、ダブルバッファリング（裏画面）を使っています。

うし君　やったもー！！

くま先生　このプログラムは説明しませんが、
ソースプログラムに多数コメントを書いたので、それを参考にしてください。

うし君　この boolean っていう型の宣言は、なんだも？？？？

くま先生　 boolean は、真偽型の宣言です。
真偽型と言うのはスイッチのような変数で、真(true)、偽(false) の２つの状態しかありません。
このプログラム中のboolean変数 isDown は、マウスボタンが押されているときは 真(true)、離されているときは 偽(false) となっています。

くま先生　-STORY1- の MousePrint.java ではフラグに flag という名の int型 を使用しましたが、0か1かで判別するための変数でしたので、本当は boolean型 の方が良いのです。intでも問題無いですが・・・

うし君　なるほども～

くま先生　このプログラムは良く見ると paint() 以外の場所で作画しています。

ミャンちゃん　ほんとだみゃ！！

くま先生　ダブルバッファリングを利用した場合は paint() 以外の場所で作画しても、再作画時に画面が消える事がありません。

ミャンちゃん　便利だみゃ！！

くま先生　さて、今回は夢の ゲーム製作 に挑戦しましょう！！！！

ミャンちゃん　ついにきたにゃ！！！

うし君　やったもー

くま先生　どういうゲームを作ろうか、いろいろ考えましたが・・・

くま先生　今回は「パズルゲーム」を作ろうと思います。

ミャンちゃん　パズルみゃーか？！！！

くま先生　最初にゲームの完成予想図を考えます。

うし君ミャンちゃん　はーい！

くま先生　バラバラになったパネルを交換して、画像を完成させるパズルゲームを作ります。

ゲーム完成予想イラスト

くま先生　こんな感じです（上図参照）。

くま先生　大体のゲームのイメージが出来たら、次は具体的に考えます。
最初にＣＧの画面サイズですが、これは 480 x 480 にしましょう。

くま先生　次にパネルサイズですが、全体画面を横６分割、縦６分割にしましょう。
１つのパネルのサイズは 80 x 80 になります。

ミャンちゃん　ゲーム製作は難しそうだみゃぁ～
ゲームの名前は何にするみゃん？？？

くま先生　ゲーム名はさしあたり 「クマ・ザ・グレート　ＣＧパズル（仮名）」 にしましょう。

うし君　もぉ～　ナイス！！

くま先生　では、いよいよ作りはじめましょう。

くま先生　さいしょに、ＪＡＶＡ Applet 雛形 のファイル名を、KumaPuzzle.java にします。
ここらへんの手順は、もう覚えましたね・・・

ミャンちゃん　おぼえたみゃ！　次に Applet名をファイル名と同じにするみゃあ！！

// ===============================================================

public class KumaPuzzle extends Applet {

ミャンちゃん　次にアプレットを読みこむ html ファイル (sample.html) を編集するみゃ！！

くま先生　そのとおりです。　今回は画面サイズも変更します。

くま先生　ではさっそく作っていきましょう。

（１）　ＣＧを読みこむ　

くま先生　ＣＧを入れるクラス名は何でしたか？？？

うし君　Image クラスだもー。

くま先生　そうです。　さっそく グローバル変数 で、 Image変数を宣言しましょう。
ついでにダブルバッファリングも使うので、それも宣言しておきましょう。

    // グローバル変数
    Image img;

    Graphics bg;
    Image backimage;

くま先生　さて、ここでパズルゲームに使う ( 480 x 480 )の画像が必要になります。
JAVA で利用できる画像フォーマットは、JPEG と GIF ですので、このどちらかの画像を用意してください。

ミャンちゃん　当然、みんな妖しいパズルゲームを求めてるみゃ！！
ロリロリいやぁ～んな女の猫（こ）の画像を用意するみゃ！！！！

うし君　それだもー！！！
インターネットのアングラサイトからＧＥＴしてきた、女の牛（こ）の写真 をゲームに使うもーーー！！

くま先生　・・・・・(-_-;)

くま先生　それは、良い考えなんですが・・・
あぶない写真や画像を載せると、この 宇宙のＪＡＶＡさんコーナー が、プロバイダから締め出しをくらってしまいますので、今回はあたりさわりの無い画像を使ってパズルゲームを製作しましょう！！！

ミャンちゃん　残念みゃ～。

うし君　まったくも～。　自分のホームページに置くときは、ナイスＣＧ用意するも～～。

くま先生　では、裏画面に画像を読みこんで、それを表示させる事にしましょう。
init() でメモリー上に裏画面を生成します。　では、みゃあちゃん覚えてますか？？

ミャンちゃん　覚えてるみゃ！！　こうだみゃ！！　裏画面の画面サイズは( 480 x 480 )みゃ！！

    public void init() { // 初期処理

        backimage = createImage( 480, 480 );
        bg = backimage.getGraphics();

    } // init()

くま先生　そのとおりです。　では牛君、init() で画像を読みこみ、裏画面に作画してみましょう。
読みこむ画像のファイル名は「image.jpg」です。

うし君　裏画面 bg に画像をロードするもー。
画像を読みこむ命令は「getImage()」。　画像を画面に作画する命令は「drawImage() 」だもー。
こうだもー。

    public void init() { // 初期処理

        backimage = createImage( 480, 480 );
        bg = backimage.getGraphics();

        img = getImage(getDocumentBase(), "image.jpg");
        bg.drawImage( img, 0, 0, this);

    } // init()

くま先生　次に paint() の最後で裏画面を表画面にコピーします。
これは、ダブルバッファリングでは必ず必要な命令です。

    public void paint(Graphics g) { // 作画処理

        g.drawImage( backimage, 0, 0, null );

    } // paint()

くま先生　これで、

１．起動時に init() で画像がロードされ、裏画面に作画。

２．paint() で裏画面が表画面にコピーされる。　画面再表示の場合は paint() が実行され、再び表示される。

と、うまく行く筈ですが、１つ問題があります！！！！！！

ミャンちゃん　コンパイルして実行したけど、ＣＧが表示されないみゃ！！！！！！！
失敗みゃ！！！！！！！

うし君　ほんとだ！　表示されないもー！！

くま先生　その通りです。　画像は表示されません。
問題の部分は　init() の img = getImage(getDocumentBase(), "image.jpg"); です。

getImage() は、非同期で動きます。　簡単に言うと、「ＣＧを読みこみつつ、次の処理を行います」。

そこで、困った事がおきます。

img = getImage(getDocumentBase(), "image.jpg"); で画像が読みきらないうちに、
bg.drawImage( img, 0, 0, this); が処理され、裏画面に読みきらないままの画像が作画されてしまいます。

これが、このプログラムで画像が表示されない原因です。

うし君　どうするんも？？？？

くま先生　プログラムを追加して、画像が読み終わるまで、次の処理を待ってもらいます。
init() に次のプログラムを追加してください！！

    public void init() { // 初期処理

        backimage = createImage( 480, 480 );
        bg = backimage.getGraphics();

        img = getImage(getDocumentBase(), "image.jpg");

        MediaTracker mt = new MediaTracker(this);
        mt.addImage( img, 0);
        try {
            mt.waitForAll();
        } catch (Exception e) { System.out.println("ERROR!!"); }

        bg.drawImage( img, 0, 0, this);

    } // init()

くま先生　MediaTracker という命令をつかって、ＣＧを読み終わるまで次の処理を行わないようにします。

ピンク色のプログラムを記述すると、img という画像(Imageクラス)が読み終わるまで、プログラムに足止めをかけます。

うし君　も？？？？　try って命令は何だも～？

ミャンちゃん　はじめてみるみゃん！！！

くま先生　なかなか目の付け所が良いですね。

try - catch は、「ひょっとしたら動作しないかもしれない命令に記述する物」です。

例として、

try { A; } catch (Exception e) { B; }

の場合は、A; の命令を実行してもしエラーが出たら B; の命令を実行します。

今回のプログラム

        try {
            mt.waitForAll();
        } catch (Exception e) { System.out.println("ERROR!!"); }

では、

mt.waitForAll();　を実行して、もしエラーが出れば、System.out.println("ERROR!!"); を実行するんです．

ちなみに System.out.println("ERROR!!"); は、JAVAコンソールに ERROR!! という文字を出力（表示）する命令です。

そんな訳で当然 mt.waitForAll();　は try - catch の必要な命令の１つです。

うし君　どの命令が try - catch の必要な命令か、わからないもー。
全部覚えるのかも～？？？

くま先生　覚える必要はありません。

コンパイルをした時に、「Exception 何とかエラー」というエラーが出たら、 try - catch が必要な命令なので、 try - catch で括ります。　それだけです・・・

うし君　とっても、いいかげんだも～

くま先生　くまですから・・・・・

くま先生　では完成ですので、コンパイルして動作させてください！！

ミャンちゃん　やったみゃん！！！　表示されたみゃん！！　　

うし君　裏画面を使ったＣＧ表示、成功だもー！！

くま先生　では、今回はこれでおしまい。　次回はパズルゲームの続きを作りましょう！！
ではみなさん、さようなら！

うし君ミャンちゃん　もー！　（みゃん！）

- 続く -