・目覚まし時計を作ろう

このレッスンでは、目覚まし時計をつくっていくよ。 目盛りや針のうごき、アラームの設定や解除に変数や繰り返し処理がつかわれているよ。 場合分けの条件や回数を変数で制御することになれていこう。

これは、ステージがえらばれているときの表示だからスプライトを選択すれば、動きのロックも表示されるから安心してね。

時計には長い針と短い針、そして秒針があるね。 さらに、文字盤には目盛りがあり、読みやすいように、５分ごとに色と大きさがかわっているよ。

さらに、目覚まし時計の機能をつかうための「set」ボタンと「stop」ボタンがあるね

「set」ボタンを押すと 「何時？」「何分？」と聞かれ、 時刻を指定すると、指定された時刻でアラームが鳴り、 「stop」ボタンを押すと音が止まるよ。 実際に作っていこう！

・背景・スプライトの調整をしていくよ

このチャプターでは、背景とスプライトをScratchに設定していくよ。 今回のレッスンで必要な背景とスプライトは、みんなに描いてもらうことにするよ。 自分だけのオリジナル時計をデザインできるので、がんばってね！

まずは、背景を設定していくよ。 新しい背景を描くボタンをクリックして描き始めよう。 右下がベクターモードになっているかを確認してね。

ベクターモードになっていなかったらベクターに変換ボタンを押してね。 四角形のツールをつかって画面いっぱいに四角形を描いてね。 つぎに図形の色のツールをつかって、描いた四角を黒く塗りつぶしてね。

これで背景は完成だよ！もともとあった背景は消しておこう。

つぎにスプライトを設定していこう。

でも、このレッスンでは、スプライトは自分で描いてみるので、ダウンロードする必要はないよ。

かわりに、新しいスプライトを書き、penという名前にしておこう。 何も描かなくてOKだよ。 さあ！ここまで、みんなの画面でもやってみよう！

・目盛を丸く並べて描こう

このチャプターでは、時計にひつような目盛りを描いていくよ。 penのスプライトにスクリプトをつくっていこう!

時計の目盛りは全部で60個あるよね。 １つずつ座標を指定して描いてもいいけど大変だね。 同じことの繰り返し処理なので、制御の中にある[～回繰り返す]というブロックをつかっていくよ。

「目盛りを描く」という繰り返し処理について説明するね。 丸く点を並べて描くためには、中心からみて角度と長さをきめればいいんだ。

たとえば、まず、1分の点を描くことにするよ。 中心からみて真上から6度ずれた所に点をうつ。 続けて、2分の点を描くよ。 中心からみて、1分の点から6度ずれたところに点をうつ。 これを60回くりかえせば、目盛りがかけそうだね。

また、中心からみて、140歩くらい離れた所に点をうつことにするよ。 中心から見て、目盛りを描く方向は変わるので、変数をつくろう。

データの中にある変数をつくるボタンをクリック、変数名は『角度』としておこう。

左下の拡張ボタンからペンを追加しよう。

値は中心からみて、点を描く方向の値が入るよ。 角度0からはじめて、6度ずつ繰り返しながら、60回繰り返すというブロックをつくっていくよ。

変数をつかった繰り返し処理は最初の値と変化のさせ方を決めるためにとても大切だよ。 つぎに、くりかえす処理をつくっていくね。

中心0,0にすることと、変数『角度』にすること、 長さは140とすることをわすれないようにしてね。 ペンを下ろす前に、色と太さをきめておく必要があるよ。

ブロック定義の中にある、ブロックをつくるボタンをクリックして、「目盛を描く』ブロックを作ろう! オプションの「画面を再描画せずに実行する」にチェックするのをわすれないようにしてね。

・割り算の余りを使って場合を分けよう

このチャプターでは、目盛りを読みやすくしていくよ。 penのスプライトにスクリプトをつくっていこう!

このままでは目盛りが読みにくいので、5分ごとに大きな目盛りになるように調整していくよ。

