解説Box2dを使ったゲームの授業で発表したものです。豚がトンネルの上から矢を放ちます。今までは、矢の動きは直線的に同じ速度にしか動きませんでしたが、Box2dを使えば、下に重力を加えて、矢はリアルな放物線を描くことができます。先生のサンプルコードの中に、前回説明したパワーメーターがあったのですが、これが出る前に、息子は角度メーターを作りたいと作り始めていたので、そちらを付けることにしました。角度は、クリックしたところの角度を取ることができるので、どちらかと言うとこちらのほうが簡単です。・目標物(だるま)までの距離を長くして、透明の石を動かして画面をスクロールさせて見せる機能をつける・角度メーターをつけてクリックした角度で矢を飛ばす・modeのパラメータをつけて、スクロールしている間は撃てないように制御する・最後だるまが落ちるときに、だるまにスクロールレンジを設定して、落ちるだるまが見えるようにするなどです。画面のスクロール画面より外のドカンに目標物があるので、まず、それを見せます。そのために、透明の箱を作って飛ばしてから戻すという方法でやってみました。(息子のアイデア)透明な箱には、setScrollRangeというプログラムを設定します。これは、設定したパディングを常に保ってくれるというもので、スプライトを移動させても画面から出てしまうことがなく、画面のほうがスクロールしてくれるというものです。これは今井先生がプログラムを作ってくださいました。箱にこれをつけて移動させれば、画面がスクロールするというわけです。箱の色はテスト用にredにしておき、あとで消します。そのままではずっと向こうに移動し続けてしまうので、壁にぶつかって止まるように、壁も配置します。scene.addChild(wall);これで、scroはだるまより向こうに飛んで行って、壁にぶつかって落ちます。スクロールしている間は矢が発射できないように、幕を作って、それをタッチできないようにします。ここではbackiというスプライトを画面一杯に大きさで上にかぶせています。});適度なタイミングで豚の方に戻します。帰ってくるときにだるまにぶつからないように調節します。-2))戻ってから、scroと壁は消します。55);角度メーターをつくる上下に振れるメーターをつくります。これを、90度まで動かしてから、0度まで戻すという動きをloopさせれば、ワイパーのようなメーターができます。yの値が複雑なのは、豚の矢の位置に合わせるために微調整したからです。ここで、あとでrotationと対応させるときに、ExSprite(1、32)とするより、(32、1)としたほうがやりやすかったかもしれません。途中で気づきましたが、90度ずらすだけなのでそのままやってしまいました。sounds2.play();角度メーターと矢の角度を連動させるここが角度メーターの肝ですが、簡単です。bar.rotationというプロパティが、タッチしたときのbarの角度を取ってくれるからです。この2.5・・ってなんでしょう・・自分でやったのに忘れました・・多分、bar.rotationというのは、動いているbarをタッチしたときの角度になるので、0〜90の値そのままでは、addImpulseに入れる値としては大き過ぎるので、それで、一旦100で割って、すると今度は小さくなりすぎるので、調節して2.5倍くらいにすると、矢の飛ぶ距離としてはちょうどよくなったのだと思います。メーターのスプライトは(1、32)なので、垂直に立った状態から倒す方向で動かしています。x方向は、bar.rotationの値に比例させればいいので、その比例定数は的との距離で適当に調整して、2.5/100となりました。逆にy方向は、傾きが大きくなるほど、y方向への力は小さくなるので、(傾きの最大値90度のとき0となる)(90-bar.rotation)に比例させればよく、これも調整して、2.5/90となり、上方向にとばすので-(マイナス)となります。1.2)でいい具合に飛ばすことができました。上で、矢を飛ばす力については決めました。画面上の画像としては、そのままでは矢が真横に出て、真横のまま放物線を描くことになるので不自然です。(Box2dはそこまではやってくれない)そこで矢を出す時の角度もメーターの角度と同じになるようにして、飛ばしたあとも角度に合わせてゆるやかに回転させるようにしました。矢と同時に一旦消したスクロール用の透明の箱を、矢をフォローして一緒に動くようにします。これで、矢が遠くに飛んでも画面がスクロールして見ることができます。});矢が外れたら画面を豚に戻す矢に衝突判定をつけ、地面に落ちたら矢をフォローしていたscroは消して、別のscro2という箱を出し、それを豚のところまで戻すことで画面をスクロールさせます。矢が地面に落ちた時点で箱を出します。219)という条件分岐をつけます。矢がだるまを超えたときは、戻るときに高さが足りなくてだるまや土管にぶつかって戻ってこれなかったので、scro2の高さを高くしました。32;)外れた矢がそのままだと、次に外れた矢がその上に乗ってしまったとき、地面との衝突判定が効かなくなるので、外れた矢は消します。画面をスクロールさせている間に、矢が撃ててしまうと、スクロールがおかしくなってしまうので、その間は撃てないように、modeのパラメーターを使って制御します。だるまについても、地面に落ちたときにゲームクリアにすると、だるまが跳ね返って地面に衝突する度に何度もゲームクリアが発動してしまうので、地面に衝突した最初の一度目だけゲームクリアとなるようにします。*/だるまにスクロールレンジをセットするだるまに矢が当たって、土管から落ちる時(ゲームクリアのとき)、だるまが見えなくなってしまうとつまらないので、だるまにsetScrollRangeをつけます。だるまのy座標を見ると、218.79968127001965なので、(box2dだと重力によって、ほんの少し下がるようです)落ち始めたらセットとなるようにします。だるまが地面に落ちてからもスクロールし続けると、ゲームクリアの文字やお殿様の画像がずれてしまうので、地面に落ちたら外します。角度メーターと矢の飛び方を連動させる調整のところ以外は、アイデアも含めて息子が頑張りました。先生もおっしゃっていたけれど、一人で全部できるものなんてないのだから、(そもそも基のゲームのつくりかただって全部先生から教えてもらったものなのだし)、手伝ってもらったことを負い目に感じる必要はないと思うのですが、息子は手伝ってもらったにしても自分でコードを打ったという実感がないと嫌みたいなので、その辺さりげなく手伝うようにしています。息子も頼ってくれるので、それも嫌でないうちは、協力したいと思います。だいたい以上の流れで作りましたが、一つ機能を増やすと、その影響でそれまでのところに不具合がでて調整するために何かを付け足さないといけない、また一つ増やすとまた調整、この繰り返しです。おそろしく何度もプレイしなければなりません。今までもそうでしたが、今この記事を書いていて、改めてそれを実感しました。ゲーム作りって大変ですね。パズルを解いていくみたいで本当に面白いです。私にとってはゲーム作り自体が、今までで一番面白いパズルゲームです。今回の授業は、パワーメーターの作り方でした。以前のAIのところでは、クリックすると増えたり減ったりするパワーメーターでしたが、今度はタッチしている間増えるタイプです。タッチしている間と右に長くなっていくメーターがあって、離すとその長さに比例したパワーでだるまが上に上がるという動きです。今回、息子はパワーメーターという項目ができる前に、角度メーターが付けたいと言ってつくりはじめていたので、次回の発表の為にそれを完成させたいということで、授業のときはそちらをやっていたので、こちらは後から動画で確認しました。(有難いですね〜)説明はコードの中に書いてみました。最初のサイズ320に対する割合。0.5なら半分の160になる。});講義では、max値を320ではなくて30にして、1ずつ増えていくようにして説明されていました。すると、メーターの30分の1ずつ変化することになります。上の場合は320で10なので、32分の1ずつ変化なのでほぼ同じです。*-1.0と説明されていた)ここでは正の数で、これでもできるのですね。地面に下に押し付けて、その反発で上に上がる様子になっているようです。考えたらこちらのほうがリアルなのかもしれません。実際にジャンプするときは、地面を下方向に蹴ってその反発で上に上がっているので。すると空中でタッチしたときには上には上がらず下にいくので、超魔界村のような二段ジャンプはできません。解説すごろくをつくろうと思って、まずつくったサイコロです。デザインは、娘が厚紙で作ったサイコロをそのまま再現しました。猫がサイコロを転がすのかと思いきや、いっしょにぐるぐる転がっているだけというところがポイントです。苦労したところは、音です。ドラムロールの音を長く鳴らして、振ったところで止めるということをしたかったのですが、どうやってもうまく制御できないので、断念しました。音についてはいろいろ難しいところがあるようです。前回と変えたのは、球を大きくしたので、一度に消えるブロックが増えたところです。負荷が高まりましたが難易度としてはeasyになりました。得点によって球の大きさを変えようとしたのですが、これも場合によってすり抜けてしまうので、やめました。それから、このシリーズ全部に共通していますが、クリアの判定がややこしいことになっています。2000個目のブロックに当たった瞬間にクリアにするようにしたために、「スコアが1999でブロックに当たる」と「当たってスコアが2000になる」の二つの場合をつけなければなりませんでした。衝突のタイミングが判定のタイミングになるからです。スコアラベルのところENTER_FRAMEなので、ここでやればよかったんじゃないかと思うのですが、そのときはENTER_FRAMEの意味がよくわからなかったのかもしれません。この頃、windowsからmacに変えたのですが、windowsで綺麗に字下げをして揃えて書いたつもりなのに、macで開くとぐちゃぐちゃになっていることがよくありました。先生にきいたら教えてくださったのですが、Windowsでは全角と半角が混ざっていても気づかないので、ところどころ全角の半角が混ざっていたために、ずれてしまっていたのでした。それからは、全部半角スペースでやるようにしました。あと、ここにソースコードを貼るときに、改行がどうしてもずれてしまいます。貼った後に修正するのですが、行が多いので面倒です。何かいい方法はないものかといろいろ試していますがまだ見つかりません。前回1200個だったものを、画面の限界まで増やして、2000個にしたので、”極み”です。macでは軽くて問題ありませんでしたが古いWindowsでは怪しい動きになりました。アンビリーバボー!!!!と表示されます。前回、先生のサンプルコードから、配列を使った当たり判定を知ったので、それをつかってブロックくずしのようなものを作ってみました。ブロックは1200個です。通常のブロック崩しのように跳ね返らず、貫通するので、多くしてみました。どれくらい多くできるのかなとやってみたら、Windowsでは重くなってしましました。スコアによってだんだん弾のスピードを上げていこうとしましたが、速くすると、タイミングによってはバーをすりぬけてしまうので、断念しました。動くものどうしの衝突判定は色々難しいようです。想定外です..」と表示されます。子どもとゲームと親もう一つ、男の子だな〜と思った話です。CodeFriendsの授業で、「収穫せよ」というカリキュラムがありました。一通り技術を教えてもらって、みんなで共通のテーマで作るということになりました。セーブ機能を使ってコレクションをするというゲームなので、まず何を集めたいかということで、みんなの意見で候補を挙げていき、その中で希望を一人二つずつ言って一番多かったものにしようということになりました。ところが、「武器」と「切手」が2票ずつの同数になってしまい、この二つで決選投票ということになりました。この時点で私は、ああ武器で決まりだなーと思いました。その日の出席者は5人で、男の子4人に女の子1人だったからです。だいたい、集めたいものが武器というのもなかなかのものです。短剣とかソードとか銃とかハンマーとか、現実に持っている子なんていないはず。みんなゲームをやってきているので、最初は木の棒からはじまって、銅の剣、銀、・・勇者の剣とどんどん武器もいいものになって強くなっていくというRPGの定石を当たり前のように共有しているからこそだと思います。現実生活で、本来の目的のために武器を集めていたら、ちょっと怖い話です。ゲームの世界だから当然許されて、男の子たちはかっこいい武器が大好きです。次に、それぞれ何の武器の絵を描くか、という話になりました。そこで紅一点のKちゃんが描くことにした武器は・・「木の枝」と「爪」でした。かわいらしいのでしょう。(もしここで、すごい武器を選ぶ女の子がいたとしても、私はそれはそれで感心します)武器のコレクションも男の闘争本能をくすぐるものなのでしょう。女の本能と言って思いつくのは母性本能ですが、ただしこれは隠されてもいないし、抑圧されてもいないと思うのです。子供ができると全開と言いますか。そこで、私が母性本能をくすぐるゲームであろう、たまごっちをやった時の話です。最初のたまごっちのブームの時、私はまだ独身で、仕事も忙しくそれどころではなくて、ブームとか品切れとかになって世間ではすごく流行っているんだなと思った程度でした。新しくなったたまごっちをやったのは、2、3年前だったと思います。娘に頼まれてやりました。私がゲームをやるとしたら、たいてい子供達に頼まれることが多いです。たまごっち・・やるからには一生懸命やりました。場面が出てくるたびに、娘にどうしたらいいかを聞きながら、条件をすべて満たすと「たまとも」になれるので、すべてを最高まで満たして「たまとも」にもなりました。始めてから4日目ぐらいだったと思います。「お見合い」があったので、娘の言うとおりに相手を選び・・すると「結婚」ということになりました。無事、結婚となって相手とトランクを手に旅立っていく場面・・そこで自分でも信じられないことが起こりました。あの小さな画面に、生まれてからの今までの出来事が、流れ始めたのです。お嫁に行ってしまう娘の、赤ちゃんのときからの成長の記録・・お金のかかった結婚式で、流されるような映像です。私は、それを見せられて、号泣してしまいました。ゲームのキャラクター相手にです。ゲームのキャラクターと言っても、あらかじめ仕込まれたストーリーです。誰かがプログラムして作ったものです。小さな小さな画面の、そんなものに対して泣いて、自分でもアホじゃないかと思いました。この程度のものに対して、これですから、現実の自分の子供達の結婚のときは一体どうなってしまうのだろうと先が思いやられます。ゲームをやるにしても、本能だけでなく、自分の人生が投影されるのです。独身のときにやっていたとしたら、多分ここまでのことにはならなかったでしょう。たまごっちをとおして、自分の子育てが思い起こされてそれに対して泣けたのです。「歳をとると涙もろくなる」と言いますがそれと同じで、それまでの人生経験が増えるほど、物事に対して感受性が働くのです。経験によって、いろんなことが呼び起こされて、琴線に触れるのでしょう。人間が本来持っているものに加えて、経験から獲得したものを刺激されると弱いです。ともだちコレクションも、そういう場面があるらしいので、私はむしろもうやりたくないと思いました。赤ちゃんをあやす場面は大好きなので、そこの部分だけ、子どもに頼まれるとやっています。まとめていいかわからなくなってきましたが、結論:願望を、ゲームの中でやれるのが面白い。抑圧されていればされているほど。ゲームですべてを満たすことはできない。解説たぬきが障害物を飛び越えながらコインをとっていくというゲームです。最初、背景と一緒にアイテムもスクロールにしてループで動かしたため、一度消えたものは2回目のループのときには消えてしまっていて出てこない(消したものをループさせていた)ということがわからず、苦労しました。先生がサンプルコードをくださったので、それで色々動かしてみて、わかりました。それで、コインが蘇ったので、このような題名になりました。このサンプルコードには、配列を使った複数のアイテムの作り方と、それに対する衝突判定のやり方も書いてあったので、その後色々作るのに非常に参考になりました。}まず、itemsという配列を作っています。Array();そして、forループで10個のitemをつくり、それを配列itemsの中に入れています。items.push(item);これで、itemの一つひとつは、items[i]という名前が振られることになります。}それに当たり判定をつけるには、items[0]からitems[9]までの当たり判定をforループでつければよいということになります。