今回の授業は、パワーメーターの作り方でした。
以前のAIのところでは、クリックすると増えたり減ったりするパワーメーターでしたが、今度はタッチしている間増えるタイプです。
タッチしている間と右に長くなっていくメーターがあって、離すとその長さに比例したパワーでだるまが上に上がるという動きです。
今回、息子はパワーメーターという項目ができる前に、角度メーターが付けたいと言ってつくりはじめていたので、次回の発表の為にそれを完成させたいということで、授業のときはそちらをやっていたので、こちらは後から動画で確認しました。(有難いですね〜)
説明はコードの中に書いてみました。(以下青字の部分)
// パワーメーター
var meter = new Sprite(320, 24);
meter.x = 0;
meter.y = 240;
meter.backgroundColor = "blue";
scene.addChild(meter);
// メーターのサイズ
meter.originX = 0; // 拡大縮小の基準を左端にする(しなければ中心が基準)
meter.scaleX = 0; // 最初のサイズ320に対する割合。0.5なら半分の160になる。
ここでは320が初期値なので、power / powerMax(320) に変化させればよい。↓10行後
var powerMax = 320; // パワーの最大値を決めておく
var power = 0; // 初期値は0とする
scene.addEventListener(Event.TOUCH_START, function() { // タッチしたら
meter.scaleX = 0;// タッチすると320*0倍つまり0になる
power = 0;// powerの値は0に戻す
meter.tl.delay(2); // タッチしてから2カウント待つ
meter.tl.then(function(){ // 2カウント数え終わったら
if(power < powerMax){ // パワーの値が320より少ないなら(320より
大きくしない為)
power += 10; // powerを10増やす(タッチしている間)
meter.scaleX = power / powerMax; // メーターの長さ初期値320
に対する割合なので、増えた分 / 320 の長さにすればOK
}
});
meter.tl.loop();// meter.tlの部分をくりかえす(タッチしている間、2カウ
ント毎に+10ずつ増えていくのを繰り返すことになる)
});
scene.addEventListener(Event.TOUCH_END, function() { // タッチ離すと
meter.tl.clear();// 離したところでメーターが止まる
var impulseY = 60 * meter.scaleX;// インパルスの値を設定 powerで書く
と、60*power/320なので、power*0.1875になる
daruma.addImpulse(0, impulseY);// 上で設定した値でだるまを飛ばす
});
講義では、max値を320ではなくて30にして、1ずつ増えていくようにして説明されていました。
そうすると、メーターの30分の1ずつ変化することになります。上の場合は320で10なので、32分の1ずつ変化なのでほぼ同じです。(小さくするほど変化が遅くなる)
あと、気づいたのですが、最後の行の赤字のimpulseYのところは、上に飛ばしたいのだから素直にやればマイナスの数値だと思うのですが(講義でもここはpower *-1.0と説明されていた)ここでは正の数で、これでもできるのですね。地面に下に押し付けて、その反発で上に上がる様子になっているようです。
でもよく考えたらこちらのほうがリアルなのかもしれません。実際にジャンプするときは、地面を下方向に蹴ってその反発で上に上がっているので。ただしこうすると空中でタッチしたときには上には上がらず下にいくので、超魔界村のような二段ジャンプはできません。