場合を分けるので、制御の中にある [もし～ならでなければ]のブロックをつかっていこう！

ペンの色は好きな値でいいけど太さは10と4にしておこう。

[もし～]の中には何を入れればいいかな？ ペンの太さを太くする処理なので、5分や10分、15分のときだね。

角度でいうと真上から30度、60度、90度のときだよ。 30度変わるごとに、という規則に気づいたかな？ こんなときは、[～を～で割った余り]ブロックをつかうといいよ。 実際にブロックをつくってみよう！

これで、角度が30度ふえるごとに 場合を分ける条件ができたよ。 つくったブロックを組み合わせよう。

これで場合分けは完成だね。 仕上げに、目盛りを描くブロックに合体させるよ。

最後に、グリーンフラッグがクリックされたときのブロックのかたまりに、「目盛りを描く」という定義ブロックを追加しておこう。

ここまで完成できたら、グリーンフラッグを押して動作を確認してみよう。

目盛りが丸く並べて描かれていて、5分ごとに大きくなっていればOKだよ。

さあ！ここまで、みんなの画面でもやってみよう！

・秒針を描く処理をつくっていこう

このチャプターでは、時計の秒針を描いていくよ。 penのスプライトにスクリプトをつくっていこう!

秒針は、常に変化しているから変数が必要だね。 いつもなら変数を作るけど、時刻は調べるの中に[現在の～]という変数ブロックが用意されているから使っていくことにするよ。

秒針は1秒間に6度ずつ動くね。 たとえば、今この瞬間が10秒だったとすると、6度×10秒=60度の方向に針がある。 11秒になると6度×11秒=66度の方向に針がある。

この仕組みを「秒針を描く」という定義ブロックにしていこう。 まずは、秒針を描く角度をきめていこう。 調べるの中にある[現在の～]ブロックと演算の中にある[～*～]ブロックをつかうよ。

現在の秒×6が秒針を描く角度ということだよ。

秒針を描く角度がきまったら、秒針を描く処理をつくっていこう。

ペンを下ろして、120歩動かしてペンを上げれば秒針の完成だね。

つくったブロックどうしをつなげよう。

仕上げに、ペンの色と太さ、最初の座標をきめていくよ。

ここまで完成したら、定義ブロックをつくっておこう。

その他の中にある、ブロックをつくるボタンをクリックして、オプションの 「画面を再描画せずに実行する」にチェックするのをわすれないようにしてね。

最後に、グリーンフラッグがクリックされたときのブロックのかたまりに、 「秒針を描く」という定義ブロックを追加しておこう。

ここまで完成できたら、グリーンフラッグをおして動作を確認してみよう。 1秒ごとに、秒針がうごいていればOKだよ。 さあ！ここまで、みんなの画面でもやってみよう！

・長針を描くために、[現在の～]ブロックをつかおう

このチャプターでは、時計の長針を描いていくよ。 penのスプライトにスクリプトをつくっていくこう!

秒針を描いたときと同じように「長針を描く」という定義ブロックにしていこう。

たとえば、今この瞬間が17時40分だとすると、6度×40分=240度の方向に針があり、 17時41分になったら、6度×41分=246度の方向に針がある。ということだね。

時計の長針は1分ごとに変化するから、変数を用意するよ。

時刻に関する変数は、調べるの中にある[現在の～分]ブロックをつかえばいいね。

長針を描く角度がきまったら、ペンを下ろして、100歩うごかしてペンを上げれば長針の完成だね。

仕上げに、ペンの色と太さ、最初の座標をきめていくよ。

ここまで完成したら、定義ブロックをつくっておこう。

ブロックの定義の中にある、 ブロックをつくるボタンをクリックしてオプションの 「画面を再描画せずに実行する」にチェックするのをわすれないようにしてね。

最後に、グリーンフラッグがクリックされたときのブロックのかたまりに、 「長針を描く」という定義ブロックを追加しておこう。

