NScripter講座[八章]

～八章～「画像ボタンによる選択」

プレイヤーに選択を求める場合、一つとして五章で説明した「select」という命令があります。
しかしながらこの命令だと少しばかり色気に欠けます。
特にメニュー画面などはもっとグラフィカルにしたいものです。
そんなとき、画像ファイルをボタンとして使い、選択を求めることができる命令があります。
今回はそんな命令について説明しようと思います。

まず基本的なボタン命令を学びますが、ボタン命令はいくつかの手順を踏む必要があります。
また、マウスが乗った状態のボタン画像を一つの画像ファイルにまとめておく必要があります。
具体的には以下のようになります。

;マウスが乗った状態のボタン画像ファイルを読み込む
btndef "{画像ファイル名}"

;ボタンを定義する
btn {ボタン番号},{ボタン左上のX座標},{〃Y座標},{横幅},{縦幅},
{btndef画像左上のX座標},{〃Y座標}

;ボタンが押されるまで待ち、どのボタンが押されたか調べる
btnwait {%数字変数}

※ボタン番号は1以上でなくてはいけません。また、重複してもいけません。

btn命令については数値がたくさんで意味がよく分からない人も多いと思います。
例えば「btn 1,①,②,③,④,⑤,⑥」というモノを言葉で説明するならばこうなります。
「画面上（①，②）から長さ③、幅④の部分をボタン1とし、その部分にマウスが乗った時、btndef命令にて読み込んだ画像の座標（⑤，⑥）から長さ③、幅④の部分の画像に変化する。」
といった感じです。
絵にするとこんな感じです。

こうする事によって「START」の部分にマウスが乗った時、btndefで読み込んだ青い「START」に変わるという動作をします。

btnwait命令が実行されると、ボタンが押されるのを待ちます。
そして、ボタンが押された時、そのボタン番号が数値として{%数字変数}の部分に代入されます。
また、ボタンではないところを左クリックした場合は0が代入され、どこでも右クリックした場合は-1が代入されます。

ほとんどの場合はbtnwaitの後でif命令を用いて分岐させることになるでしょう。

さて、ここまでは元からある背景などを使用してボタンにしていましたが、ボタンを使うにはもう一つ方法があります。
それは、スプライトをボタンにしてしまうというものです。
ただしスプライトをボタンにする際には一つ身に付けておく必要があるテクニックがあります
それは画像タグの「アニメ指定」というものです。

アニメ指定については「ＮＳｃｒｉｐｔｅｒマニュアル」の一番下「グラフィックファイルの説明」の項に書いてありますが、このマニュアルは最新ではないため追加されたものが書いていません。
そんなワケで、ここで覚えてください。
ループ形式はマニュアルには0、1、2しか書いていませんが3が存在します。
3の意味は「アニメしない」です。

さて、これがスプライトやボタンと何の関係があるんだと思う方もいるかと思いますが、まあ聞いてください。
スプライトをボタンにする場合はbtndef命令は使用しません。
つまり「ボタンが乗っている状態の画像」をあらかじめスプライト画像の中に埋め込んでおく必要があるのです。
それはどうやるのか？そこでアニメ指定を使用します。
スプライトをボタンにする時、マウスが乗っていない状態では1つ目のセル、マウスが乗ると2つ目のセルが表示されます。

この画像（ball.bmp）に対してスプライトボタン用のアニメ指定するならば、":a/2,0,3;ball.bmp"となります。
マウスが乗っていない場合、赤い円ですが、マウスが乗ると青い円に変わるといった動作になります。
ちゃんとアルファブレンドで透過もします。

さて、では肝心のスプライトボタン命令の書式を見ていきましょう。

spbtn {スプライト番号},{ボタン番号}

{スプライト番号}で指定したスプライトをボタンとして登録します。
もちろんですが、そのスプライトは前もって読んでおく必要があります。
{ボタン番号}は通常スプライトと同じように任意でつけてください。必ず1以上です。
あとはbtn命令と同じようにbtnwait命令→分岐という手順です。

ちなみに、btn命令とspbtn命令は同時に使うことができます。（もちろんボタン番号は重複してはいけません。）

七章へ九章へ

「NScripter」Top Top Page