1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

サッパリ系ビスケットプログラミング#6マリオ風ゲーム/ジャンプ〜小マリオ編〜

Last updated at Posted at 2019-03-11

SEの方の間でも評価が上昇傾向のビジュアルプログラミング言語、Viscuit(以下ビスケット)でマリオ風のゲームを作成していきます。#4で作ったステージに、割れたメガネを使ってジャンプのプログラムを追加します。割れたメガネについては#1をご参照ください。

※ビスケットのコーディングは全て描画で行います。こちらの記事はビスケットでのコーディングを簡潔に紹介するため、敢えてサッパリした描画のプログラムにしております。こちらをベースに、お好みの描画でオリジナリティーの高いプログラムに仕上げてくださいm(_ _)m

ジャンプと着地判定〜小マリオでステージからジャンプして、土管(IN)に乗る。次回🚩までとりあえず行く〜

4508A82E-E2FD-410C-A04D-9ED7CB4A47A5.jpeg
当面の目標は、小マリオのままで🚩まで移動できるようにします。スタートは画像の位置とします。
【全ルート確認】
スタート→2マス右に移動→右上ジャンプ→土管IN→土管OUT→土管IN→土管OUT→右上ジャンプ
今回は最初の土管(土管IN)まで辿り着きます。

【ジャンプのプログラムの作り方と解説】

垂直ジャンプ(1マス上方)

81B76AB3-0FAE-4070-87B2-9FDF07E6F6A4.jpeg ステージブロック、割れないブロック、ハテナブロック、土管IN、土管OUTの5種類のパーツ上で、小マリオが1マス上方にジャンプするプログラムです。 割れたメガネを5つ準備します。 ### 作り方 パーツ:タッチマーク、割れたメガネ5つ、Aボタン、重力センサー、小マリオ、ステージブロック、割れないブロック、ハテナブロック、土管IN、土管OUT

まず、左側メガネ下半分にAボタンとタッチマークを配置、左側メガネ上半分にステージブロックと1マス上に小マリオを置き、もう1マス上に重力センサーを配置します。
次に、右側メガネ下半分にAボタンを配置、右側メガネ上半分にステージブロックと1マス上方に重力センサーを置き、もう1マス上に小マリオを置きます。
この作業を5種類のステージパーツ分作ります。

一般的なプログラム風に訳すと
Aボタンが押されたら、小マリオはステージブロック(割れないブロック、ハテナブロック、土管IN、土管OUT)の2マス上方に移動する
という意味になります。

左上(右上)ジャンプ

描画の追加:ジャンプ小マリオ(左右)

28C4D543-F426-4EE3-B226-B1495885E47F.jpeg ここで、左上、右上にジャンプした際の小マリオのパーツを描画します。 ![2CCA388F-9E91-4421-8657-C35C37FC6B30.jpeg](https://qiita-image-store.s3.amazonaws.com/0/373284/796aecb4-9d2b-592b-d577-67459bee3d23.jpeg) ![7AA79DD8-F006-417F-8234-36DEDA6086E1.jpeg](https://qiita-image-store.s3.amazonaws.com/0/373284/74df251f-48a2-9019-8637-f378de2c4d5c.jpeg) 十字キーの左斜め上とAボタンで左上ジャンプ、十字キーの右斜め上とAボタンで右上ジャンプ…という命令です。

割れたメガネの発明により、ビスケットの表現の幅はさなぎから蝶になるかのようにドラスティックに変化を遂げました。
このメガネはその真骨頂の1つとも言える、3分割メガネによる「ボタン同時押しによる命令」であります( ̄^ ̄)ゞ

…と書くと大げさかもしれませんが、この記事のようなマリオ風ゲームがビスケットで制作可能になったのはこの機能のおかげなのです。
では解説していきます。

作り方

パーツ:割れたメガネ3分割2つ、タッチマーク、Aボタン、重力センサー、小マリオ、ステージブロック、割れないブロック、ハテナブロック、土管IN、土管OUT

まずは、ステージブロック上で小マリオが左上(右上)にジャンプできるようにします。
メガネを2つ出し、3分割にします。
63D030A0-FC4D-4CA3-829B-05664E142048.jpeg
CBE35F73-4068-456E-A976-C8819DC3006E.jpeg

左側のメガネ:
割れたメガネの下段左側に「十字キーの左斜めにタッチマーク」、右側に「Aボタンにタッチマーク」を入れます。
割れたメガネ上段には小マリオを入れます。
7B7A0567-DE2B-4CE8-B51F-7B155F25A514.jpeg

右側のメガネ:
タッチマークなしの十字キーを左下半分に、Aボタンを右下半分に入れます。
割れたメガネ上段には初めの位置から4マス上方、1マス左の場所にマリオを入れます。
3A2CB096-5A92-4C39-B672-93766926A844.jpeg

一般的なプログラム風に訳すと
十字キーの左上(右上)とAボタンが同時に押された時、小マリオの1マス左上(右上)に重力センサーが存在するなら、小マリオは小マリオジャンプに書き換えられ1マス左上(右上)へ移動する
という意味になります。

右ジャンプはこの逆を作ります。

この命令をステージパーツの分だけ同様に作ります。
メガネは増えますが、パターンを1つ作れば作業は明確なので、あとは手を動かすだけなのです。
大マリオもジャンプでの移動先以外は同様ですが、今回は小マリオの分だけ作ります。(その理由は、今後お伝えしていきます。)

小マリオの左上&右上ジャンプ全プログラム

総メガネ:割れたメガネ3分割×ステージ5つ分×左右2セット分=割れたメガネ10個
パーツ:タッチマーク、Aボタン、重力センサー、小マリオ、ステージブロック、割れないブロック、ハテナブロック、土管IN、土管OUT
59BF72F5-D754-42DB-B23A-28F4F8EA1676.jpeg
D7AFEFDB-FD60-4E7B-B6AA-7E6F4F11CA4F.jpeg

小マリオがジャンプできた!…が!?

20266845-ED4A-43A6-B386-6C7F25EE21CE.jpeg
E410C6A4-2C48-4510-8130-2956B2E1E399.jpeg
8F1DA877-05ED-4E25-BDFE-1C56BA535044.jpeg
B4A57253-BF35-41DC-AB89-64CB1E933188.jpeg

一旦天に舞い上がりし者、儀式無くして、別の地に降り立つことなかれ…

ジャンプしたままフリーズです。

着地して左右に動けるようにする判定が必要となります。

では、今回はこれまでです。次回は#7着地判定です。

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?