動画？For文とDo文そして絵を利用した例題

・パラパラ漫画のようにPictureBoxを動かしてみよう。

○PictureBoxを動かしてみよう；原理はパラパラ漫画？

• つまらない授業などの際、本の端っこにパラパラ漫画を書いたことはないですか？
  パラパラ漫画は、ちょっとづつ絵を動かすことによって、動いたように見えるという原理です。
• PictureBoxの位置をプログラムで変え、動かす（瞬間移動？）する方法は学びましたね。
• これを利用して、PictureBoxをちょっとづつ動かして、移動しているように見せてみましょう。
• 例えば、Picture1.Left = 0 → Picture1.Left = 1 → Picture1.Left = 2 → Picture1.Left = 3 → …
  とするとどうなるだろうか？
• Picture1.LeftつまりPicture1という名前のピクチャーボックスコントロールの左側の位置を０にすると、Form画面の一番左に移動する。そして、１にすると画面左から１だけ離れた位置に移動する。これを繰り返していくと、、、端から動いていくように見えるはず。
• ここまでのプログラムは以下のようになるはず。
  ScaleMode = 3
  For x = 0 To 100
  　Picture1.Left = x
  Next x
• しかし、実はこれではうまく動いているように見えない。
  なぜならば、早すぎるからである。あっという間に移動して移動しているように見えない。
• そこで、次のように、移動させたらちょっとお休みさせてみよう。

ScaleMode = 3
For x = 0 To 100
  Picture1.Left = x
  For k = 0 To 5000000: Next k
Next x

• 空のFor文の数はコンピュータの性能によっても変わってくるので、適当な数値に調整してみよう。

○画面の端から端へ移動

• 上記例は、画面左から１００だけ移動させたが、画面左端から右端（ぎりぎり）まで移動させるプログラムを作ってみよう！
• 但し、For文ではなく、Do文を使って書きましょう。

○ガタガタ移動

• 上記例では、スムーズに右に進んでいく。
• 今度は、ちょっとガタガタと進むようにしよう。
• 考え方は、グリコ・チヨコレイト・パイナツプルじゃんけんと似たように考えてみる。
• 上記例は、必ず１つづつ右隣に移動をしていたが、場合よっては一度の２つもしくは３つ、、、移動させてみる。
• つまり、さいころを振って、１が出れば１だけ隣に、６が出れば６だけ隣に移動するようにする。
• こうすると、例えば１が続けて出ればゆっくりと進み、６が続けて出ると早く移動しているように見える。

○二つのPictureを移動させてみよう

• 上記例では１つのピクチャーボックスを移動させていったが、今度は二つのピクチャーボックスを用意して、二つを進ませてみよう。
• 二つ同時に移動することはできないが、コンピュータはとても早いので、一つを移動してすぐにもう一つを移動すれば同時に移動しているように見える。
• For文によって二つのPictureを５０回進めてみるプログラム例は次のようになる。

ScaleMode = 3
Randomize
Picture1.Left = 0
Picture2.Left = 0
For n = 0 To 100
  Picture1.Left = Picture1.Left + Int(Rnd(1) * 6) + 1
  Picture2.Left = Picture2.Left + Int(Rnd(1) * 6) + 1
  For k = 0 To 1000000: Next k
Next n

• 原理が分かったら、Do文で書いてみよう！
• 終了させるのは、まずはPicture1が画面右をはみ出したらとしてみよう。
  Do文の終了条件は＝ではうまくいかないことに注意しよう。
  これはゴールをまたいでしまう場合があるから（以下でも同じ）。
• 次にPicture1が画面右に付いたら（超えたら）としてみよう。
• 更に、Picture1もしくはPicture2のどちらか先に着いたらとしてみよう。
• 更に、画面の８０％のところにゴール線をLineで引いて、そこに先に到達したら終了させてみよう。
• そしてそして、どちらが勝ったのかを表示させてみよう！
  移動後に、どちらのPictureが右にあるのかを判定すればよい。

○色々な工夫

• 上記例では、Pictureを左から右へ移動させているが、右から左、上から下、下から上などは簡単に変更できるはず。
  位置、大きさなどの座標系を思い出せば簡単。
• ちょっと工夫すれば、まっすぐ移動せず、ちょっとだけふらふら移動させることもできるぞ！
• 勿論、３つ、４つなどのPictureを移動させることもできる。
• sin()関数を使えば波を打つように移動させることもできるぞ（以下の簡単な例参照）。

ScaleMode = 3
Picture1.Left = 0
yy = Picture1.Top
For n = 0 To 3.14 * 12 Step 0.1
  x = Picture1.Left + 1
  y = yy + Sin(n) * 20
  Picture1.Left = x
  Picture1.Top = y
  For k = 0 To 1000000: Next k
Next n

• 複数を円を描くように移動させるのはかなり難しい。。。（今の段階では）

[「Ｃ班」プログラミング基礎のTopに戻る]