ここまで完成できたら、グリーンフラッグをおして動作を確認してみよう。

・[現在の～]をつかって、短針を描こう

このチャプターでは、時計の短針を描くよ。 これまでと同じように、定義ブロックをつくっていくよ。 penのスプライトにスクリプトをつくっていこう!

みんなの家にある、時計の短針の動きはどうなっているかな？

短針は1時間の間に少しずつうごいているよね。 1時間で30度ずつうごくから、1分だと30÷60=0.5度ずつうごくね。 たとえば、今この瞬間が4時40分だとしたら4時の30度×4時=120度と40分の0.5度×40分=20度の合計140度の方向に短針があることになるね。 ※1つ注意があるよ。 [現在の～]ブロックは0～24の値になるんだ。 たとえば、午後3時の時現在の時ブロックはではなく15という値になるんだ。

針を描く方向を、場合分けしたいから、制御の中にある[もし～なら、でなければ]のブロックをつかっていけばいいね。

場合を分ける時の条件を考えていこう！ 時刻が12時より大きいか大きくないかで分けていくといいね。 作ったブロックを組み合わせよう。

これで、12時より大きいか、大きくないか針を分ける方向の場合分けが完成だね!

針を描く方向がきまったので、具体的に値を考えていこう。 演算の中にあるブロックと、調べるの中にある[現在の～]ブロックを組み合わせていこう！

12時より大きい場合は、現在の時から12を引くことがポイントだよ。 12時より小さい場合の値も作っていこう。

作った値を組み合わせて、12時より大きいときと、そうでないときの値を完成させよう!

値が完成したら、 [もし～ならでなければ]のブロックのかたまりに値を追加しよう。

仕上げに、ペンの色と太さをきめていこう。 また、長針のときと同じように、ペンの最初の座標も指定してあげよう。

ペンは短針だから、長針より短い長さ、50にしておこう!

ここまで完成したら、 定義ブロックをつくっておこう。 ブロック定義の中にある、ブロックをつくるボタンをクリックして、 オプションの「画面を再描画せずに実行する」にチェックするのをわすれないようにしてね。

最後に、グリーンフラッグがクリックされたときのブロックのかたまりに、「短針を描く」という定義ブロックを追加しておこう。 ここまで完成できたら、グリーンフラッグをおして動作を確認してみよう。 短針のうごきはすごく小さいからすぐには分からないけど、また別の時刻で正しく表示されていればOKだよ。

ここまで、みんなの画面でもやってみよう！

・[現在の～]をつかって、短針を描こう

このチャプターでは、アラームの機能をつくっていくよ。 背景にスクリプトをつくっていくよ！ まずは、アラーム機能全体の処理について説明するね。 アラームとは、//セットした時刻まで待つ//ストップになるまで、アラームは繰り返すという機能だね。

これを少しずつ組み立てていくよ。 最初に、アラームが鳴っているあいだのブロックを組んでいくね。 背景にスクリプトをつくっていくよ。 ストップボタンがおされるまで、アラームがくりかえされるから、制御の中にある [～まで繰り返す]と[～回繰り返す] というブロックを組み合わせるよ。

音ブロックの値は、みんなのすきな数字にしていいからね。 つぎに、アラームの機能を作るための、変数を3つ作ろう。

• アラーム時(セットするアラームの時)
• アラーム分(セットするアラームの分)
• ストップ(1のときはストップされる)

変数がつくれたら、実際につくっていくよ。 ストップという変数は、1か0という値にするよ。

ストップという値が 0のときはアラームが鳴り 1になれば音が止まる というブロックにしていこうすでにつくってあるブロックと組み合わせよう！ これで、アラームが鳴る仕組みと、ストップする仕組みは完成だよ。

つぎに、アラームが鳴るタイミングを調整するブロックをつくっていくよ。 今回は、制御の中にある[～まで待つ]のブロックをつかっていくことにするよ。

