Flash game making: Playing Bricks

Playing the brick game everyone is familiar with: The player uses a baffle to bounce to the ball, the top arranges some square bricks, the goal of the game is to use the mouse to control the left and right of the baffle so that the ball can be blocked back, to avoid the ball falling to the bottom of the baffle, the ball that blocks back will collide with the brick above The collision of the brick will automatically show that the player each knocked out a piece of brick, will get a certain score.

In this example, the player's life is 5, if the current interface of the brick all finished, then enter the next pass. The game starts to allow the player to choose the game difficulty: the elementary, the intermediate and the advanced, the different difficulty Chinese brick's quantity and the small ball movement speed is different, the player may choose the suitable game difficulty according to own level.

　　Game Production Ideas:

This game mainly involves the following kinds of main control:

1. Drag the mouse: The game needs to use the mouse to drag the stall left and right to block the ball, this function is often used in many games, with the StartDrag function is easy to solve.

2. Ball bounce control: the ball in the game will constantly collide with walls, baffles or brick, so you need to use action to control the bounce of the ball.

3. Brick and small ball collision test: The game needs to detect whether the ball hit the brick, this function can use the HitTest collision test function to detect.

4. Game score and Life value: In the game need to dynamically display the current player's game score and the rest of the player's life value, where the dynamic text box to achieve the display score function.

Through the above analysis, you can probably straighten out the idea of the production of the game, the following we will carry out the specific production of this game.
The production steps of the game:

　　1. Small ball production : This kind of game in the ball is an essential object, so we can draw a small ball, and then fill the appropriate color, but because we need to use action in the back to control the ball, so here we will be made into movie clip, named Ball, As shown in Figure 1:

Figure 1

　　2. Small ball rebound effect production : Because the game in the small ball in several occasions to rebound, so need to make a small ball to rebound effect, here we create a new movie clip, named Ball_jmp, into the editing state of the component, In the original layer layer1 the top of the new layer layer2, we want the effect is the ball from the bottom of the bounce up, so the layer layer1 make small ball shadow from the smaller to large shpae shape change effect, layer layer2 make the ball from the bottom from the motion movement effect, As shown in Figure 2:

Figure 2

　　3. Background change effect: If in the process of the game can continue to change the background of the game, can make the game atmosphere is very tense, play is also very exciting, so make a rapid changes in background color of the MC, a new movie clip, named background, In the first frame, use the rectangle tool to draw a rectangle with a fill color of blue, as shown in Figure 3:

Figure 3

Then insert a keyframe at frame 2nd of the layer layer1, insert a keyframe in frame 8th and change the rectangle fill in 8th Zhen Yingde to light blue, then create a shape-shape over 2nd to 8th frame, and finally extend the timeline to the 10th frame, as shown in Figure 4.

Figure 4

Add as to frame 1th of the layer layer1:
Play = 0;
Stop (); Define variable play, then pause playback

Add as to frame 2nd of the layer layer1:
Play = number (play) +1;
SetProperty ("/ball", _visible, false);
Telltarget ("/")
The value of play is increased by one of the current values, then the ball is not visible, the home scene stops playing

Add as to frame 8th of the layer layer1:
if (number (play) <3) else {
if (number (endgame) = = Number (false)) {
Telltarget ("/")
}
if (number (/:endgame) = = Number (false)) {
SetProperty ("/ball", _visible, True);
}
gotoAndStop (1);
}
According to the variable play and the different values of endgame, jump to different frames, and set the ball to be visible

　　4. The difficulty of the game selection button production: The game can be played before the beginning of the game to choose the difficulty, the game is divided into three kinds of difficulty, respectively, is the primary, intermediate and advanced, the number of different difficulty brick and the speed of small ball movement will be different, the player can choose according to their level of the appropriate game difficulty. Here is an example of one of the buttons, and the other two buttons are similar.

Create a New button buttons component, named Advanced, into the component edit State, the button at the up frame of the input advanced a few words, representing the advanced difficulty, and then insert a key frame over the frame, the first good component ball_jmp dragged to the left of the text, The keyframes are then inserted in down and hit frames, as shown in Figure 5:

Figure 6

The other two buttons were produced in the same way, beginner and intermediate, representing the primary and intermediate levels.

