「Scratchでパズドラっぽいゲームを作ってみた」を解説してみた　その１

ニンジャからパズドラみたいの作りたい！ってリクエストがありました。
うーん、難しいなぁと思ってネットで探したらQiitaの記事で「Scratchでパズドラっぽいゲームを作ってみた」を見つけました。

ニンジャには難しいかなと思ったけど、普段使わない機能満載で勉強になるしと変数名などを変えて、できるだけわかりやすくして解説してみました。
説明が長いので何回かに分けて掲載します。

解説その１は「Scratchでパズドラっぽいゲームを作ってみた」の「ドロップを描画する」「ドロップを生成する」「Tableを描画する」をまとめて解説しました。
※定義名・変数名はいくつかわかりやすいように（わかりにくいかも）変更しています。
解説のためのコードはこちらです。
頑張って一緒にコードを読んでいきましょう！

ここで使われている「ブロック定義」「リスト」についてはわかりやすい記事があるのでそちらを参考にしてください。
ブロック定義の使い方
 プログラミング初心者のためのScratch（スクラッチ）入門-リスト（配列）

ドロップの大きさなどの初期値を決める

40×40の大きさのドロップを右に5、下に5の隙間を開けて横6列×縦6行=36個描きます。描き始める左上のX座標とY座標を決めます。

定義「テーブルに1〜6までの値を入れる」

定義「テーブルに1〜6までの値を入れる」は元記事の定義「ドロップsを生成する」です。「テーブルの横の個数×テーブルの縦の個数回繰り返す」で、横6×縦6＝36個のリスト「テーブル」に「1〜6までの乱数」の値を入れています。

定義「テーブルを表示する」

ここでは横6個×縦6個並んでいるすべてのテーブルで左上から順番に定義「ドロップを表示する。テーブル上の　テーブルの何列目か　テーブルの何行目か」を実行するようにしています。

「テーブルの何列目か」と「テーブルの何行目か」を0にして初期化し、
（1) テーブルの何列目かを0にします。（下で1ずつ変えているので繰り返す前に初期化します）行の何列目かを定義「ドロップを表示する　テーブルの何列目か　テーブルの何行目か」で表示して何列目かを１ずつ変えて０列〜5列までの6回繰り返します。
（2) 「テーブルの何行目かを1ずつ変える」で0行〜5行まで（1)を繰り返すとすべてのテーブルで「ドロップを表示する」ことができます。
つまり列・行を０
「テーブルの横の個数繰り返す」で
0列　0行
1列　0行
2列　0行
3列　0行
4列　0行
5列　0行
それが終わると行を＋1、列を0にして「テーブルの横の個数繰り返す」
0列　1行
1列　1行
2列　1行
・・・・
というふうに「テーブルの縦の個数繰り返す」で5行まで繰り返します。こういう繰り返しはよく使われるので覚えておくと便利です。

定義「ドロップを表示する。テーブル上の　何列目　何行目」　

この定義は何列目・何行目から、処理しているドロップがテーブルの何番目かを定義「ドロップの位置を取得する　テーブル上の　何列目　何行目」を使って出して、定義「ドロップを表示する　X Y テーブルの何番目か」でドロップのX座標とY座標を計算してドロップを表示します。

定義「ドロップの位置を取得する　テーブル上の　何列目　何行目」

何番目のドロップかを「何列目」「何列目」から計算しています。

ドロップの列と行は0から始まるので何番目かは+1します。行は横に６個なので６×何行目、それに何列目と1を足して計算します。
図の例　何列目０　何行目０　→ （（6 × 0）＋ 0 ) + 1

「何列目」「何行目」は上で見たように0行目の0列～5列、1行目の0列～5列というように数字が変わっていきます。

定義「ドロップを表示する　X Y テーブルの何番目か」を使う

ドロップを書き始める左上のX座標とY座標を計算しています。

何列目かが1つ増えるたびにドロップの書き始めのX座標はドロップの大きさ＋隙間（40+5）分ずつテーブルの初めのX座標より右（＋）に移動するので、「テーブルの初めのX座標」＋（何列目×（ドロップの大きさ+隙間））で計算します。
5列までY座標は変わりません。

何行目かが1つ増えるとドロップの書き始めのY座標はドロップの大きさ＋隙間（40+5）分ずつテーブルの初めのY座標より下（ー）に移動するので、「テーブルの初めのY座標」-（何行目×（ドロップの大きさ+隙間））で計算します。
例　０列　０行　　X座標　-100 + (0×(40+5))　　Y座標　150 – (0×(40+5))

ドロップの何番目かは上の「ドロップの位置を定義する」で計算された数字が入ります。