つくったブロックを組み合わせよう。 これは、アラームを設定した時刻の時と分が、どちらも現在の時刻と同じになるまで待つという意味だよ。

「どちらも」に対応するのは、演算の中にある[～かつ～]というブロックだよ。 すでにあるブロック同士をつなげよう

最後に、変数をつかったときの注意について説明するね。 グリーンフラッグをおすたびに初期化しておくひつようがあるね。 すでにあるブロックとつなげよう。

最後に、グリーンフラッグがおされたときにつなげよう。

これで、アラームが鳴る機能鳴るタイミングと鳴る条件、止める条件が完成したね！ みんなの画面でもやってみよう！

・機能を動作させるためのボタンを自分で描いてみよう

このチャプターでは、アラームをセットするボタンをつくっていくよ。 スクリプトを作るスプライトをまちがえないように注意してね。 新しいスプライトを描くボタンをクリックして右下のベクターモードにしてから描き始めるよ。

たとえば、丸いボタンを描いてみるね。 塗りつぶしたいをきは、塗りつぶしボタンをおして、丸の中でクリックだよ。 文字を入れたい場合は、テキストを挿入するボタンをクリックして「set」と描いてね。 ストップボタンは四角を描いてみよう。 色は自分だけのオリジナルでいいよ。 すきな色で描いてね。 setボタンの位置を座標で指定しておこう。

setのスプライトのスクリプトをつくろう。

setボタンとstopボタンのx座標は同じ値にしておくといいよ。 stopボタンの位置を座標で指定しておこう。

stopのスプライトのスクリプトをつくろう。

setボタンとstopボタンのx座標は同じ値にしておくといいよ。

つぎにsetするボタンがクリックされた時のスクリプトをつくっていくよ。 setボタンのスプライトがクリックされたときアラーム時とアラーム分がセットできるようにしたいよね。 そんな時は、[〜と聞いて待つ]ブロックをつかえばいいよ。 データの中にあるブロックと組み合わせていこう！

調べるの中にある答えブロックは、一番最後に聞いた答えを値にしてくれる便利なブロックだよ。 つぎに、ボタンがおされた時の見た目の効果が変わるようにしておこう。 見た目の中にある[～の効果を～にする]ブロックをつかうね。

つくったブロックを、[このスプライトがクリックされたとき]とつなげよう。 これで完成だね。

アラームの機能はできたけど、 鳴ったアラームを止める機能がないね。 stopボタンのスクリプトを作っていくよ。 stopボタンがクリックされた時に、変数「ストップ」が1になればいいね。

変数ストップについて、もうちょっと説明するね。 ストップという変数は今回0または1という値になるようにしているよ。 値が1のときは、音がならないという状態を表す変数だよ。 よくつかうので覚えておこう！ ここまで完成したら、動作を確認してみよう。

• setボタンを押して、アラームを設定して、アラームが鳴ること
• stopボタンを押して、アラームが鳴りやむこと

を確認できればOKだよさあ! ここまで、みんなの画面でもやってみよう!

・まとめ

最後に、このレッスンで学習したことをおさらいしてみよう。

まず、目盛りを描く時に、5分ごとにペンの太さを変えるスクリプトを作ったね。 規則的にくりかえしたいときは、 [～を～で割った余り]と [～回繰り返す] ブロックを組み合わせればいいね。 また、定義ブロックをつかうことで、スクリプトが読みやすくなったことも大切なポイントだね。

これで、動かした時に、自然に歩く動きができるようになるよ！ 最後に、スタートした時に変数を0にしてリセットするのもわすれないようにしよう。 実際にゲームをスタートして動かして見てね！

アラームがなる仕組みでは、[～まで待つ]ブロックをつかったね。 普通、スクリプトは上から順に処理されるんだけど、条件を満たしたときしか、処理を進められないようにしたいときにつかうブロックだよ。 これも今後よくつかうからしっかり理解しておこう！