Categories
Flash

Circuito de carreras en Flash con ActionScript

Out Run

En un proyecto que participé hace poco tuvimos que hacer un circuito de carreras  y aunque parece increíble no encontré algo por ahí que me sirviera de base, así que al final me lo tuve que cocinar.

Dentro de los requisitos técnicos tenía que ser para Flash Player 7, con lo cual no podía utilizar la Clase BitmapData de AS2 y muchísimo menos utilizar AS3, así que la cosa se ponía más chunga, pero bueno, sino donde queda la gracia. 😛

Teníamos en la mente el mítico juego Out Run y queríamos conseguir algo como eso. Aunque durante la investigación vimos las maravillas de AS3 o las posibilidades al utilizar la Clase BitmapData con el motor del modo 7, pero nada, donde manda capitán no manda marinero, así que a buscarse la vida.

El resultado fué el siguiente, bueno, este realmente no es, esta es una versión lite que programé en mis mañanas de tren, jejeje. Mi lado friki me obligó a hacerlo todo con programación, así que el código se puede copiar, pegar y compilar sin problema.

NOTA:

Utilizo la TweenLite así que no funciona tal cual, hace falta tener la librería TweenLite. 😛

CÓDIGO

import gs.TweenLite;

var nColor1:Number = 0xFFFFFF;
var nColor2:Number = 0xCCCCCC;
var nColor3:Number = 0xFF0000;
var nColor4:Number = 0xFFFFFF;

var nColorSky:Number = 0x0066FF;
var nColorGrass:Number = 0x65FF00;

var nWidthSky:Number = Stage.width;
var nHeigthSky:Number = 80;

var nWidthGrass:Number = Stage.width;
var nHeigthGrass:Number = 170;

var nWidthBorderLine:Number = 30;
var nWidthMiddleLine:Number = 8;
var nWidthCenterLine:Number = 140;
var nHeigthLine:Number = 2.5;

var nTotalLines:Number = 68;

var nCounter:Number = 0;
var nFramesToUpdate:Number = 3;

var mcSky:MovieClip;
var mcGrass:MovieClip;
var mcCircuit:MovieClip;

this.create();

function create():Void
{
	Key.addListener(this);

	this.mcSky = this.createEmptyMovieClip("mcSky", 1);
	this.mcGrass = this.createEmptyMovieClip("mcGrass", 2);
	this.mcCircuit = this.createEmptyMovieClip("mcCircuit", 3);

	this.mcSky.beginFill(this.nColorSky, 100);
	this.drawBox(this.mcSky, this.nWidthSky, this.nHeigthSky);
	this.mcSky.endFill();

	this.mcGrass.beginFill(this.nColorGrass, 100);
	this.drawBox(this.mcGrass, this.nWidthGrass, this.nHeigthGrass);
	this.mcGrass.endFill();

	this.mcGrass._y = this.nHeigthSky;
	this.mcCircuit._y = this.nHeigthSky;

	for (var i:Number = 0; i < this.nTotalLines; i++)
	{
		var nType:Number = ((i % 2) == 0) ? 1: 0;
		var mc:MovieClip = this.createLine(nType);
		mc._xscale = 100 + (i * 2);
		mc._x = Math.round((Stage.width - mc._width) / 2)
		mc._y = i * this.nHeigthLine;
		mc.nPosOriX = mc._x;
	}
}

function createLine(_nType:Number):MovieClip
{
	var nDepth:Number = this.mcCircuit.getNextHighestDepth();
	var mcLine:MovieClip = this.mcCircuit.createEmptyMovieClip("mcLine_" + String(nDepth), nDepth);
	var mcLine1:MovieClip = mcLine.createEmptyMovieClip("mcLine1", 1);
	var mcLine2:MovieClip = mcLine.createEmptyMovieClip("mcLine2", 2);

	this.contructLine(mcLine1, _nType);
	this.contructLine(mcLine2, _nType + 1);

	mcLine2._visible = false;

	return mcLine;
}

