First time here? First time here? Newsletter Signup Newsletter
Login | Register | 651326 Members and growing! | Flash Jobs
Search tutorials
Author: Troy Limacher | Website: http://www.geocities.com/helenandtroyuk

PLAN VIEW WALK-AROUND WORLD

The aim

This tutorial will demonstrate one way in which a Flash world can be created where a plan view person 
walks across an unlimited world created by you. Refer to the attached .fla to see the game in action.

The layers

Create 3 layers as shown in the image below, 'Code', 'Main' and 'Block'.

The Code Layer

The Code Layer controls which frame to jump to when you go off the edge of a screen.  By default it jumps
to the previous frame until the player walks off the edge of the screen to the next location.
Add keyframes in the 2nd and 4th frames of the timeline as shown above.
In the 2nd frame add the following script -

if (_root.MoveRight == 1) {
	gotoAndPlay(3);
	_root.MoveRight = 0;
} else if (_root.MoveLeft == 1) {
} else if (_root.MoveUp == 1) {
} else if (_root.MoveDown == 1) {
} else {
	gotoAndPlay(1);
}

In the 4th frame add the following script -

if (_root.MoveRight == 1) {
} else if (_root.MoveLeft == 1) {
	gotoAndPlay(1);
	_root.MoveLeft = 0;
} else if (_root.MoveUp == 1) {
} else if (_root.MoveDown == 1) {
} else {
	gotoAndPlay(3);
}

The Main Layer

Draw a plan view person into this frame and convert into a MovieClip symbol by pressing F8.
Insert the following script into the Actions panel for this MovieClip.

onClipEvent (enterFrame) {
	//Reset movement
	deltax = 0;
	deltay = 0;
	//KEY PRESSES
	if (Key.isDown(Key.LEFT)) {
		//Rotate person left
		_rotation -= 8;
	}
	if (Key.isDown(Key.RIGHT)) {
		//Rotate person right
		_rotation += 8;
	}
	if (Key.isDown(Key.UP)) {
		movePerson();
	}
	if (Key.isDown(Key.DOWN)) {
		reversePerson();
	}
	//MOVE THE PERSON
	function movePerson() {
		if (!_root.Block.hitTest(_x, _y, true)) {
			angle = _rotation;
			angleinradians = angle*Math.PI/180;
			deltax = Math.cos(angleinradians)/2;
			deltay = Math.sin(angleinradians)/2;
			_x += deltax*2;
			_y += deltay*2;
		}
	}
	function reversePerson() {
		if (!_root.Block.hitTest(_x, _y, true)) {
			angle = _rotation;
			angleinradians = angle*Math.PI/180;
			deltax = Math.cos(angleinradians)/2;
			deltay = Math.sin(angleinradians)/2;
			deltax -= deltax*2;
			deltay -= deltay*2;
			_x += deltax*2;
			_y += deltay*2;
		}
	}
	//COLLISION AGAINST WALL
	if (_root.Block.hitTest(_x, _y, true)) {
		_x -= deltax*4;
		_y -= deltay*4;
	}
	//SWITCH SCREEN RIGHT
	if (_x>550) {
		_x = 0;
		_root.MoveRight = 1;
	}
	//SWITCH SCREEN LEFT
	if (_x<0) {
		_x = 550;
		_root.MoveLeft = 1;
	}
	//SWITCH SCREEN UP
	if (_y<0) {
		_y = 400;
		_root.MoveUp = 1;
	}
	//SWITCH SCREEN DOWN
	if (_y>400) {
		_y = 0;
		_root.MoveDown = 1;
	}
}

The Block Layer

This is where the walls and objects making up the world live, but only the ones that the person will bump 
into!  Draw all the walls + objects (idea for walls included below), then covert them to a MovieClip
symbol by pressing F8.  This MovieClip needs to be named 'Block' in the Properties panel.

 FRAMES 1 AND 2 WALL

FRAMES 3 AND 4 WALL

That's it!

That's it for now, for more game ideas visit my website www.geocities.com/helenandtroyuk
    
» Level Intermediate

Added: 2005-07-12
Rating: 8 Votes: 7
(10 being the highest)
» Author
Flash games / website designer & ActionScript writer
» Download
Download the files used in this tutorial.
» Forums
More help? Search our boards for quick answers!

Comments

  • There are no comments yet. Be the first to comment!

  • You must have javascript enabled in order to post comments.

Leave a Comment
  • Your email address will not be published. All fields are required.
Featured Flash FLA
» Author: work2survive
» Title: Girl Walking 1kb
» Description: Walking girl, animation just takes 1kb, using high heels shoes, and fashion model attitude.
Featured Sound Loops
Image for equalize

Audio Player

» Author: BoxCat
» Title: CPU Talk
» Description: From the cyberpunk RPG, "Nameless: the Hackers" Completely Free to use! Keywords: edm hip hop rap electronic mysterious mission hacking chase exciting spy ios ambient chilling love happy sad angry suspense
Latest Font
» Author: Fábio FAFERS
» Description: I created this font for free use. Everyone can apply it in personal or business texts. Its free, but I want to be communicated in case of business use. Donations are accepted to keep the project of free fonts alive! Thank you all
Featured Sound Fx
Image for equalize

Audio Player

» Author: nathan
» Description:

A recorded sound of the Dimensional Fork Gate.