Advanced: Make a wonderful maze game with flash

Senior

　　Web Teaching Network: in the previous tutorial we explained the use of Flash to make a game of some methods, such as collision detection, in this tutorial we use the knowledge of previous learning to create a good maze game! The tutorial is mainly flash using material and shading to create a real ball animation of the continuation of the use of creating a good ball rolling animation maze game.

Before you learn this tutorial, please review the use of material and masking to create a real ball animation Tutorial. For the background used in the tutorial, see: use Photoshop action to create exquisite cosmic sky effects

There is no new knowledge in this tutorial, which is to use a stage (map), and then there is a small flash game implemented by a moving ball. at the end of the article provide all demo source file downloads

A total of two maze animation effects were produced.

　　One, the background does not move the maze game

After you have prepared a background, enter the following code directly.

Level = new Array ();
_root.attachmovie ("Starz", "Starz", 1);
_root.createemptymovieclip ("Bricks", 2);
Level[0] = new Array (1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0);
LEVEL[1] = new Array (0, 0, 0, 0, 0, 0, 0, 0, 1, 1, 1, 1);
LEVEL[2] = new Array (1, 1, 1, 0, 1, 1, 1, 0, 0, 0, 0, 1);
LEVEL[3] = new Array (1, 0, 1, 1, 1, 0, 1, 1, 1, 1, 1, 1);
LEVEL[4] = new Array (1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0);
LEVEL[5] = new Array (1, 0, 1, 1, 1, 1, 1, 1, 0, 1, 1, 1);
LEVEL[6] = new Array (1, 0, 1, 0, 0, 0, 0, 1, 0, 1, 0, 1);
LEVEL[7] = new Array (1, 0, 1, 1, 0, 0, 0, 1, 0, 1, 0, 1);
LEVEL[8] = new Array (1, 0, 0, 1, 0, 1, 1, 1, 0, 1, 0, 1);
LEVEL[9] = new Array (1, 1, 0, 1, 0, 1, 0, 0, 0, 1, 0, 1);
LEVEL[10] = new Array (0, 1, 1, 1, 0, 1, 1, 1, 1, 1, 0, 1);
For (y=0 y<=10; y++) {
for (x=0 x<=11; x + +) {
if (level[y][x] = = 1) {
Place_brick = Bricks.attachmovie ("Brick", "Brick_" +bricks.getnexthighestdepth (), bricks.getnexthighestdepth (), {_x: X*40+30, _y:y*40+30});
}
}
}
_root.attachmovie ("Ball", "Ball", _root.getnexthighestdepth (), {_x:30, _y:30});
Ball.texture.setMask (ball.ball_itself);
Power = 0.4;
yspeed = 0;
xspeed = 0;
friction = 0.99;
Ball.onenterframe = function () {
if (Key.isdown (Key.left)) {
XSpeed-= power;
}
if (Key.isdown (key.right)) {
XSpeed + = power;
}
if (Key.isdown (key.up)) {
Yspeed-= power;
}
if (Key.isdown (Key.down)) {
Yspeed + = power;
}
XSpeed *= Friction;
Yspeed *= Friction;
This._y + = Yspeed;
This._x + = XSpeed;
This.texture._y + = Yspeed;
This.texture._x + = XSpeed;
if (this.texture._x>53) {
This.texture._x-= 63;
}
if (this.texture._x<-53) {
This.texture._x + 63;
}
if (this.texture._y>53) {
This.texture._y-= 63;
}
if (this.texture._y<-53) {
This.texture._y + 63;
}
brick_x = Math.floor ((this._x-10)/40);
Brick_y = Math.floor ((this._y-10)/40);
if (level[brick_y][brick_x]!=1) {
this._x = 30;
this._y = 30;
xspeed = 0;
yspeed = 0;
}
};

Demo effect (the specific code will not be explained, if you want to further in-depth can see the source file ):

　　Second, the background also moves the maze game

One more background-moving maze effect animation.

Level = new Array ();
_root.attachmovie ("Starz", "Starz", 1, {_x:-20, _y:-20});
_root.createemptymovieclip ("Bricks", 2);
Level[0] = new Array (1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0);
LEVEL[1] = new Array (0, 0, 0, 0, 0, 0, 0, 0, 1, 1, 1, 1);
LEVEL[2] = new Array (1, 1, 1, 0, 1, 1, 1, 0, 0, 0, 0, 1);
LEVEL[3] = new Array (1, 0, 1, 1, 1, 0, 1, 1, 1, 1, 1, 1);
LEVEL[4] = new Array (1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0);
LEVEL[5] = new Array (1, 0, 1, 1, 1, 1, 1, 1, 0, 1, 1, 1);
LEVEL[6] = new Array (1, 0, 1, 0, 0, 0, 0, 1, 0, 1, 0, 1);
LEVEL[7] = new Array (1, 0, 1, 1, 0, 0, 0, 1, 0, 1, 0, 1);
LEVEL[8] = new Array (1, 0, 0, 1, 0, 1, 1, 1, 0, 1, 0, 1);
LEVEL[9] = new Array (1, 1, 0, 1, 0, 1, 0, 0, 0, 1, 0, 1);
LEVEL[10] = new Array (0, 1, 1, 1, 0, 1, 1, 1, 1, 1, 0, 1);
For (y=0 y<=10; y++) {
for (x=0 x<=11; x + +) {
if (level[y][x] = = 1) {
Place_brick = Bricks.attachmovie ("Brick", "Brick_" +bricks.getnexthighestdepth (), bricks.getnexthighestdepth (), {_x: X*80, _y:y*80});
}
}
}
_root.attachmovie ("Ball", "Ball", _root.getnexthighestdepth (), {_x:240, _y:220});
bricks._x = 240;
bricks._y = 220;
Ball.texture.setMask (ball.ball_itself);
Power = 0.4;
yspeed = 0;
xspeed = 0;
friction = 0.99;
Ball.onenterframe = function () {
if (Key.isdown (Key.left)) {
XSpeed-= power;
}
if (Key.isdown (key.right)) {
XSpeed + = power;
}
if (Key.isdown (key.up)) {
Yspeed-= power;
}
if (Key.isdown (Key.down)) {
Yspeed + = power;
}
XSpeed *= Friction;
Yspeed *= Friction;
Bricks._y-= Yspeed;
Bricks._x-= xspeed;
starz._x = -20+ ((bricks._x-240)/10);
Starz._y = -20+ ((bricks._y-220)/10);
This.texture._y + = Yspeed;
This.texture._x + = XSpeed;
if (this.texture._x>53) {
This.texture._x-= 63;
}
if (this.texture._x<-53) {
This.texture._x + 63;
}
if (this.texture._y>53) {
This.texture._y-= 63;
}
if (this.texture._y<-53) {
This.texture._y + 63;
}
brick_x = Math.floor ((bricks._x-200)/80) *-1;
Brick_y = Math.floor ((bricks._y-180)/80) *-1;
if (level[brick_y][brick_x]!= 1) {
bricks._x = 240;
bricks._y = 220;
starz._x =-20;
starz._y =-20;
xspeed = 0;
yspeed = 0;
}
};

Demo effect (the specific code will not be explained, if you want to further in-depth can see the source file ):

Click here to download the source file (The source file for both demos, total 1.09M)