0
    「iPhoneアプリを作ろう」も
    そろそろゲームらしさが出てきました

    しかし!
    キリンさんとライオンさんによる追いかけっこ(?)には
    まったく緊迫感がありません

    [今回の内容]
    ■当たり判定
    ■キリンさんとライオンさんの距離
    ■ピタゴラスの定理

    だって、キリンさんとライオンさんがぶつかっても
    何も起こらないもんね...

    そこで、キリンさんとライオンさんが
    「ぶつかったら、何か起こる」ようにしていきたいと思います

    ■当たり判定

    ということで、まずは「ぶつかった」ということを
    検知しないといけないのですが、
    それが世間で言われているところ(?)の「当たり判定」です

    当たり判定にも
    ・点と点がぶつかったとき
    ・点と線がぶつかったとき
    ・線と四角がぶつかったとき
    ・四角と円がぶつかったとき
    などなど
    組み合わせがたくさんありますが、

    ここでは、キリンさんもライオンさんも四角いので、
    四角... は使わずに、
    円と円との当たり判定』を使っていきたいと思います

    でも... 円って難しそうじゃん?

    と思われるかもしれませんが、
    実際は円で考えるのが非常に単純なのです

    ...

    ■キリンさんとライオンさんの距離

    悩む前に、早速はじめましょう
    ここからは、当たり判定を考えるうえでの、数学の話になります

    プログラムは一時出てきませんが、居眠りしないでがんばりましょう

    まず、キリンさんとライオンさんを円で考えます

    どちらも40ピクセルの正方形なので、
    その正方形の中に、半径20ピクセル(直径40ピクセル)の円が
    入っていると考えてください

    atari

    その円同士がぶつかったときに「当たった」と判定します

    では、ぶつかったときの位置関係は?

    それぞれの円の中心との距離を考えるといいですね
    円の半径がどちらも20ピクセルなので、

    中心と中心の距離が、
    ・40ピクセルより遠い ---> ぶつかっていない
    ・40ピクセルぴったり ---> ちょうど当たった
    ・40ピクセルより近い ---> ぶつかっている

    ということになります

    文字ではわかりにくいので、これを図で確認しましょう

    ・ぶつかっていないとき
    当たっていない

    ・ちょうど当たったとき
    ちょうど当たった

    ・ぶつかっているとき
    当たっている

    ということで、ぶつかっているかどうかを調べるために
    中心と中心が40ピクセル離れていることを確認できればよいのです

    はじめに「円と円の当たり判定」といいましたが、
    実際には、円に関する計算はまったく使いません

    簡単でしょ?

    じゃ、距離を求めるんだから、
    キリンさんのX座標とライオンさんのX座標を引き算して...
    お?... Y座標と...

    XとY... ???

    ...

    どうしましょう?

    キリンさんとライオンさんが、いつも真横に並んでいれば、
    それぞれのX座標を引き算して...とすればいいのですが、
    残念ながら、ほとんどの場合は斜めに位置しています

    え〜斜めの距離なんてわかんないよね〜

    ■ピタゴラスの定理

    そこで、いつの日か学校で勉強した
    「三平方の定理」、いわゆる「ピタゴラスの定理」を利用します

    卒業してからいままで使っていなかった皆さんお待たせしました

    「ピタゴラスの定理」を使えば、

    直角三角形の、「横の長さ(底辺)」と「縦の長さ(高さ)」を使って
    「斜めの線(斜辺)」の長さを導き出すことができます

    よかった!

    式は、斜辺の長さ=(ルート)((横の長さ)の二乗+(縦の長さ)の二乗)

    ですが、見にくいので、図で確認してください

    R

    これを、キリンさんとライオンさんで考えると

    横の長さ ---> キリンさんのX座標 ー ライオンさんのX座標
    縦の長さ ---> キリンさんのY座標 ー ライオンさんのY座標

    で求めることができます

    R

    ここで、横と縦の長さがマイナスになることもありますが、
    二乗すれば結局プラスになるので、深く考えなくて問題ありません

    これで、数学的な話は終了になります

    お疲れ様でした

    ...

    ちょっとここで、当たり判定の補足があります

    すこし前に出た、「ちょうど当たったとき」の画像を
    あらためて見ていただきたいのですが、
    ちょうど当たった

    計算は「ちょうど当たったとき」なんですが、
    キリンさんとライオンさんの四角は、しっかり重なっています

    「これ当たってるじゃん!?」

    なのですが、
    これは、四角い画像なのに円の当たり判定を使っているからで、
    のちのち下のような丸い画像に変更していきますので、
    今のところ、大きな気持ちで見逃してくださいませ

    image

    もちろん、四角と四角の当たり判定も調べることは可能です
    でも、ここでは話が長くなるので、割愛させていただきます

    ...

    それでは、いよいよプログラムの方に入っていきましょう!

    というところで、時間もなくなってきましたので、また次回に...








    この記事のトラックバックURL
    トラックバック

    Calendar
    S M T W T F S
    1234567
    891011121314
    15161718192021
    22232425262728
    293031    
    << July 2018 >>
    My Apps
    有料アプリ

    無料アプリ

    Selected entries
    Categories
    AdSense
    Sponsored Links
    Archives
    Recent comment
    Links
    Profile
    Search this site.
    Others
    Mobile
    qrcode
    powered
    無料ブログ作成サービス JUGEM