忍者ブログ
ゲームと工作と勉強と雑記のページ
×

[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。


長い間、更新を休んでました。ごめんなさい。
まぁ、とりあえず忙しいです。

更新サボりのお詫びといっちゃなんですが、作りかけのゲームを公開しようと思います。
非常に単純なパズルゲームです。マウス入力です。
これ
まだ、ツメがあれなので、不快に思われる方がおられるかもしれません。
完成度の低いゲームが大嫌い!と言う方はご遠慮ください。

万が一、アドバイスをして頂ける方がおられましたら、メールでよろしくお願いします。
すぐに対応するのは難しいかもしれませんが・・・

PR

 今までのHSPコンテンツをHTMLに纏めようとおもって早速取り掛かるのはいいのですが、なかなか難しい・・・

 メニューつくるのって、どうなんだろう?
 ホームページっていったら、やっぱり色々網状にリンクはるじゃないですか。そのときに、どのページにも同じメニューを出すにはインラインフレーム(?)とかいうのを使うんですかね?ちょっとやってるんですけど、ブラウザによって表示されるとか表示されないとか。実際良く分からない。

 全く。ブラウザによっていろいろ表示のされ方が違うとかやめてほしいです。

 

 
 今回は、変数は変数でもただの変数ではない配列変数を紹介したいと思います。とはいっても、全然難しいことではないので安心してください。

 例えば、シューティングゲームを作るとしましょう。当然、敵が動いて襲ってくるはずです。「敵が動く」ということは、1コマ1コマ敵の座標が変わっているということです。アニメーションの時にやったように、敵の座標を変数で管理して、1コマ1コマ値をちょっとずつ変えながら描画すれば出来そうです。ここで具体的に敵の座標を
 tekix, tekiy
という2つの変数で管理するとします。

 そのシューティングゲームには1匹の敵しか出てこないなら上でいいでしょう。しかし恐らく、一般的なシューティングゲームには、敵は少なくても3匹は出てくるはずです。と言うことで変数を増やして
 tekix1, tekiy1, tekix2, tekiy2, tekix3, tekiy3
としましょう。(一番最初の文字でなければ変数の名前に数字が使えます。)

 このシューティングゲームを作っている間に更に2匹欲しくなってきました。やっぱり敵は多いに越したことはないですよね。と言うことで変数をもっと増やして
 tekix1, tekiy1, tekix2, tekiy2, tekix3, tekiy3, tekix4, tekiy4, tekix5, tekiy5
としました。

 ここの辺りで気付いた人は入ると思いますが、上の方法では非常に面倒です。敵の数を増やすたびに変数の数も増えていくと言うのは不合理です。しかも、この場合では、敵によって変数名が違うため、例えその敵が同じ種類で同じ動きをするとしても、それぞれに対してプログラムを個別に書かなくてはなりません。

 変数の1番最後の数字が変わっているだけなのに・・・

 ここで非常に便利なのが配列変数です。これを使うと
 tekix, tekiy
という、たった2つの変数名で、いくつもの敵の座標を管理することが出来ます。

 配列変数とは、普通の変数の集まりです。その変数の集まり全体に変数名があり、それぞれには識別するために番号が付けられています。その、それぞれを識別するための番号を「添え字」と言います。

 呼び方のシステムとしては、駅のコインロッカーによく似ています。例えばある駅に、「改札口前ロッカー」と「売店横ロッカー」があるとします。それぞれ、いくつかのロッカーの集まりです。通常、ロッカーには通し番号が付けられていますよね?それで、「改札前ロッカーの3番」とか、「売店横ロッカーの5番」とか言う風に呼べるわけです。

 配列変数も非常にこれと似ています。「改札前ロッカーの3番」という呼び方の、「改札前ロッカー」の部分が配列変数の変数名にあたり、「3番」の部分が配列変数の添え字にあたります。また、1つ1つのロッカー(1つ1つの変数)を要素といいます。つまり、改札前のロッカーが全部で50個あった時、要素数は50個である、と言う風に言います。

 プログラム上でどのように使うかと言うと
  変数名(添え字)
のように使います。ちょっとだけ具体的に使ってみましょう

 
// 配列変数を作成
 dim tekix, 3
 dim tekiy, 3

 // 配列変数にそれぞれ値を代入
 tekix(0) = 100
 tekiy(0) = 100
 tekix(1) = 200
 tekiy(1) = 200
 tekix(2) = 300
 tekiy(2) = 300

 // それぞれの位置に円を描画
 repeat 3
  circle tekix(cnt) - 5, tekiy(cnt) - 5, tekix(cnt) + 5, tekiy(cnt) + 5
 loop


  実行すると小さい円が斜めに3つ表示されます。

 プログラムを最初から見ていきましょう。まず
 dim tekix, 3
 dim tekiy, 3

があります。dim命令が使われていますが、これはそれぞれ、「tekixという要素数が3の配列変数を作れ」「tekiyという要素数が3の配列変数を作れ」といっています。実はこのdim命令をつかって
 dim 変数名
と言う風に要素数を指定しなければ、普通の変数を作ることが出来ますが、今までは省略してきました。この命令を使わなくても、最初に変数に代入した時にHSPが勝手に作ってくれるからです。配列変数でもこの命令を使わなくとも、最初に代入した時に配列変数を作ってくれます。つまり、この2行は無くてもとりあえず問題ありません。こういう命令があることを示すために書いておきました。

 つぎに、
 tekix(0) = 100
 tekiy(0) = 100
 tekix(1) = 200
 tekiy(1) = 200
 tekix(2) = 300
 tekiy(2) = 300

とあります。これは、tekix、tekiyという配列変数の各要素に値を代入しています。普通の変数と違うのは、何番目の要素かを示す添え字があるところです。ここで注意して欲しいのは、要素の番号は0から始まる、と言うことです。よってこの場合、要素数が3であるため、添え字に指定できるのは、0、1、2の3つです。

 そして、注目して欲しいのはこの部分です。
 repeat 3
  circle tekix(cnt) - 5, tekiy(cnt) - 5, tekix(cnt) + 5, tekiy(cnt) + 5
 loop

repeat命令とloop命令で、circle命令を3回繰り返しています。このcircle命令ではtekix、tekiyの配列変数の要素の値を利用して円を描画するわ訳ですが、添え字の部分に「cnt」とかかれています。これはシステム変数の1種で、repeat-loop命令で何回目の繰り返しか、と言う値が入っています。つまり、一番最初の繰り返しでは0、次の繰り返しでは1、その次の繰り返しでは2、・・・と言う風に順次変化していきます。よって、3つの円がそれぞれの位置に描画されます。
 ここで味噌なのが、添え字には普通の命令のパラメータと同じように、変数や、計算式を入れることが出来る、と言うことです。これが、普通の変数の名前の最後に数字を付ける時との大きな差で、配列変数を利用する時の最大の利点です。上のプログラムの描画部分のような書き方は、ゲームを作る際にたくさん出てくると思うので是非身につけて下さい。

 今回の例はあまり面白くないかもしれませんが、これから配列変数は割と出てくると思います。いろいろ、配列変数で遊んでください。


 今回はマウスを簡単に使ってみたいと思います。

 マウスのボタンの入力は、前回触れたgetkey命令で取得できます。キーコードは、「HSP講座8」の表のとおり、左ボタンが1、右ボタンが2です。

 キーボードと違うのは、マウスの座標の取得ですが、それは、システム変数の値を利用することで、簡単に取得できます。

 システム変数とは、変数の一種です。今まで使ってきた、自分たちで初期化して使う変数とは違い、HSPのシステムであらかじめ用意されている変数のことです。システムが用意する変数であるため、変数の名前はあらかじめ決まっています。

 例えば、「mousex」というシステム変数には、マウスカーソルのx座標が入っています。また、同じように「mousey」というシステム変数に、マウスカーソルのy座標が入っています。

 実際に使ってみましょう。
 次のプログラムは、マウスの左ボタンを押している間、カラフルで大小さまざまな円がマウスカーソルの位置に描画され、右ボタンを押すと、画面内が白でクリア(塗りつぶし)されると言うものです。

 // 乱数初期化
 randomize
 
 repeat

  // マウス左ボタン検出
  getkey lclick, 1
  // マウス右ボタン検出
  getkey rclick, 2

  // 条件:左が押されていれば
  if (lclick == 1) {
   // 色:ランダム
   color rnd(256), rnd(256), rnd(256)

   // 半径:1から100の間でランダム
   r = rnd(100) + 1

   // (mousex, mousey)中心の円描画
   circle mousex - r, mousey - r, mousex + r, mousey + r
 
}

  // 条件:右が押されていれば
  if (rclick == 1) {
   // 色:白
   color 255, 255, 255

   // 画面内塗りつぶし
   boxf
 
}

  wait 5
 loop

 if文の色をちょっと変えてみました。見やすいでしょうか?

 実行すると、マウスを押している間、ずっと円が描画されると思います。円と次の円が描画されるまでの時間が、「wait 5」です。(実際は、他の処理も多少時間をとっていますが)


 プログラムの説明ですが、getkey命令付近は、大体分かると思います。前回説明したとおりです。

 今回は色と半径をランダムにしています。「r = rnd(100) + 1」の「+1」は「r」が0になるのを防ぐ役割があります。「+1」がなければ、rの範囲は0~99ですが、「+1」することで1~100となっています。 

 問題のマウス座標ですが、円描画の行を見てください。
   circle mousex - r, mousey - r, mousex + r, mousey + r
 
となっています。このように、「mousex」「mousey」というシステム変数も、代入さえしなければ、普通の変数のように利用することが出来ます。この「mousex」「mousey」には、常に、その時のマウスの座標が入っているため、マウスを押しながら移動させたりしても円はマウスの位置にちゃんと描画されます。

 とても簡単だとは思いませんか?ここまでやってくれば、簡単なペイントソフトみたいなものは出来そうな気がしますね。


 ここはプログラミングについての記事が主である雑記HPです。

 次のカゴテリーの中に興味があるものがあればご覧下さい。

●HSP入門(今のところメインコンテンツ)
 HSPによるゲームプログラミングの講座です。今までにプログラミングの経験がない方を対象に書いています。僕自身未熟で勉強中の身なので色々間違いや勘違いなどあるかもしれません。それでも何かゲームが作りたい!と思う方、是非見てみてください。

●ゲームプログラミング
 ゲームを作ることに関していろいろ書くところです。まだあまり書いていません。

●電子工作
 電子工作についてぐだぐだ書いてあります。あまりにも中途半端なので見ないほうがいいかもしれません。

●どうでもいいこと
 ”日記”的な要素が強い記事です。気が向いた時に見てください。

 上のどれについても、記事内に誤りや勘違いが含まれている可能性が十分あります。このHPのことで何か問題が起きてもぴんかびは責任を負えませんのでご了承ください。

 このページはリンクフリーです。相互リンクも大歓迎です。もし相互リンクしていただける方は、恐れ入りますがメールを下さい。アドレスは
 _m_s_k_あっとまーくmail.goo.ne.jp
です。(メールする際、上の”あっとまーく”の部分を”@”に直してください。)

 他にも、感想や要望がありましたら、メール下さい。
  


カレンダー
09 2017/10 11
S M T W T F S
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31
リンク
フリーエリア
最新CM
[08/30 masaya]
[06/17 Yu]
最新TB
プロフィール
HN:
ぴんかび
性別:
男性
趣味:
プログラミング、工作、囲碁
自己紹介:
_m_s_k_あっとまあくmail.goo.ne.jp
バーコード
ブログ内検索
最古記事
(06/15)
(06/16)
(06/17)
(06/18)
(06/20)
カウンター
アクセス解析

Copyright © [ PinCurve ] All rights reserved.
Special Template : 忍者ブログ de テンプレート
Special Thanks : 忍者ブログ
Commercial message : [PR]