　　5. The production of the file board: next to make another very important role in the game-the file board, the file board in the game by the mouse control, used to block back to the ball, because the game needs to use the action to control the baffle, so the bezel also needs to be made into movie clip. New movie Clip Named paddle, after entering the edit state of the component, draw a rectangle with a fill color of red gradient, as shown in Figure 6, using the Rectangle tool.

Figure 6

　　6. Brick production: The purpose of the game is to use the ball to hit more brick, so brick is essential, in order to make the visual effect of the game more prominent, the game produced a total of four different colors of the brick, yellow, red, blue and green bricks, Here we only explain one of the blue pieces of the production, the other three methods similar to the production.

Create a new movie clip, named Brickblue, to enter the identification state of the component, first draw a rectangle with the rectangle tool to fill the blue gradient, as shown in Figure 7:

Figure 7

Then insert the keyframe at frame 2nd of the layer layer1, change the rectangle's fill color to red, and break the rectangle into different parts to make the brick explode, as shown in Figure 8:

Figure 8

Inserts a keyframe at frame 9th of the layer layer1, dragging several portions of the rectangle into a diffuser, and then reducing each fragment appropriately, and then creating a shape transition animation between frame 2nd through 9th, Figure 9 is the effect of turning on the Onion Peel feature:

Figure 9

To make the explosion more realistic, we're decorating it, creating a new layer layer2, inserting a keyframe into frame 2nd, and then using the Ellipse tool to draw a circle with a red gradient fill, as shown in Figure 10;

Figure 10

Then make a rounded, transparent shape transition between frames 2nd through 10th, as shown in Figure 11:

Figure 11

In this way, the explosion effect of bricks is well reflected.

Finally you need to add some control action, add the following as in frame 1th of layer layer1:
Vis = 1;
Stop ();

In layer Layer1 frame 2nd, add the following as:
Todest =/:d Estroy;

In layer Layer1 frame 10th, add the following as:
Removemovieclip ("/brick" add todest);
Stop ();

So far, all the components that are needed in the game are ready, so let's do the main scene layout.
Second, the layout of the main scene

1. Return to the main scene, rename the original layer layer1 to background, this layer places the background of the game. Use the Rectangle tool to draw a dark blue rectangle with the same size as the stage on the stage as the overall background of the game, and then drag the component background to the right of the stage as the main background of the game, as shown in Figure 12:

Figure 12

2. Create a new layer named bricks, this layer is used to place four colors of bricks, four different colors of bricks from top to bottom to the left of the stage, and to the four colors of the brick set instance name brick, brickred, Brickblue and Brickgreen, As shown in Figure 13:

Figure 13

3. Then create a new two layers, named Ball and paddle respectively, drag the ball and the bezel to the bottom of the main background, and set the instance name to ball and paddle respectively, as shown in Figure 14:

Figure 14

4. Create a new layer named info, use this layer to place the text boxes for points and life values, draw three text boxes with the Text tool, set their properties to dynamic text, and then add descriptive text to the text box, from top to bottom for fractions, life values, and levels, Finally, set the variable name score,balls and level_i to the three text boxes, as shown in Figure 15:

Figure 15

5. Create a new layer named button, this layer to place the game before the difficulty of the selection button, will be made before the three difficulty button to the main background of the middle position, from the bottom of the beginner, intermediate and addvanced respectively.

Add as to the beginner button :
On (release) {
Speed = 8;
balls = 5;
Play ();
}

Add as to the intermediate button :
On (release) {
balls = 4;
Speed = 10;
Play ();
}

Add as to the addvanced button :
On (release) {
Speed = 12;
balls = 3;
Play ();
}

The final main scenario is shown in Figure 16:

Figure 16

6. The final step is to add the game control code to the Home view, create a new layer named action, this layerFrame 1thAdd as:
　　
SetProperty ("/paddle", _visible, True);
SetProperty ("/ball", _visible, True);
Score = 0;
Stop ();
The ball and bezel are initially set to be visible, and the setting is initially divided into 0, then the movie stops at the first frame,//waits for the player to choose the game difficulty.

