5 障害物を作ってみよう

このプロジェクトでは，車のワープや障害物の製作を通じて，オブジェクトの持っている「変数」とその「値」という概念を学びます． 変数の値を変更するための「変更タイル」を使えば，「座標」変数を使ってオブジェクトを動かすことができます． また，「変数タイル」を場合分けと組み合わせることにも挑戦します．

プログラミングに関するキーワード

• 変数
• 値
• 座標

Squeakに関するキーワード

• 変数タイル
• 変更タイル

5.1 変数

M先生

さて，次のプロジェクトに進もう．今度はproject4だね．

Ｓくん

実は既に少し実験をしてました．

M先生

どんなことだい．

Ｓくん

障害物の岩石を作ってみたんです．これに車が衝突すると，車がスタート地点にワープするようなものを作りたいんです．

M先生

なるほど．ちょうどいい例題だね．

Ｔさん

私も一緒に考えてたんですけど，どうやったらいいか分からなくて．

M先生

車をワープをさせるためには，ビューアーの新しい使い方を勉強する必要がある．車のビューアーを開いてごらん．

Ｓくん

はい．

M先生

これまでは基本やセンサーといったカテゴリを使ってきたけれど，「X座標」や「Y座標」と書かれたタイルを探してくれるかい．

Ｓくん

ありました．

M先生

これを「 変数タイル 」と呼ぶ．車をマウスで動かすとタイルの表示はどうなるかな？

Ｓくん

数値が変わりますね．今までは気にしてなかったけど，「方向」とか，他にも色々な変数タイルがあるんですね．

Ｔさん

あっ，オブジェクトの変数を見るためのものだから，ビューアーという名前なんですね？

M先生

その通り．車をマウスでつかんで動かすと，座標の 値 はどうなる？

Ｓくん

車の位置によって変化しますね．

M先生

色々動かして，Squeakの画面の「 座標 」がどうなっているかを調べてみなさい．

Ｔさん

X座標は横方向の位置を表しているようですね．Y座標は縦方向です．

Ｓくん

画面の右上に行くにしたがって増えていくから，左下が（0,0）となりますね．

Ｔさん

図で描くとこんな感じかな．

Ｓくん

数学でやったXとYの座標軸とおんなじだ．

M先生

そうだね．

5.2 変数と値の変更（1）- 値指定

Ｓくん

でもこれが，ワープと何の関係があるんですか？

M先生

マウスで車を動かすと，座標の値が変わるのが分かったよね．逆に座標の値を変更できれば，オブジェクトを移動させることができる． そのためのタイルが，変数の「 変更タイル 」だよ．

Ｔさん

これですね．

M先生

この命令を実行すると，X座標の値が設定した数値に変更されるんだ．

M先生

まずは，実行すると車がスタート地点にワープするスクリプトを作ってみようか．

Ｓくん

えっと，スタート地点のX座標が分からないや．

Ｔさん

車をスタート地点に移動させて，ビューアーで確認すればいいじゃない．

Ｓくん

そうか．えっと，スタート地点のX座標は100だから．．．こうですね．

M先生

じゃあ次は，車が岩石と衝突したか調べて，衝突していたらワープするようにすればいいだけだよ．これは前のprojectの復習だね．

Ｓくん

はい．できました．

5.3 変数と値の変更（2）- 差分指定

M先生

今度は何をしているんだい？

Ｓくん

岩石が置いてあるだけではつまらないので，落石みたいにしようかと思って．．．．

Ｔさん

男の子は好きだよねー，そういうの．

M先生

先生も好きだけどね．で，何か問題があるのかい？

Ｓくん

回転しながら落下するようにしたいんですが，回すと進めるを組み合わせても，やっぱり円を描くだけなんですよ．

M先生

そうだね．じゃあちょっとヒントを出してあげようか．「進む」タイルを使わないでオブジェクトを移動させるってことかな．

Ｔさん

さっき習った座標を使うんじゃないかな．Y座標をだんだんと減らしていけば，岩石は画面の上から下に進むはずだよ．

Ｓくん

そうか，こっちの変更タイルを使えばいいのか．

Ｓくん

あれ，岩石が真横に動くー．

Ｔさん

Y座標を減らせば下に落ちていくはずでしょ．落ち着きなさいよ．

Ｓくん

Y座標から5を引くことを繰り返せばいいんだ．「足す」とか「引く」とかは変更できるんだね．できたー．落石っぽい動きになったよ．

Ｔさん

あれ，お気に入りの落石が画面の外に行っちゃったよ．

Ｓくん

わー，どうしよう．先生助けてください．

M先生

落ち着いて．岩石のビューアーは開けるかい？オブジェクトが画面になくとも，画面の右端のタブをクリックすればビューアーが開けるはずだ．

Ｓくん

はい．あっ，Y座標が-100000になっている．まずはスクリプトを止めて，Y座標を画面内の値に変更すればいいんですね．

M先生

そうだね．

Ｔさん

もし，ビューアーが開けないときはどうしたらいいんですか？

M先生

その場合，ワールドのビューアーを開いて，「 遊び場 」カテゴリの「 迷子を連れ戻す 」を実行すればいいんだ．

5.4 変数を使った場合分け

Ｓくん

うーん．これだとうまく動かないなー．

Ｔさん

どうしたの？

Ｓくん

車がワープするのと同じ要領で，岩石が繰り返し落ちてくるようにしたんだ．みてみて．

Ｔさん

すごいじゃん．それで？

Ｓくん

岩石の落下スピードを速くすると，うまくワープしなくなるんだ．どうしてかな？

Ｔさん

スクリプトが1回実行されると岩石は何ドット進む？

Ｓくん

200ドットかな．

Ｔさん

落下中は，ワープの開始地点に来たかどうか調べて，開始地点でなければ200ドット進む，を繰り返すよね．

Ｓくん

そうか．ワープの開始地点かどうかを調べるのは200ドットおきなんだね．

Ｔさん

ワープ開始地点の目印をもっと太くすればいいんじゃない？

Ｓくん

そうか．．．こうすれば，ああ，うまくいったね．

M先生

そういう方法もあるね．

Ｓくん

えっ先生，他に方法があるんですか？

M先生

座標を調べることができれば，同じことができるはずだね．

Ｔさん

落石のY座標がワープ開始地点の座標かどうかを調べればいいんですね．

M先生

そうだね．Y座標の変数タイルを直接スクリプトの中に入れてごらん．

Ｓくん

こうですね．

Ｓくん

あっ，タイルが変わった．

Ｔさん

これで，ワープ開始地点のY座標を入力すればできあがりだね．

練習問題

5.1

画面の左から右へ流れ続ける流れ星のアニメを作ってみましょう．

5.2

座標制御だけを使って，以下のような図形を描いてみましょう．

1. 四角形
   
2. 階段
   
3. 三角形を座標の制御だけで描くことができるかどうか考えてみましょう．
   

5.3

岩石にあたると車がワープするという例題を以下のように改造してみましょう．

1. 上から降ってくる岩石にあたると，車がスピンするようにしてみましょう．
2. リセットボタンを作って，押すと車がスタート位置に戻るようにしてみましょう．

5.4

星を使ったアニメーションを作ってみましょう．

1. 星が消えたり現れたりする
   
2. 星が黄色と赤色に点滅する
   

5.5

スロットマシーンを作ってみましょう．

5.6

本物と同じように時を刻むデジタル時計を作りましょう．

　※ 部品フラップにある時計オブジェクトを使うのはダメですよ．