Tile-Based Movement

Updated

[size=1]There is still that pesky little bug that occurs when you move towards a tile diagonally, but I’m working on it.[/size]

1.a - 23 lines
Arrow keys to control character around the tile-based world.

var tileSize:Number = 30;
var map:Array = [[1, 1, 1, 1, 1, 1, 1, 1, 1, 1], [1, 0, 0, 0, 0, 0, 0, 0, 0, 1], [1, 0, 0, 0, 0, 0, 0, 1, 0, 1], [1, 0, 1, 0, 0, 0, 0, 1, 0, 1], [1, 0, 1, 1, 1, 1, 0, 0, 0, 1], [1, 0, 0, 0, 0, 1, 0, 0, 0, 1], [1, 0, 0, 0, 0, 0, 0, 1, 0, 1], [1, 0, 1, 0, 0, 0, 0, 1, 0, 1], [1, 0, 0, 0, 0, 0, 0, 0, 0, 1], [1, 1, 1, 1, 1, 1, 1, 1, 1, 1]];
for (y = 0; y < map.length; y++) {
    for (x = 0; x < map.length; x++) {
        var tile:MovieClip = _root.createEmptyMovieClip("tile_"+x+"_"+y,  _root.getNextHighestDepth());
        drawTile(tile, map[y][x]?0:0xF2F2F2);
        applyProps(tile, {_x:x*tileSize, _y:y*tileSize}); } }
var player:MovieClip = _root.createEmptyMovieClip("player_mc", _root.getNextHighestDepth());
    drawTile(player, 0x99FF33);
    applyProps(player, {_x:tileSize, _y:tileSize, xspd:0, yspd: 0});
function onEnterFrame() {
    player.xspd += Key.isDown(Key.RIGHT) ? Math.min(tileSize - Math.abs(player.xspd), 1) : (Key.isDown(Key.LEFT) ? Math.max(Math.abs(player.xspd) - tileSize, -1) : (Math.abs(player.xspd) < 0.1 ? -player.xspd : -0.2 * player.xspd));
    player.yspd += Key.isDown(Key.DOWN) ? Math.min(tileSize - Math.abs(player.yspd), 1) : (Key.isDown(Key.UP) ? Math.max(Math.abs(player.yspd) - tileSize, -1) : (Math.abs(player.yspd) < 0.1 ? -player.yspd : -0.2 * player.yspd));
    var t:Array = [Math.floor(player._x / tileSize), Math.floor((player._x + tileSize - 1) / tileSize), Math.floor(player._y / tileSize), Math.floor((player._y + tileSize - 1) / tileSize)];
    var c:Array = [(map[t[2]][t[0] - 1] == 1 || map[t[3]][t[0] - 1] == 1) == false ? Number.NaN : t[0] * tileSize, (map[t[2]][t[1] + 1] == 1 || map[t[3]][t[1] + 1] == 1) == false ? Number.NaN : t[1] * tileSize, (map[t[2] - 1][t[0]] == 1 || map[t[2] - 1][t[1]] == 1) == false ? Number.NaN : t[2] * tileSize, (map[t[3] + 1][t[0]] == 1 || map[t[3] + 1][t[1]] == 1) == false ? Number.NaN : t[3] * tileSize];
    player.xspd = player._x + player.xspd < c[0] ? c[0] - player._x : (player._x + player.xspd > c[1] ? c[1] - player._x : player.xspd);
    player.yspd = player._y + player.yspd < c[2] ? c[2] - player._y : (player._y + player.yspd > c[3] ? c[3] - player._y : player.yspd);
    player._x += player.xspd;
    player._y += player.yspd; }
function applyProps(targ, vars) {
    for (i in vars) {
        targ* = vars*; } }
function drawTile(tile, color) {
    var funcs:Array = [["lineStyle", [0, 0, 0]], ["beginFill", [color, 100]], ["lineTo", [tileSize, 0]], ["lineTo", [tileSize, tileSize]], ["lineTo", [0, tileSize]], ["lineTo", [0, 0]], ["endFill", []]];
    for (var i=0; i<funcs.length; i++) {
        tile[funcs*[0]].apply(tile, funcs*[1]); } }

