画面端で跳ね返るボール

宿題

前回書いた、『ボールが右下に動いてゆくアニメ』をForkして、

『画面端に到達した時に、反射して戻ってくる表現を書く』

というお題。

どうせなら１回反射して終わりじゃなく、

x軸、y軸ともに反射処理を入れて、弾みまくるようにしたいな。

と思った。

実装方法

そこで、x軸y軸ともに向かう方向を数値で持たせ、

画面端でそれを反転させる処理を追加した。

その方向を判定して、x,yの値を足すか引くかを決定する。

できたものがコレ。

Animate Circles with Reflection(Failed) - wonderfl build flash online

判定

順調に画面中央から端に向かってボールが流れてゆく。

そして画面端で、反転！

やった、と思ったのもつかの間、

画面端で跳ね返ったと思ったボールが、

もう一度端に向かって跳ね返り、

ついには画面隅から出てこなくなってしまった。

敗因

方向の反転ロジックがおかしいんだろうな。

stage.width, stage.height, x, y あたりをいい加減に掴んでるから、

こういう事になるのかも知れない。

画面端の取得と、座標の取得のルールを再確認しよう。