ドムドムその８：壁を作って弾ませよう

さてさて。前回の「何秒ボールを画面から逃さないでいられるかゲーム」いかがでしたか？

イラッと来るヒマもない程あっという間に消えていきますね。
チャンスなんてそんなもんさ、YOU。ってなもんです。

では今回はボールを画面から逃がさないように、
画面の端に壁を作ってみようと思います。

考え方から先に言うと、別に壁を作るわけではなく、
「この辺まで来たら跳ね返れ」というプログラムを書くイメージになります。

この手のプログラムにあまり馴染みが無い方からすると、

「動き出したボールがそもそも画面から消えていく」

つまり。

ボールは画面というものを全く認識していない。
という事実は結構衝撃的なものじゃないかと思います。

マリオのおっさんでさえもう少し画面の端を意識していましたもんね。

ですが、残念ながら

ひろーい空間の中に点のように画面があって、
その範囲に対象のオブジェクトがある間だけ画面に表示されている。

こういう見方が、正解なんです。

つまり、画面から逃がさないためには、
常に画面内の位置を指定しておくということになります。

実際のコードで見てみましょう。

domdomViewController.m

＜クリックで拡大＞

前回作った、moveBallメソッドの拡張になります。
ドムドムその７：ImageViewを動かしてみよう

ボールの位置を算出した後、実際にボールの位置を修正する前に、
位置が画面の外になっていたら補正するイメージです。

// 衝突判定(X軸左方向)
if(posX <= ball.image.size.width/2){ vx *= -0.8; posX = ball.image.size.width/2; }

コレで1セット。
iPhoneを縦にもって左方向に画面が消えていくのを弾きます。

まずはif文で、弾く条件を決めます。
ここでは「位置（posX）が画面の外に出ているかどうか」を見れば良いので、

ball.image.size.width/2
ボールオブジェクト内の画像プロパティの持っているサイズの横幅　割る　２

簡単に言うと「posX」が「ボールの半径」より小さければ「画面の外に出てる」と判断しています。

なぜ半径かというと、前回も触れましたが、

// ボールの中心座標を修正するメソッドCGPointMakeを使って最初の位置を設定
ball.center = CGPointMake(posX, posY);

このposXは常にボールの中心を指していますので、
中心から半径分先に画面の外があったら、もうボールははみ出していることになります。

で、その条件を感知したらこの2つ。

vx *= -0.8;

速度を反転させます。
「加速度」でも「位置」でもないですよ。「速度」を反転させます。
そうすることで、まさにボールが壁に当ったように逆方向に動きます。

-1にせず-0.8にしているのは、-1にしているとスーパーボールみたいな弾み方になるからです。
壁に当たっても力が減らないんですね。
少し減らすと、それっぽくなります。

posX = ball.image.size.width/2;

位置を調整します。
これはお約束みたいなものなのですが、
細か～くみると、この条件になっているほとんどの場合、ボールは既に壁にめり込んでいます。

めり込んだ状態から逆方向の速度で跳ね返るのですが、
運悪く速度が遅いと跳ね返ってもまだ壁の中。
という現象が起こることがあります。

そうすると、また条件的には速度の反転が起こってしまい、
結果壁にハマります。

そうならないように、位置を壁ギリまで戻してしまうんです。
これでハマらなくなります。

同様に、後3つの方向も同じ処理を入れておきます。

// 衝突判定（X軸右方向）
if(posX >= 320 – ball.image.size.width/2){
vx *= -0.8;
posX = 320 – ball.image.size.width/2;
}

// 衝突判定(Y軸上方向)
if(posY <= ball.image.size.height/2){ vy *= -0.8; posY = ball.image.size.height/2; } // 衝突判定(Y軸下方向) if(posY >= 480 – ball.image.size.height/2){
vy *= -0.8;
posY = 480 – ball.image.size.height/2;
}

うっかりしてしまいそうなこと1点。
Y軸は上が0で下が480ってことを覚えておいて下さい。

座標0,0は左上に設定されていますので、
X軸は右に行く程数字が大きく、Y軸は下に行く程数字が大きくなります。

学生時代に真面目に勉強していたアナタやワタシのような人間ほど
上にいくほど数字が大きくなるような感覚が残っていますので、
是非お気をつけ下さい。

さてさて。
「ビルドして進行」してみましょうか。

ポーン。
ポーン。

おお。跳ねますね！

ようやくここまで辿り着きました。
「ビジュアル版机の傾きチェッカー」完成です！