1.b - 23 Lines
Left and Right arrow keys to move from side to side. Up to jump.

var tileSize:Number = 30;
var map:Array = [[1, 1, 1, 1, 1, 1, 1, 1, 1, 1], [1, 0, 0, 0, 0, 0, 0, 0, 0, 1], [1, 0, 0, 0, 0, 0, 0, 1, 0, 1], [1, 0, 1, 0, 0, 0, 0, 1, 0, 1], [1, 0, 1, 1, 1, 1, 0, 0, 0, 1], [1, 0, 0, 0, 0, 1, 0, 0, 0, 1], [1, 0, 0, 0, 0, 0, 0, 1, 0, 1], [1, 0, 1, 0, 0, 0, 0, 1, 0, 1], [1, 0, 0, 0, 0, 0, 0, 0, 0, 1], [1, 1, 1, 1, 1, 1, 1, 1, 1, 1]];
for (y = 0; y < map.length; y++) {
	for (x = 0; x < map.length; x++) {
		var tile:MovieClip = _root.createEmptyMovieClip("tile_"+x+"_"+y,  _root.getNextHighestDepth());
		drawTile(tile, map[y][x]?0:0xF2F2F2);
		applyProps(tile, {_x:x*tileSize, _y:y*tileSize}); } }
var player:MovieClip = _root.createEmptyMovieClip("player_mc", _root.getNextHighestDepth());
	drawTile(player, 0x99FF33);
	applyProps(player, {_x:tileSize, _y:tileSize, xspd:0, yspd: 0});
function onEnterFrame() {
	var t:Array = [Math.floor(player._x / tileSize), Math.floor((player._x + tileSize - 1) / tileSize), Math.floor(player._y / tileSize), Math.floor((player._y + tileSize - 1) / tileSize)];
	var c:Array = [(map[t[2]][t[0] - 1] == 1 || map[t[3]][t[0] - 1] == 1) == false ? Number.NaN : t[0] * tileSize, (map[t[2]][t[1] + 1] == 1 || map[t[3]][t[1] + 1] == 1) == false ? Number.NaN : t[1] * tileSize, (map[t[2] - 1][t[0]] == 1 || map[t[2] - 1][t[1]] == 1) == false ? Number.NaN : t[2] * tileSize, (map[t[3] + 1][t[0]] == 1 || map[t[3] + 1][t[1]] == 1) == false ? Number.NaN : t[3] * tileSize];
	player.xspd += Key.isDown(Key.RIGHT) ? Math.min(tileSize - Math.abs(player.xspd), 1) : (Key.isDown(Key.LEFT) ? Math.max(Math.abs(player.xspd) - tileSize, -1) : (Math.abs(player.xspd) < 0.1 ? -player.xspd : -0.2 * player.xspd));
	player.yspd += Key.isDown(Key.UP) && c[3]==player._y && player.yspd == 0? -15 : Math.min(tileSize-player.yspd, 1);
	player.xspd = player._x + player.xspd < c[0] ? c[0] - player._x : (player._x + player.xspd > c[1] ? c[1] - player._x : player.xspd);
	player.yspd = player._y + player.yspd < c[2] ? c[2] - player._y : (player._y + player.yspd > c[3] ? c[3] - player._y : player.yspd);
	player._x += player.xspd;
	player._y += player.yspd; }
function applyProps(targ, vars) {
	for (i in vars) {
		targ* = vars*; } }
function drawTile(tile, color) {
	var funcs:Array = [["lineStyle", [0, 0, 0]], ["beginFill", [color, 100]], ["lineTo", [tileSize, 0]], ["lineTo", [tileSize, tileSize]], ["lineTo", [0, tileSize]], ["lineTo", [0, 0]], ["endFill", []]];
	for (var i=0; i<funcs.length; i++) {
		tile[funcs*[0]].apply(tile, funcs*[1]); } }

See attached SWF files for previews.