This layerFrame 2ndAdd as:
StartDrag ("/paddle", false, 240, 420, 560, 420);
To drag a bezel
BALLX = 300;
bally = 400;
Speedx = 8;
Speedy =-8;
Ballwidth = 16;
Paddlewidth = 80;
Brickwidth = 40;
Level_index = 10;
Bricknumber = 0;
Level_i = 1;
Modified = true;
Endgame = false;
border = 250;
Define and initialize a series of variables that will be used in subsequent code
This layerFrame 3rdAdd as:
if (endgame)
Variable endgame identifies whether the game is over, and if the game is over, jump to frame 5th
　　
if (number (Bricknumber) <=0) {
Level_i = level_index-9;
Call (Level_index);
Setting the game level, which is the content in the Level text box, calls the Custom function Level_index.
SetProperty ("/brick", _visible, false);
SetProperty ("/brickblue", _visible, false);
SetProperty ("/brickgreen", _visible, false);
SetProperty ("/brickred", _visible, false);
Set brick in the workspace is not visible
BALLX = 300;
bally = 400;
Speedx = number (speed) +number (xspeed)-5;
Speedy =-speed-xspeed;
}
Set the ball position and movement velocity, BALLX and Bally represent the small ball coordinates, the Speedx and speedy, and the horizontal and vertical movement velocity of the small ball.
BALLX = number (BALLX) +number (Speedx);
bally = Number (Bally) +number (speedy);
Change the ball coordinates according to the moving velocity of the ball
if (number (Bally) <=number (border)) {
b = Int (BALLWIDTH/2);
C1 = Int ((ballx-200)/40);
r1 = Int ((bally-b-40)/20);
C2 = Int ((ballx-b-200)/40);
r2 = Int ((bally-40)/20);
C3 = Int ((ballx-200)/40);
R3 = Int ((number (Bally) +number (b)-40)/20);
C4 = Int ((number (BALLX) +number (b)-200)/40);
R4 = Int ((bally-40)/20);
i = 1;
while (number (i) <=4) {
r = eval ("R" Add i);
c = eval ("c" add i);
IsVisible = GetProperty ("Brick" add r add c,_currentframe);
if (number (IsVisible) = = 1) {
Bricknumber = bricknumber-1;
Score = number (score) +100;
Destroy = R add C;
Telltarget ("Brick" add destroy)
if ((number (i) = = 2) or (number (i) = 4)) {
Speedx =-speedx;
BALLX = number (BALLX) +number (Speedx);
i = 5;
} else {
Speedy =-speedy;
bally = Number (Bally) +number (speedy);
i = 5;
}
}
i = number (i) +1;
}
}
The above sequence of codes is used to judge collisions with small balls and brick, and then brick disappear.

