縦横にスクロール
大分前にもスクロールのサンプルは作ったのですが、ソースが行方不明になりまして改めて作りました。
最近ＨＳＰを頑張っている生徒からの質問が続いていて、今回もＨＳＰです。
スクロールの仕組みはといいますと、配列にマップデータを入れデータに対応した画像を表示してカーソルキーの入力と逆に進ませればスクロールしているように見えるという仕組みです。
２次元配列の中はこんな感じ
データはといいますと、2次元配列にこんな感じでいれます。
1111111
1000001
1010101
1000001
1010101
1000001
1111111
表示するときに1だったら壁の画像、0だったら床画像という具合に条件を付けて表示します。
あとは画面の中央あたりにキャラクタを表示して、周辺の配列の情報と照らし合わせながら、当たり判定をつけていきます。
簡単に言うと。。こんな具合です。●が自キャラです。ひとまずは常に真ん中へんに表示させておけばいいんじゃないでしょうか。
画像の重なりがあるので、表示は最後だとあんまり考えなくて楽です。透過がうまくいかないときは調べてみてください。あちこちに情報が散らばっています。
実際に配列を画像にするとこんな具合です。
１０１０１
００●０１
１０１０１
丸の場所から上下左右の当たり判定を考えます。０だったら進めるとか。。するわけです。
実際の様子
実際に動かすとこんな感じになります。
前回の連打からソースも出さず、上っ面の説明で申し訳ない。まだ質問してくれた生徒ができていないのに皆さんに先に教えてしまっては「ツクガクなんやねん！！」になるのでご勘弁を。
１歩が少しスムーズなんですが、ここがミソ。１マス分を２回に分けて移動させています。
でも最初は１歩１マスでいいと思います。一度にやろうとせず、問題を細分化していきましょう。
ちなみにここで使っている画像は無料で公開されているマップチップやキャラチップをお借りしています。
いつかはオンラインで勉強できるようにもしたいですね。
