Grow a Garden をScratchで作る全5回シリーズです。この記事は第3回です。
第1回 3つの画面を切り替える
https://kidsprogram.co.jp/scratch30/growagarden1
第2回 持ち物・売るメニューの表示
https://kidsprogram.co.jp/scratch30/growagarden2
第3回 タネを選ぶ ＋ 買う ← いまこのページ
第4回 植える ＋ 育つ（準備中）
第5回 収穫 ＋ 売る（準備中）
前回の記事
第2回では、持ち物の数で見た目が変わるしくみを作りました。
Slotスプライトは5つのクローンが1本のスクリプトを共有していて、自分のコスチューム名を見て、自分の担当の変数を調べます。個数が0なら隠れ、1以上なら出てくる。この判定は「表示判定（こすう）」という引数付きのブロック定義にまとめてあります。
そのとき「Highlight」のクローンだけは 隠す だけにしておきました。今回、この中身を差し替えます。
【Scratch上級 3/5】Grow a Garden：タネを選んで買う【授業まるごと公開】
KIDSPROのオンライン授業を、そのまま公開！実際にスクール生と一緒に作った1時間の授業を、ほぼ編集なしでお届けします。
━━━━━━━━━━━━━━━━━━
▼ 目次
━━━━━━━━━━━━━━━━━━
00:00 はじめに（今回作るプログラム紹介）
01:23 テンプレートの解説
02:07 Seeds(タネ屋さん)：×ボタンのスクリプト
05:11 Seeds：Carrotボタンのスクリプト（もし〜でなければ／お金が足りるか判定）
11:27 Seeds：Strawberryボタンのスクリプト
15:23 Slot(スロット)：ハイライトを光らせる
21:16 タネを買って植えてみる
22:55 おわりに
【上級編3/5・完成版】Grow a Gardenを作ろう！第3回 タネを選ぶ ＋ 買う
https://scratch.mit.edu/projects/1389346788/
・いま選んでいるタネのスロットが光る（ハイライト）
・タネ屋さんのタネを押すと、お金を払ってタネが手に入る
・お金が足りないときは買えず、「お金が足りません」と出る
・×ボタンで店を閉じて、畑にもどる
前回まではずっと「見た目」を作っていましたが、今回からゲームが動きはじめます。
なお、キャロットを植える・育つ・収穫するスクリプトは、あらかじめテンプレートに入れてあります。買ったタネをその場で畑に植えて、育って、収穫するところまで遊べます。このスクリプトの中身は第4回でくわしく解説します。
▼ この回で使うテンプレート
https://scratch.mit.edu/projects/1389357770/
▼ 第3回の完成版
https://scratch.mit.edu/projects/1389346788/
★全5回を作りきった「フル機能版」はこちら↓
https://scratch.mit.edu/projects/1310372588/
Slot(スロット) ハイライトを光らせる
第2回では「Highlight」のクローンを 隠す だけにしておきました。今回、この中身を書き換えます。分岐を新しく足すのではなく、中身を差し替えるだけなので、先週書いた4つの表示判定には一切さわりません。
Slot(スロット)のスクリプト
- コスチュームの名前が「Highlight」のクローンだけが、この処理をします。
- もしも、変数「選択中の種」が「キャロットの種」で、かつ「キャロットの種」を1個以上持っているなら、X座標=-75、Y座標=-155 に移動して表示します。キャロットのスロットの位置です。
- そうでなければ、変数「選択中の種」が「イチゴの種」で、かつ「イチゴの種」を1個以上持っているなら、X座標=-25、Y座標=-155 に移動して表示します。
- どちらにも当てはまらなければ、隠します。
- これにより、タネのスロットを押すと、押したほうのスロットに光るわくが移動します。持っていないタネを選んでいる状態では、わくは出ません。
2つの条件が両方とも成り立っているときだけ、という意味です。片方だけではだめ。
ここでは「そのタネが選ばれている」と「そのタネを持っている」の2つを調べています。なぜ2つ必要なのでしょうか。
「選ばれている」だけで光らせてしまうと、持っていないタネを選んだままのとき、何も無いところに光るわくが出てしまいます。実際に試すと分かりますが、かなり気持ち悪い見た目になります。
「かつ」は、PythonやJavaScriptの and とまったく同じものです。
同じSlotスプライトの中で、形が2種類あることに気づいたでしょうか。
コスチューム名で分ける4つの判定は、もし を縦に並べる形。
Highlight の中は、でなければ でつなぐ入れ子の形。
違いは「どれにも当てはまらなかったとき、やることがあるかどうか」です。
4つの判定のほうは、どれにも当てはまらなければ何もしなくて構いません。だから並べて書けます。
ハイライトのほうは、どちらにも当てはまらなかったときに隠すという仕事があります。
これを並べる形にすると、わくが出っぱなしになります。スクリプトの上のほうを見てください。タイトル画面でなければ、まず全員が「表示する」されていますよね。そのあと各コスチュームが自分で隠れるかどうかを決める作りになっています。Highlightの「隠す」が無くなると、表示されたまま誰も隠してくれなくなるのです。
どれにも当てはまらなかったときにやることがあるなら、「でなければ」でつなぐ。この見分け方は、どのプログラミング言語でも同じです。
Seeds(タネ屋さん) タネを買う
第1回ではSeedsの「表示」だけを作りました。今回は押したときの処理を、まるごと新しく作ります。
Seeds(タネ屋さん)のコスチューム
コスチューム名：Carrot
コスチューム名：Strawberry
コスチューム名：Close
Seeds(タネ屋さん)のスクリプト
このスクリプトは、ひとつの「このスプライトが押されたとき」の中に、押されたボタンごとの「もし」が3つ並んでいる形です。そしてキャロットとイチゴの中だけ、さらにもうひとつ「もし」が入っています。画像の段差（へこみ）が2段になっているところを、まず目で確かめてください。
- 【外側の もし】コスチュームの名前が「Carrot」なら、キャロットのタネが押された、ということです。クローンは見た目（コスチューム）だけが違うので、名前で見分けます。
- 【内側の もし】「¢ ＜ キャロットの種の買値」── お金のほうが買値より少ない、つまり足りないときです。ここでは「買えるとき」ではなく、あえて「足りないとき」を先に聞いています。
- 【足りないとき＝「なら」のほう】Wrong音のメッセージを送り、「キャロットを買うのに、お金が足りません」と2秒言います。お金は減りませんし、タネも増えません。何も起きずに終わるのが正解です。
- 【買えるとき＝「でなければ」のほう】4つのブロックがまとまって入っています。
- ¢ を「0 − キャロットの種の買値」ずつ変える … 所持金が買値のぶんだけ減ります。
- 「キャロットの種」を「キャロットのロット数」ずつ変える … 1回買うと10個まとめて手に入ります。
- 「選択中の種」を「キャロットの種」にする … 買ったタネが、そのまま選ばれた状態になります。
- Correct音のメッセージを送る … 買えたという合図です。
- この「でなければ」は内側のもので、ボタンを見分ける外側のものではありません。ここをまちがえると、イチゴを押しただけでも「お金が足りません」と言われてしまいます。
- イチゴもまったく同じ形です。変数の名前とメッセージが違うだけなので、キャロットができたら自分で書けます。
- いちばん下にある3つめの「もし」です。コスチュームの名前が「Close」のクローンが押されたら、変数「現在の画面」を「Garden」にします。
- たったこれだけで、タネ屋さんの画面が消えて畑が出てきます。第1回で作った「ずっと現在の画面を見張る」しくみが、全部やってくれるからです。
- ここには内側の「もし」がありません。閉じるのに条件はいらないからです。入れ子が必要なところと、いらないところのちがいを見てください。
1ドル＝100セントの、あのセントです。本家のGrow a Gardenでは「シェケル」という名前の通貨で、マークが似ているのでここでも使っています。
ふつうに考えたら「買値 ≦ 所持金 なら買える」と書きたいところです。でもScratchの比較ブロックは ＜ ＝ ＞ の3つだけで、「以下」がありません。
ではどうするか。聞き方をひっくり返します。
「足りない？」とだけ聞いて、ちがったほう（でなければ）で買う。
「¢ ＜ 買値」── これなら ＜ 一個で書けます。そして「足りなくない」＝「買える」なので、「でなければ」のほうに買う処理を置けばいいわけです。
ここで大事なのが「ちょうど同じとき」です。初期所持金は10、キャロットの種の買値も10。ぴったり同じですよね。「10 ＜ 10」は成り立ちません。だから「でなければ」に進んで、ちゃんと買えます。
もし「¢ ＞ 買値 なら買える」と書いていたら、10＞10 が成り立たないので最初の1回が買えません。お金を増やす手段もないので、ゲームが始まった瞬間に詰みます。
同じ「＞」と「＜」でも、どっちの枝に処理を置くかで結果が変わる。プログラムではここが一番バグになりやすいところです。
Wrong音・Correct音は、このスプライトで鳴らしているのではなく、「○○を送る」でメッセージを飛ばしているだけです。受け取った側が実際に音を鳴らします。
こうしておくと、あとから音を差し替えたくなったときに受け取る側を1か所直すだけで済みます。買うところ・売るところ・収穫するところ……と、鳴らしたい場所が増えても同じです。
その瞬間に起きること＝メッセージ。ずっとそうであること＝変数。第1回から出てきているこの使い分けが、ここでも生きています。
Scratchの「ずつ変える」は足し算しかできません。減らしたいときは、マイナスの数を作って足します。
0 − 10 ＝ −10。これを足すから、結果として10減る。
最初のマスには 0 を打ち込んでおいてください。空のままでも0として計算されて動きますが、あとで見返したときに「ここ何も入っていないけど大丈夫？」と迷います。
購入の最後に「選択中の種」を入れているところに注目してください。これのおかげで、買った瞬間に光るわくがそのタネに移ります。
ハイライト側のスクリプトには、買う処理のことは一行も書いてありません。ただ「選択中の種」をずっと見張っているだけです。見張っているほうが勝手に気づいて動く ── 第1回で作ったポーリングが、ここでも効いています。
変数を1つ変えるだけで、見た目は全部あとからついてくる。この設計のおかげで、買う処理はこんなに短く書けています。
おまけ：買ったタネを植えてみよう
キャロットを植える・育つ・収穫するスクリプトは、テンプレートにあらかじめ入れてあります。今回作った「買う」とつなげて、そのまま遊べます。
- タネ屋さんでキャロットのタネを買う（10個手に入ります）
- Gardenボタンで畑へ
- 畑の好きなところをクリック → 苗が出てきます。タネが1個減ります
- しばらく待つ → 少しずつ大きくなって、実ります
- 実ったキャロットをクリック → 収穫されて、持ち物のキャロットが増えます
買う → 植える → 育つ → 収穫する まで、ひととおり動きます。
Gardenスプライトの「Carrotを植える」と、Carrotスプライトのスクリプトには、第4回でくわしく解説しますとコメントを入れてあります。
中を開いて見るのは自由です。「作物のX」「作物のY」という変数に場所を書いてから、Carrotのクローンを作っている ── このあたりが第4回の主題になります。スプライトからスプライトへ値を渡す方法です。
今回はまず、自分で作った「買う」が、ちゃんとゲームにつながることを体で確かめてください。
動きを確かめてみよう
- 旗を押して、タイトルからゲームを始める → 所持金は 10 ¢
- Seedsボタンでタネ屋さんへ → キャロットのタネを押す
- 買えた。所持金が 0 になり、スロットにキャロットのタネが出てきて、わくが光る
- そのままイチゴのタネを押す → 買えない。Wrong音と「お金が足りません」
- ×ボタンを押す → 畑にもどる
- 畑をクリック → 苗が出て、タネが1個減る
- ステージの ¢ を手で 50 に書きかえて、もう一度イチゴを買ってみる → 買える
- ステージの「キャロットの種」を 0 にする → スロットも光るわくも消える
3番と4番が今日の合格ラインです。買えるときは買えて、買えないときは買えない。これが動いていれば、条件分岐が正しく作れています。
ステージの初期化で、値段は自由に変えられます。自分のゲームの難しさを、自分で決めてみてください。
- キャロットの種の買値 … 1回買うのにかかるお金
- キャロットのロット数 … 1回買うと何個もらえるか
- 初期所持金 … ゲームを始めるときのお金
お題１：所持金をぴったり 0 にする買い方を見つけよう（初期所持金10なら、キャロット1回で0になります）
お題２：最初からイチゴも買えるようにするには、どこをいくつにすればいい？
お題３：一番やさしいゲームと、一番きついゲームを作ってみよう
次回予告
今回テンプレートに入っていた「植える」「育つ」を、今度は自分で作ります。
・畑を押すと、選んでいるタネの苗がその場所に出てくる
・放っておくと、少しずつ育って実になる
スプライトからスプライトへ値を渡す方法と、クローンごとに別々の値を持つ変数が出てきます。全5回のなかで一番の山場です。
MITメディアラボにより開発されたビジュアルプログラミング言語。子供たちが物語やゲーム、 アニメーションなどのインタラクティブな作品をプログラミングできる。また、自分の作った作品を世界中の人々と共有できるコミュニティーサイトでもある。世界中で1億人を超えるユーザがいる。
こちらのホームページにアクセスすれば無料で利用できる。
