Consejo rápido: Fácil movimiento de personajes AS3 con KeyObject.as

Spanish (Español) translation by Marilu (you can also view the original English article)

En este tutorial presentaré una clase de Senocular.com que permite el movimiento fácil de los personajes del juego con un código mínimo.

Avance del resultado final

En el SWF verás una nave espacial; usa las teclas de flecha izquierda, derecha, arriba y abajo para moverla.

Paso 1: Explicación de KeyObject.as

Cuando salió ActionScript 3.0 perdimos la funcionalidad del método Key.isDown() de AS2. Senocular ha codificado una pequeña gran clase que nos permitirá emular esta funcionalidad dentro de actionscript 3 y eso es lo que veremos en el tutorial.

Paso 2: Establecer el proyecto

Ve a File (Archivo) > New (Nuevo) y crea un nuevo documento de Actionscript 3.0, con las siguientes propiedades:

Tamaño: 550 * 400
Color de fondo: Blanco
FPS: 24

Guarda este archivo como "KeyObject.fla"

Paso 3: Descargar KeyObject.as

Antes de que podamos codificar nuestra aplicación necesitamos obtener el archivo "KeyObject.as", así que dirígete a Senocular.com. En el menú de Flash, haz clic en Actionscript. Una vez allí, querrás ir a "KeyObject.as" y descargarlo. Llega allí yendo a Actionscript 3.0 > com > senocular > utils.

Puedes hacer clic con el botón derecho del ratón en el enlace de descarga y guardarlo como "KeyObject.as".

Una vez que hayas hecho esto, tienes que quitar com.senocular.utils justo después de la declaración del paquete en el archivo, ya que no estamos usando la ruta de clase com.senocular.

Cambia esto:


package com.senocular.utils {
    import flash.display.Stage;
    import flash.events.KeyboardEvent;
	//Rest of Class

A esto:


package {
    import flash.display.Stage;
    import flash.events.KeyboardEvent;
	//Rest of Class

Paso 4: Importar el gráfico del jugador

En los archivos de descarga hay una imagen de la nave espacial llamada player.png. En Flash, importa esto al escenario, yendo a File (Archivo) > Import (Importar) > Import To Stage (Importar al escenario). Haz clic con el botón derecho del ratón y elige "Convert To Symbol (Convertir a símbolo)", dale el nombre de símbolo "player (jugador)", y asegúrate de que el punto de registro está situado en la parte superior izquierda. Ahora dale el nombre de instancia de "player (jugador)" también.

Paso 5: Establecer la clase principal

Ve a File (Archivo) > New (Nuevo) y elige ActionScript File (Archivo ActionScript).

Guarda esto como Main.as y ponlo como tu Document Class (clase de documento) dentro de "KeyObject.fla".

A continuación añade el siguiente código a "Main.as":


package  {
	import flash.display.Sprite
	import flash.events.Event;
	import KeyObject;
	public class Main extends Sprite{
		private var key:KeyObject;
		
		public function Main() {
			addEventListener(Event.ADDED_TO_STAGE,setupKeyObject);
		}
		
		function setupKeyObject(e:Event){
			key = new KeyObject(stage);
            stage.addEventListener(Event.ENTER_FRAME,movePlayer);
		}
		
		function movePlayer(e:Event){
			if(key.isDown(key.LEFT)){
			   player.x -= 5;
			   }
			if(key.isDown(key.RIGHT)){
			   player.x +=5;
			   }
			if(key.isDown(key.DOWN)){
			   player.y +=5;
			   }
			if(key.isDown(key.UP)){
			   player.y -=5;
			   }
			   
			if(player.y<0){
				player.y =0;
			}
			if(player .y > (stage.stageHeight - player.height)){
				player.y = stage.stageHeight - player.height;
			}
			if(player.x<0){
				player.x = 0;
			}
			if(player.x > (stage.stageWidth - player.width)){
				player.x = stage.stageWidth - player.width;
			}
		}
	}
	
}

Aquí preparamos nuestro paquete e importamos las clases que usaremos. A continuación configuramos la variable key como tipo KeyObject, y dentro de nuestro constructor Main añadimos un ADDED_TO_STAGE Event Listener. Se llama así cuando la película está completamente cargada y el escenario está listo.

Dentro de la función setupKeyObject, establecemos que la variable key sea una nueva instancia de la clase KeyObject y añadimos un Event Listener (Escuchador de Eventos) ENTER_FRAME al escenario.

Dentro de la función movePlayer comprobamos qué tecla se está pulsando con key.isDown() y movemos nuestro jugador en consecuencia.

Finalmente, comprobamos si el objeto se ha movido fuera de los límites del escenario, y si lo ha hecho lo volvemos a poner justo dentro del escenario.

Conclusión

¡Usar la clase KeyObject de Senocular hace que sea muy sencillo mover a los personajes del juego! Espero que este tutorial te haya ayudado; gracias por leerlo.

1
2	package {
3	import flash.display.Sprite
4	import flash.events.Event;
5	import KeyObject;
6	public class Main extends Sprite{
7	private var key:KeyObject;
8
9	public function Main() {
10	addEventListener(Event.ADDED_TO_STAGE,setupKeyObject);
11	}
12
13	function setupKeyObject(e:Event){
14	key = new KeyObject(stage);
15	stage.addEventListener(Event.ENTER_FRAME,movePlayer);
16	}
17
18	function movePlayer(e:Event){
19	if(key.isDown(key.LEFT)){
20	player.x -= 5;
21	}
22	if(key.isDown(key.RIGHT)){
23	player.x +=5;
24	}
25	if(key.isDown(key.DOWN)){
26	player.y +=5;
27	}
28	if(key.isDown(key.UP)){
29	player.y -=5;
30	}
31
32	if(player.y<0){
33	player.y =0;
34	}
35	if(player .y > (stage.stageHeight - player.height)){
36	player.y = stage.stageHeight - player.height;
37	}
38	if(player.x<0){
39	player.x = 0;
40	}
41	if(player.x > (stage.stageWidth - player.width)){
42	player.x = stage.stageWidth - player.width;
43	}
44	}
45	}
46
47	}