第3回 画像でアプリをグレードアップ「1.サイコロ賭博再来」

3−1 サイコロ賭博再来

 前回は、変数についてお話しました。要するに「名前の付いた入れ物で、入れるものの種類が決まっている」ものでしたね。
その中で、チョットしたサイコロゲーム「丁半賭博」を作りました。ゲームと言っても、サイコロを2個振って「丁か?半か?」という単純なもので、その上、サイコロの表示がタダの数字だったので、ゲームだかなんだかわからないモノに見えていましたね。
そんなことで、今回は、サイコロ画像をゲームに貼るサンプルを使って、NS Basicでの画像の取り扱いについて説明したいと思います。

 各社からPalmデバイスが発売されていますが、それらは色々な特徴があって、選択に悩みますね。その特徴の中で、グラフィック性能もその要因の1つになるのではないでしょうか?
まず、モノクロのものとカラーのものがあり、カラーでも、256色か65535色かという色の数の問題。また、標準の解像度である160x160か、もしくはハイレゾか。
このように、様々な特徴がありますが、今のところ、NS Basicで「標準的」に取り扱える画像は、160x160のモノクロの画像だけです。
(※注:NS Basic社のホームページの「Tech Note 04」には、グレースケールなどの画像の取り扱い方が掲載されています。)
モノクロでも、グレースケールの16階調ではなく、単なる白黒2値の画像です(Ver.1.11)
ちょっと残念かもしれませんが、それは「センス」でカバーしましょう。
NS Basicでは、用意した画像をBASICコマンドで描画する方法と、コントロールを使う方法がありますが、最初に、前者の方法をお話したいと思います。

最初に、貼りつけるべき画像を用意しなければなりませんが、準備は簡単、特別なツールは必要ありません。Windowsに添付の「ペイント」で十分です。
ただし、白黒ビットマップモードにしなければなりませんので、「変形(I)」→「キャンバスの色とサイズ(A)」で、色を白黒を選択しておく必要があります。(筆者は、Visual BASICについている「ImageEdit」を使っています。)
注意しなければならないのは、白黒2値の画像を保存しても、Palmデバイス上で正常に表示されないアプリケーションがあります。例えば、AdobeのPhotoshopなどのアプリケーションですが、このような種類のアプリケーションを使っていても、ペイント等にコピー&ペーストして保存すれば大丈夫なので、あまり大きな問題ではないと思います。
さて、NS Basicをインストールすると、例えば、C:\NSBasic、というフォルダが作成されますが、これは、ユーザーのデータエリアで、この中にプロジェクトファイルや実行ファイル、画像ファイルを入れるフォルダがあります。基本的に、NS BasicのIDEは、デフォルトでここを参照します。
したがって、画像ファイルを用意するときは、NSBasicフォルダの「Bitmaps」というフォルダに保存すると便利です。

では早速、サイコロ画像を用意してみましょう。 一応、35x35ピクセルのサイコロ画像を用意してみました。

      
用意したサイコロをもとに、画面をイメージしてみました。目的の丁半賭博、つまりゴールは、こんな感じでどうでしょうか?

    

画像を貼りつける場合、予め画像ファイルをIDE上に読みこんでおく必要があります。
画像を読みこむには、プロジェクトエクスプローラの[Bitmaps]を右クリックして、[Add Bitmap]を選択します。もしくは、[Project]→[Add Bitmap]です。

    

次に、開いたダイアログで、読みこむ画像ファイルを指定します。白黒ビットマップ以外でも読みこめてしまいますが、実行時にハングアップするので注意して下さい。 また、読みこむと言っても、実際に組みこまれるのはコンパイル時です。したがって、途中でその画像を編集しても、最終的にコンパイルした時の画像が適用されます。

    

さて、こんな感じで読みこめたでしょうか? 読みこんだ画像ファイルは、読みこんだ順に連番がふられます。以前から、お気づきのことかと思いますが、NS Basic上に配置したり読みこんだ部品や画像には、デフォルトで認識番号がつけられます。
画面のフォームが1004ですので、その他の部品は1005番からですね。例えば、ボタンコントロールであれば「But1005」のような名前になります。
しかし、ボタン名などは変更できますので、この1005という番号にあまり意味はありません。一方、画像ファイルは、この認識番号で指定しますので、重要な意味をもっています。
ちなみに、1004番以前の番号は、アイコンなどアプリケーションが独自に使う部品につけられています。

さて、IDE上に画像を取り込んで、とりあえずの準備は万端ですね。次は、実際に表示をしてみましょう。

目次へ     次へ

第3回 画像でアプリをグレードアップ「1.サイコロ賭博再来」