http://www.51h5.com/game-index-id-604.html_html/css_WEB-ITnose

オンライン プレビュー: http://osgames.duapp.com/apprun.html?appid=osgames1-551421721381542
オンライン編集: http://osgames.duapp.com/gamebuilder.php?appid=osgames1-551421721381542
WeChatスキャン:

実行中のスクリーンショット:

Ring Set は Fire Dance で非常に人気のあるゲームで、FlappyBird の亜種であり、重力感知ゲームです。違いは、衝突判定が FlappyBird の鉄パイプから A ロープに変更されることです。真ん中。

このロープは、UICanvas を使用して GameBuilder に実装されています。UICanvas は、以前のブログ「GameBuilder 開発ゲーム アプリケーション シリーズ: 100 行のコード実装: 白いブロックを踏まないでください」で紹介されました。

ここではロープが描画されているため、剛体間の衝突の検出に Cantk の onBeginContact インターフェースを使用することはできません。代わりに、リング (剛体) の onMoved インターフェースを使用してロープとの衝突を検出します。

ロープの計算

win.onLineMoved = function() {    if(win.gameStarted === 0) {        setTimeout(win.onLineMoved, 20);        return;    }    win.points.shift();    ++win.count;    ++win.score;     if(win.score % 10 === 0)    win.find("score").setText(win.score * 0.1);    var oy = win.points[win.points.length - 1];    if(win.count % 400 === 0) {        win.factor = win.genFactor();        win.count = 0;    }    var y = oy + win.factor;    while(y >= 290 || y <= 110) {        win.factor = win.genFactor();        y = oy + win.factor;        win.count = 0;    }    win.points.push(y);    setTimeout(win.onLineMoved, 20);};

ロープの描画

win.drawCirclePath = function(ctx){    var pa = win.points;    ctx.lineWidth = 20;    ctx.strokeStyle = 'yellow';    ctx.moveTo(0, pa[0]);    for(var i = 1; i < pa.length; i++) {        ctx.lineTo(i, pa[i]);    }    ctx.stroke();};

リングの構成

リングは 2 つの剛体で構成され、そのうちの 1 つは UICanvas (黄色のボディ) の下に集中しています。

衝突検出

リングの onMoved イベント インターフェイスを実装します。

れー