第3回 画像でアプリをグレードアップ「2.サイコロは目が6つ」

3−2 サイコロは目が6つ

 用意された画像を表示するには、次のコマンドを使います。

    DrawBitmap 認識番号, X座標, Y座標

この認識番号には、画像につけられた1013のような番号を指定します。例えば「サイコロの3」でしたら「1015」ですね。
X座標とY座標はそれぞれ横方向、縦方向の座標です。標準的なPalmデバイスの座標はこのように、160x160ピクセルの正方形で、左上が(0,0)で右下が(159,159)になります。

    

サイコロの座標は、1つ目が(40,44)、2つ目が(85,44)にしておきましょう。

    

さて、問題は、サイコロの目をどうやって出すか、です。
第2回のサンプルプログラムでは、サイコロの目を、Sa1,Sai2という変数に入れておきました。
このSaiXという変数を使ってサイコロの目を描き分けるれば良いのですが、具体的はどうしましょう?
「ある条件で分岐して何かをする」という場合に使うIf〜Thenというコマンドを覚えているでしょうか?
これを使えば、サイコロ1の目が「1」の時は、
    If Sai1=1 Then
        DrawBitmap 1013,40,44
    End If
とすれば良いですね。
そうすれば、サイコロ1で6つ、サイコロ2の方も6つ、合計12個のIf文を並べれば良いわけです。

・・・でも、ちょっと大変ですね。では、もう少しスマートな方法を覚えましょう。
条件によって処理を分けるコマンドに「Select Case」があります。
    Select Case 値
        Case 値A
           処理その1
        Case 値B
           処理その2
        Case 値C
           処理その3
        Case Else
           処理その他
    End Select
Select Case の後ろにある値が、値Aと等しかったら「処理その1」を、値Bと等しかったら「処理その2」を、という具合に、値によって処理を変えるのに向いているコマンドです。
If Thenは「ある条件が成り立つか、そうでないか」 という条件でしたので、今回のサイコロのような処理にはSelect Caseの方が適していますね。尚、Case Else節(ここでも節です)は、省略可能です。

したがって、サイコロ1は、
      Select Case Sai1
          Case 1
              DrawBitmap 1013,40,44
          Case 2
              DrawBitmap 1014,40,44
          Case 3
              DrawBitmap 1015,40,44
          Case 4
              DrawBitmap 1016,40,44
          Case 5
              DrawBitmap 1017,40,44
          Case 6
              DrawBitmap 1018,40,44
     End Select
で描き分けることができます。

・・・これも大変ですね。Select Caseを覚えて、少しは楽になった気がしましたが、これでも疲れちゃいますね。
実は、オススメの方法があります。
    DrawBitmap 1012+Sai1,40,44
たったこれだけです。条件文で分ける必要はありません。(楽な方法を最後にしたのは、教育的配慮ですね。)
サイコロの目が1ならSai1=1、2ならSai1=2…ですので「1012+Sai1」は、1013,1014,1015…になります。
ということで、各画像の認識番号を指定できてしまいます。
このような方法は、前回のMid()を使って"CHO"と"HAN"を作り分けたものと似ていますが、これは、BASICの実行速度に関係があります。
BASICが条件文を解釈する速度は、単なる計算に比べると、かなり遅く感じます。そのため、できるだけ条件文を使わないようにするのがコツで、多少数式が複雑になっても、条件文を多く並べるよりは早くなります。

ただし、ポイントが1つあります。
それは、NS Basicに読みこんだ画像の認識番号連番になるように注意することです。
NS Basicに配置する様々なものは、先ほどもお話しました通り、勝手に連番が振られます。したがって、サイコロの画像を読みこむ際、途中で別のボタンやラベルなどを貼りつけたりしては連番が狂ってしまいます。また、サイコロの目が1,2,3…と順に読みこむことは言うまでもありませんね。
※一応、保存したプロジェクトファイルは、テキストエディタなどで編集ができます。興味のある方は、解析してみてください。

ではプログラムです。
サイコロを振るのは[SyoBu!]ボタンでしたので、このイベントモジュールを、書きかえれば良いです。
具体的には「数字サイコロ」をラベル(Lbl1009)に表示していましたが、これをDrawBitmapを使ったものに変更すればよいのです。

    Lbl1009.Label="(" + Str(Sai1)+","+Str(Sai2) + ")"

数字サイコロを表示するこの部分を、

    DrawBitmap 1012+Sai1,40,44
    DrawBitmap 1012+Sai2,85,44

に変更します。
また、画面上のラベル(Lbl1009)は不要ですから、削除してしまっても構いませんね。
そのコントロールをクリックして、選択状態にしてから[Delete]キー、もしくは右クリックの[Delete]で削除できます。

さて、コンパイルして、実行してみてください。
どうでしょうか?サイコロが表示されましたね。なんだか、すこしゴージャスなアプリになった気がします(しませんか?)

ここで覚えたことは、取りこんでおいた画像ファイルを表示するDrawBitmapというコマンドです。
また、変数を使ったテクニックを使いましたね。この変数を応用すれば、チョッとしたアニメーションもできるかと思います。
次は、別の方法で画像を表示することにします。

前へ    目次へ    次へ

第3回 画像でアプリをグレードアップ「2.サイコロは目が6つ」