Gamebuilder Jianfengchazhen Game Development Series (AA)

Today launched a game called "AA". In recent iOS just popped a game. Very heart-child, but have a lot of fun. Today, we talk about it Tangide (GameBuilderV2.0) implements it with a control uicanvas.

Online execution: http://www.tangide.com/apprun.html?appid=preview721427350809280
Online editing:

appid=preview721427350809280 ">http://www.tangide.com/gamebuilder.php?

appid=preview721427350809280
On play can scan QR code:

Game:

Game editing Interface:

Can be seen from the game. The game screen is very concise! A simple interface with a black-and-white rotating sphere. The purpose of the game is to be at a glance!

The game takes the form of a rush. The more you get to the back level, the more dizzy you feel. Like bungee jumping! Gameplay is simple. Just a little bit!

The most started level. The ball will be hung on the ball, you just need to put the small ball below with numbers glued to the ball, until the ball stick the game on the victory!

Let's say you're unlucky enough to bump into a sphere next to the ball, then the game is over! With the progression of the level, the original ball will be more and more, you need to stick the ball is more and more, so that the gap between the middle of the smaller. So your chances of hitting another ball are getting higher!

It's best to look at how much you can do with your favorite players.

There are three kinds of balls in the game, the middle ball and the ball. Waiting for the ball.

//转动球//等待球

Two kinds of numbers. The number on the ball indicates the level, and the number of the ball indicates the serial number. The level preset balls have no numbers.

Pellet Launch

The Onpointerdown event for the selected scene here is the launch time, not the onclick. Since the user two times the high-speed click. Will trigger the OnDoubleClick event instead of two onclick.

Sticky inference

After the ball is launched. The waiting ball has a general upward displacement action, when the most waiting ball moves to a distance from the center ball. is able to infer that it has been glued on, at this point, to move it out of the waiting sphere array and add it to the rotation sphere array.

    if0) {        3 * SIDE_BALL_RADIUS;        0;        var ball = curLevel.waitingBalls.shift();        90;        ...        curLevel.balls.push(ball);    }

Collision detection

Method of detecting collisions: calculates whether the inserted ball is the absolute angle of a sphere next to the recent one.

CurLevel.balls.forEach ( function(e, index) {                if(Math. ABS (E.angle-ball.angle) < the* side_ball_radius/(line_len*Math.                    PI) {curlevel.state = game_state_failed;                    Failball = ball; Failball.state =0; Failball.timecount =5; }Else if(Index = = = CurLevel.balls.length-1&& CurLevel.waitingBalls.length = = =0) {curlevel.state = game_state_success; }            }        );

Level design

varLevel = [{"Initnum":4,"Waitnum":8,"Speed": the/ -},    {"Initnum":6,"Waitnum":8,"Speed": the/ -},    {"Initnum":2,"Waitnum": -,"Speed": the/ -},    {"Initnum":0,"Waitnum": -,"Speed": the/ -},    {"Initnum":4,"Waitnum": -,"Speed":420/ -},    {"Initnum":3,"Waitnum": -,"Speed":420/ -},    ...];

Initnum: Number of preset balls
Waitnum: Number of waiting balls
Speed: Rotation rate (angle per 20ms rotation).

Drawing background of the game screen

Choose a background color based on the state of the game

    //draw bg    var color;    switch (curLevel.state) {        case GAME_STATE_RUNNING:            "#EED5B7";            break;        case GAME_STATE_SUCCESS:            "blue";            break;        case GAME_STATE_FAILED:            "red";            break;    }    ctx.fillStyle = color;    ctx.fillRect(canvas.x, canvas.y, canvas.w, canvas.h);

Middle Ball

CTx. Beginpath();CTx. Arc(CENTER. x, CENTER. Y, Center_ball_radius,0, Math. PI*2, true);CTx. Closepath();CTx. FillStyle="BLACK";CTx. Fill();Draw level var txt = (curlevel. level+1) +"";CTx. TextAlign="Center";CTx. Textbaseline="Middle";CTx. Font="Italic 60px Sans-serif";CTx. Strokestyle="#EED5B7";CTx. FillStyle="#EED5B7";CTx. Filltext(TXT, CENTER. x, CENTER. Y); CTx. Stroketext(TXT, CENTER. x, CENTER. Y);

Turn the ball

Draw Side Ball;Curlevel. Balls. ForEach(function (e) {//Draw a line between ball balls CTX. MoveTo(CENTER. x, CENTER. Y);var rad =2* Math. PI* E. Angle/ the;Varx= CENTER. x+ Line_len * Math. Cos(RAD);Vary= CENTER. Y+ Line_len * Math. Sin(RAD);CTx. Strokestyle="BLACK";CTx. LineTo(x,y);CTx. Stroke();var rad = Side_ball_radius;if (typeof E. State!=="undefined") {//If the game fails, change the radius of the failed ball switch (E. State) {case0: Rad =1.5* Side_ball_radius;                         Break;Case1: Rad =0.8* Side_ball_radius;                         Break;Case2: Rad =1.2* Side_ball_radius;                         Break;}} CTX. Beginpath();CTx. Arc(x,yRad0, Math. PI*2, true);CTx. Closepath();CTx. FillStyle="BLACK";CTx. Fill();if (E. Numstr. Length>0) {CTX. TextAlign="Center";CTx. Textbaseline="Middle";CTx. Font="Italic 15px sans-serif";CTx. Strokestyle="#EED5B7";CTx. FillStyle="#EED5B7";CTx. Filltext(E. Numstr,x,y); CTx. Stroketext(E. Numstr,x,y);}        }    );

Waiting for the ball

    //draw Waiting Balls    varx = center.x;vary = center.y + Line_len + curlevel.waitoffset; CurLevel.waitingBalls.forEach ( function(e) {Ctx.moveto (x, y);            Ctx.beginpath (); Ctx.arc (x, Y, Side_ball_radius,0,Math. PI *2,true);            Ctx.closepath (); Ctx.fillstyle ="BLACK";            Ctx.fill (); Ctx.textalign ="Center"; Ctx.textbaseline ="Middle"; Ctx.font ="Italic 15px sans-serif"; Ctx.strokestyle ="#EED5B7"; Ctx.fillstyle ="#EED5B7";              Ctx.filltext (E.numstr, x, y);            Ctx.stroketext (E.numstr, x, y); Y + =3* Side_ball_radius; }    );

The original "AA" level has reached more than 700 off. The playability is still very high. There are many changes to the design of a level, such as:
1, the speed can change quickly
2, can be rotated by a pause
3. Ability to control steering (clockwise/counterclockwise) change
4. Time limit
5, waiting for the ball to have size and scale to add insertion difficulty
Look forward to your ideas.

Note: The game source introduced in this series is open, welcome to visit www.tangide.com Experience game production fun.

Copyright notice: This article blog original articles, blogs, without consent, may not be reproduced.

Gamebuilder Jianfengchazhen Game Development Series (AA)