if ((Number (BALLX) >=number (600-BALLWIDTH/2)) or (number (BALLX) <=number (200+number (BALLWIDTH/2))) {
Speedx =-speedx;
BALLX = number (BALLX) +number (Speedx);
Telltarget ("/sound")
}
if (number (Bally) <=number (41+number int (BALLWIDTH/2))) {
Telltarget ("/sound")
Speedy =-speedy;
bally = Number (Bally) +number (speedy);

JudgeBalls and WallsThe collision, and then calculate the bounce direction and speed

Paddlex = GetProperty ("paddle", _x);
if (number (Bally) >404) and (number (BALLX) >number ((paddlex-paddlewidth/2-8))) and (number (BALLX) <number ( Number (number (Paddlex) +number (PADDLEWIDTH/2))) (+8))) {
if (number (BALLX) <number (number (PADDLEX-PADDLEWIDTH/2) +number (int (PADDLEWIDTH/5))) {
Speedx = speedx-6;
else if (number (BALLX) >number (number (Paddlex) +number (PADDLEWIDTH/2)-int (PADDLEWIDTH/5)) {
Speedx = number (Speedx) +6;
else if (number (BALLX) <number (number (PADDLEX-PADDLEWIDTH/2) +number (int (PADDLEWIDTH/3))) {
Speedx = speedx-3;
else if (number (BALLX) >number (number (Paddlex) +number (PADDLEWIDTH/2)-int (PADDLEWIDTH/3)) {
Speedx = number (Speedx) +3;
}
Speedy =-speedy;
bally = Number (Bally) +number (speedy);
Telltarget ("/sound")
}
JudgeBalls and bafflesThe collision, and then calculate the bounce direction and speed

SetProperty ("/ball", _x, BALLX);
SetProperty ("/ball", _y, Bally);
Set the new position of the ball to move the ball
Add as to frame 4th of this layer:
if (number (balls) <1) {
Endgame = true;
gotoAndStop (6);
}
If the life value balls is 0, the game is over
gotoAndPlay ("loopback");
This layerFrame 5thAdd as:
SetProperty ("/paddle", _visible, false);
Set Bezel to Invisible
Telltarget ("Background")

This layerFrame 6thAdd as:
Stopdrag ();
Stop dragging the bezel
c = 0;
R = 0;
C and R are two cyclic variables
while (number (r) <18) {
while (number (c) <10) {
Removemovieclip ("Brick" add r add c);
c = Number (c) +1;
}
R = Number (r) +1;
c = 0;
}
Initialize variables, and perform numerical statistics on the game

This layerFrame 7thAdd as:
Stop ();

This layerFrame 10thAdd as:
xspeed = 0;
border = 240;
Bricknumber = 50;
Level_index = number (Level_index) +1;
Set the level of the game
c = 0;
R = 0;
C and R are two cyclic variables
Count = 1;
index = 0;
while (number (r) <5) {
while (number (c) <number (10-index)) {
　　 Duplicatemovieclip ("/brickred", "brick" add r add C, number (count) +1);
SetProperty ("Brick" add r add C, _x, 220+number (40*c));
SetProperty ("Brick" add r add C, _y, 50+number (20*r));
c = Number (c) +1;
Count = Number (count) +1;
}
Copy Object brickred
R = Number (r) +2;
index = number (index) +2;
c = index;
}
c = 1;
R = 1;
C and R are two cyclic variables
index = 0;
while (number (r) <5) {
while (number (c)
Duplicatemovieclip ("/brickblue", "brick" add r add C, number (count) +1);
SetProperty ("Brick" add r add C, _x, 220+number (40*c));
SetProperty ("Brick" add r add C, _y, 50+number (20*r));
c = Number (c) +1;
Count = Number (count) +1;
}
Copy Object Brickblue
R = Number (r) +2;
index = number (index) +2;
c = Number (index) +1;
}
c = 0;
R = 7;
C and R are two cyclic variables
while (number (r) <9) {
while (number (c) <10) {
Duplicatemovieclip ("/brickgreen", "brick" add r add C, number (count) +1);
Copy Object Brickgreen, copy 16 altogether
SetProperty ("Brick" add r add C, _x, 220+number (40*c));
SetProperty ("Brick" add r add C, _y, 50+number (20*r));
c = Number (c) +1;
Count = Number (count) +1;
}
Set the coordinates of the copied bricks
c = 0;
R = Number (r) +1;
}
SetProperty ("/brick", _visible, false);
This layerFrame 11thAdd as, the following as and frame 10th are similar, but the game is more hierarchical
XSpeed = 1;
border = 150;
Bricknumber = 50;
Level_index = number (Level_index) +1;
c = 0;
R = 0;
C and R are two cyclic variables
Count = 1;
while (number (r) <5) {
while (number (c) <10) {
if ((number (R) <=number (c)) and (number (c) <5)) or ((number (c) >=5) and (number (c) <=number (9-r))) {
Duplicatemovieclip ("/brick", "brick" add r add C, number (count) +1);
} else {
Duplicatemovieclip ("/brickgreen", "brick" add r add C, number (count) +1);
}
SetProperty ("Brick" add r add C, _x, 220+number (40*c));
SetProperty ("Brick" add r add C, _y, 50+number (20*r));
Count = Number (count) +1;
c = Number (c) +1;
}
Copy Object Brick
R = Number (r) +1;
c = 0;
}

This layerFrame 12thAdd as, the following as and frame 11th are similar, but the game is more hierarchical
XSpeed = 2;
border = 330;
Bricknumber = 60;
c = 0;
R = 0;
C and R are two cyclic variables
Count = 1;
while (number (r) <14) {
while (number (c) <10) {
if ((number (r) = = 5) or (number (r) = = 8)) {
Duplicatemovieclip ("/brickred", "brick" add r add C, number (count) +1);
else if ((number (r) = = (Number (r) = 0)) {
Duplicatemovieclip ("/brickblue", "brick" add r add C, number (count) +1);
else if ((number (r) = = 7) or (number (r) = = 6)) {
Duplicatemovieclip ("/brick", "brick" add r add C, number (count) +1);
}
SetProperty ("Brick" add r add C, _x, 220+number (40*c));
SetProperty ("Brick" add r add C, _y, 50+number (20*r));
c = Number (c) +1;
Count = Number (count) +1;
}
R = Number (r) +1;
c = 0;
}
SetProperty ("/brick", _visible, false);

On this layer13 FramesAdd as, the following as and frame 12th are similar, but the game is more hierarchical
XSpeed = 3;
border = 250;
Bricknumber = 72;
c = 0;
R = 0;
C and R are two cyclic variables
Count = 1;
while (number (r) <10) {
while (number (c) <10) {
if (((r) >1) and (number (R) <8) and (number (c) >3) and (number (c) <6)) or ((number (c) >1) and (c) &LT;8) and (number (R) >3) and (number (r) <6)) {
Duplicatemovieclip ("/brickgreen", "brick" add r add C, number (count) +1);
else if (((number (R) = number (5-9) +number (c)) and (number (R) >0) and (number (R) <5) and (number (c) >4) an D (number (c) <9)) or ((number (R) = number (5-C)) and (number (R) () >0) and (number (R) <5) and (number (c) >0) and (Num) ber (c) <5)) or ((number (9-R) = number (5-C)) and (number (R) >4) and (number (R) <9) and (number (c) >0) and ( c) <5)) or ((number (9-R) = number (number (5-9) +number (c)) and (number (R) >4) and (number (R) <9) and (number (c)) &GT;4) and (number (c) <9)) {
Duplicatemovieclip ("/brickred", "brick" add r add C, number (count) +1);
else if ((number (R) >8) or (number (r) = = 0) or (number (c) = 0) or (number (c) = 9)) {
Duplicatemovieclip ("/brickblue", "brick" add r add C, number (count) +1);
}
SetProperty ("Brick" add r add C, _x, 220+number (40*c));
SetProperty ("Brick" add r add C, _y, 50+number (20*r));
c = Number (c) +1;
Count = Number (count) +1;
}
R = Number (r) +1;
c = 0;
}
SetProperty ("/brick", _visible, false);

On this layer14 FramesAdd as, the following as and frame 13th are similar, but the game is more hierarchical
border = 370;
Bricknumber = 116;
c = 0;
R = 0;
C and R are two cyclic variables
Count = 1;
while (number (r) <16) {
while (number (c) <10) {
if ((number (R) >1) and (number (R) <9) and (number (c) = 3)) or ((number (R) >1) and (number (R) <9) and (number (c) = = 6))) {
Duplicatemovieclip ("/brickblue", "brick" add r add C, number (count) +1);
else if ((number (R) >1) and (number (R) <9) and (number (c) = 1)) or ((number (R) >1) and (number (R) <9) and (N Umber (c) = = 8))) {
Duplicatemovieclip ("/brickred", "brick" add r add C, number (count) +1);
else if ((number (R) = 0) and (number (c) >2) and (number (c) <7)) or ((number (R) = 7) and (number (c) >2) and (N Umber (c) <7)) or ((number (R) = 8) and (number (c) >2) and (number (c) <7)) {
Duplicatemovieclip ("/brickblue", "brick" add r add C, number (count) +1);
else if ((number (R) = 1)) {
Duplicatemovieclip ("/brickgreen", "brick" add r add C, number (count) +1);
else if (number (r) >8) {
Duplicatemovieclip ("/brick", "brick" add r add C, number (count) +1);
}
SetProperty ("Brick" add r add C, _x, 220+number (40*c));
SetProperty ("Brick" add r add C, _y, 50+number (20*r));
c = Number (c) +1;
Count = Number (count) +1;
}
R = Number (r) +1;
c = 0;
V
SetProperty ("/brick", _visible, false);

This layerFrame 15thAdd as:
Endgame = true;
Level_index = number (Level_index) +1;

The last timeline is shown in Figure 17:

Figure 17

Finally you will be able to test the game. The difficulty of making this game is medium difficulty, master the production method of this game, you can also try more complex some of the game production.