function contructLine(_mc:MovieClip, _nType:Number):Void
{
	var mcBox1:MovieClip = _mc.createEmptyMovieClip("mcBox1", 1);
	var mcBox2:MovieClip = _mc.createEmptyMovieClip("mcBox2", 2);
	var mcBox3:MovieClip = _mc.createEmptyMovieClip("mcBox3", 3);

	var nColor:Number = (_nType == 1) ? this.nColor1: this.nColor3;

	mcBox1.beginFill(nColor, 100);
	this.drawBox(mcBox1, this.nWidthBorderLine, this.nHeigthLine);
	mcBox1.endFill();

	mcBox2.beginFill(this.nColor2, 100);
	this.drawBox(mcBox2, this.nWidthCenterLine, this.nHeigthLine);
	mcBox2.endFill();

	mcBox3.beginFill(nColor, 100);
	this.drawBox(mcBox3, this.nWidthBorderLine, this.nHeigthLine);
	mcBox3.endFill();

	mcBox2._x = this.nWidthBorderLine;
	mcBox3._x = this.nWidthBorderLine + this.nWidthCenterLine;

	if(_nType == 1)
	{
		var mcBox4:MovieClip = _mc.createEmptyMovieClip("mcBox4", 4);
		mcBox4.beginFill(nColor, 100);
		this.drawBox(mcBox4, this.nWidthMiddleLine, this.nHeigthLine);
		mcBox4.endFill();

		mcBox4._x = (_mc._width - mcBox4._width) / 2;
	}
}

function drawBox(_mc:MovieClip, _nWidth:Number, _nHeigth:Number):Void
{
	_mc.lineTo(_nWidth, 0);
	_mc.lineTo(_nWidth, _nHeigth);
	_mc.lineTo(0, _nHeigth);
	_mc.lineTo(0, 0);
}

function onEnterFrame(_mc:MovieClip):Void
{
	this.nCounter++
	if(this.nCounter % this.nFramesToUpdate == 0)
	{
		for (var i:Number = 0; i < this.nTotalLines; i++)
		{
			var mcLine:MovieClip = this.mcCircuit["mcLine_" + String(i)];
			mcLine.mcLine1._visible = !mcLine.mcLine1._visible;
			mcLine.mcLine2._visible = !mcLine.mcLine2._visible;
		}
	}
}

function moveLeft():Void
{
	var r:Number = 1.5;
	for (var i:Number = 0; i < this.nTotalLines; i++)
	{
		var mc:MovieClip = this.mcCircuit["mcLine_" + String(i)];
		TweenLite.to(mc, 1, { _x:mc.nPosOriX - (this.nTotalLines - i) * r } );
		r -= 0.01;
	}
}

function moveRight():Void
{
	var r:Number = 1.5;
	for (var i:Number = 0; i < this.nTotalLines; i++)
	{
		var mc:MovieClip = this.mcCircuit["mcLine_" + String(i)];
		TweenLite.to(mc, 1, { _x:mc.nPosOriX + (this.nTotalLines - i) * r } );
		r -= 0.01;
	}
}

function returnCenter():Void
{
	for (var i:Number = 0; i < this.nTotalLines; i++)
	{
		var mc:MovieClip = this.mcCircuit["mcLine_" + String(i)];
		TweenLite.to(mc, 1, { _x:mc.nPosOriX } );
	}
}

function onKeyDown():Void
{
	if(Key.isDown(Key.LEFT))
	{
		this.moveLeft();
	}
	else if(Key.isDown(Key.RIGHT))
	{
		this.moveRight();
	}
	else if(Key.isDown(Key.UP))
	{
		this.returnCenter();
	}
}

RESULTADO

Circuito de carreras en Flash con ActionScript

DESCARGAS

Para el que quiera el fla aquí está.

Saludos!!!

Entradas relacionadas:

2 replies on “Circuito de carreras en Flash con ActionScript”

Leave a Reply

Your email address will not be published. Required fields are marked *