メニュー画面を作ろうの巻

　実に2ヶ月ぶりの更新となりました(といってももっと凍結したコーナーもあるけどね(笑))「HSPをやろう」、今回はmistsoftさんからのリクエストでメニュー画面を作ってみることにします。

●とりあえず画面を作ってみることに
　あくまで説明がしやすいように作っておくだけですので、あまり深いことは気にしないで下さい。リクエストがRPGでのメニューだったので、今回はそれっぽく作ってみます。
写真１←まあ、こんな感じでしょう。実際にゲームで使うなら枠はグラフィックで書いた方がいいですね。

cls 4
color 255,255,255
font"ＭＳ ゴシック",16
mes"+------------+
mes"|→アイテム  |
mes"|　魔法      |
mes"|　装備      |
mes"|　ステータス|
mes"|　コンフィグ|
mes"|　セーブ    |
mes"+------------+
y=0

●カーソルを動かそう
　カーソルの移動の手順を書くとこうなります。

  1. stick命令でキー入力を検出する
  2. カーソルを消す
  3. キー入力にあわせてカーソルの座標を動かす
  4. カーソルを書く

　ここで注意しなければならないのは、stick命令は「トリガータイプで検出する」ことです。間違って非トリガータイプで検出するとカーソルがツルツルと滑ってしまうでしょう(awaitの値を大きくすれば問題なさそうですが)。後はそんなに難しいことはありません。

*main
redraw 2
stick s,0
s=s&10
await 33
if s=0 : goto *main
color 0,0,0
boxf 8,y*16+16,23,y*16+31
y=s>>2-1+y
if y<0 : y=0
if y>5 : y=5
color 255,255,255
pos 8,y*16+16
mes"→"
redraw 1
goto *main

　ちょっと一部でインチキ臭いことをしています(^^;。まずはじめの方の「s=s&10」は、カーソルキーの上と下のビットだけを残し、カーソルキーの入力がなかったら無駄な処理をしないようにしています。それから真ん中へんの「y=s>>2-1+y」は初心者には難解ですね。これを普通に置き換えるなら、

if s&2 : y--
if s&8 : y++

とすればよいのですが、こうすると人に見せたときにデキると思わせることができるというメリットがあります(笑)。

●ループさせる
　カーソルを下まで移動させてからもう一度上まで戻すの面倒じゃないですか。そこで、ウィンドウの上下の端をつなげることで解決させようと言うのがループです。これも簡単。端からはみ出したら反対側へ戻せばいいだけです。上のスクリプトの真ん中よりちょっと下にある2つのif文を以下のように書き換えればループの完成。

if y<0 : y=5
if y>5 : y=0

　あるいは、if文を消して下のようにするやり方もあります。何でこれでよいのかは各自で研究しましょう。さほど難しいことではありません。

y=y+6\6

　さらに、上の行の式と組み合わせて、

y=s>>2-1+y+6\6

　これ1行でカーソルの移動とループができてしまいます。さあ、みんなに自慢しよう(爆)！　といっても、何でもこうやればよいというわけではありませんのであしからず。

●DirectXを使う！
　ここまでできたらあとは決定ボタンが押されたら現在の座標によってそれぞれの処理へ飛ばし、キャンセルが押されたらウィンドウを消す、という処理を作って出来上がりですが、今回そこまではやりません。
　リクエストの中に「DirectXを使ったやり方も教えて欲しい」とありましたので、そこにも踏み込んでおきます。といってもこれまでのスクリプトをみれば分かるように、DirectXだからといって特別なことをするわけではありません。変わるのは画面の表示だけです。
　まずウィンドウの表示ですが、最初に作った程度の地味なものでよいならes_boxfで必要な部分を消してからes_mesで順に書いていけばよいです。枠の表示にグラフィックを「キチンと」使う際に全てes_boxfやes_fillですます方法と、枠のパーツを用意しておきes_copyで表示する方法とありますが、今回は前者を使います。
　まず、DirectXなしで作ってみましょう。その方がいろいろ試行錯誤がしやすいので。
写真２←結構よくできてると思うのですがどうでしょう。

cls 4
sdim cmd,12,6
cmd="アイテム","魔法","装備","ステータス","コンフィグ","セーブ"
redraw 2
color 255,255,255
repeat 8
i=cnt
palette i+1,i*32,i*32,i*32
palcolor i+1
boxf i,i,112-i,128-i
loop
palette 9,0,0,192
palette 10,255,255,255
palcolor 9
boxf 8,8,104,120
palcolor 10
pos 8,16
mes"→"
repeat 6
i=cnt
pos 24,i*16+16
mes cmd.i
loop
palfade 0
redraw 1

　コマンドの数と幅を把握できるように、配列を使いました。なるべくこうした方が後から修正するときにやりやすいです。
　さて、あとはグラフィック関係の命令をDirectX用に置き換えれば出来上がりです。そのほか若干のアレンジを加えた完成品がこれです(終わるときはESCキー)。

●さて
　今回の講座はRPGに限らずいろんなゲームで使えるものです(たとえば格闘ゲームのキャラ選択とか)ので、覚えて置いて損はないでしょう。とはいっても、まだまだこれだけでは不十分ですので近いうちにさらに踏み込んだことをやるかもしれません(そうやって言っておいてやらなかったのがどれだけあるか・・・(^^;)。

戻る