Adding sprite from inside an external class onto stage and animating it using arrow key movement.
Submitted by litwol on Mon, 01/18/2010 - 03:41
Flash demo is at the bottom of the post, scroll there!
Initially i had difficulty attaching a sprite created inside a class onto the stage. I haven't found documentation yet that explains the right way of doing it but i did stumble onto my own solution. I will not know whether this is the right way of doing it until i find some documentation that explains it. If some one has a tip please leave a comment.
I instantiated my class from the main FLA using the following code passing 'this' into the construct. "This" represents /stage/ in this file :
import foo;
var d = new foo(this);
stage.addEventListener(KeyboardEvent.KEY_DOWN, d.myKeyDown);
stage.addEventListener(KeyboardEvent.KEY_UP, d.myKeyUp);
and here's the class itself ( for explanation on what it does read the end of the post ):
package {
import flash.ui.Keyboard;
import flash.events.KeyboardEvent;
import flash.display.Sprite;
public class foo extends Sprite {
public var keys:Array = new Array();
var sprite:Sprite = new Sprite();
public function foo(stage):void {
createAttachSprite(stage);
keys[Keyboard.LEFT] = false;
keys[Keyboard.RIGHT] = false;
keys[Keyboard.DOWN] = false;
keys[Keyboard.UP] = false;
}
private function createAttachSprite(stage) {
sprite.graphics.beginFill(0x41C5D2, 1);
sprite.graphics.drawRect(0, 0, 50, 50);
sprite.graphics.endFill();
stage.addChild(sprite);
}
public function myKeyDown(event:KeyboardEvent):void {
keys[event.keyCode] = true;
processmove(event);
}
public function myKeyUp(event:KeyboardEvent):void {
keys[event.keyCode] = false;
processmove(event);
}
public function processmove(event:KeyboardEvent) {
if ( keys[Keyboard.LEFT] == true) {
sprite.x -= 5;
}
if ( keys[Keyboard.UP] == true ) {
sprite.y -= 5;
}
if ( keys[Keyboard.RIGHT] == true ) {
sprite.x += 5;
}
if ( keys[Keyboard.DOWN] == true ) {
sprite.y +=5;
}
}
}
}
In this example i was practicing simple arrow key controls. This code creates a simple 50x50 pixel sprite and attaches keyup and keydown event listeners to stage. when pressing the arrow keys i increment or decrement accordingly the x and y coordinate values of the sprite forcing it to move about the stage. The most interesting part is how i perform the movement. if you see my previous demo you will notice that you cannot perform object movement using 2 keys at the same time. pressing up + left will not move the object left while rotating it forward. Possibly the issue with dual key presses is because i registered single key event listeners and there was no "key press state" available that could tell you that 2 keys were pressed at the time, it could however tell you if one key was pressed or released. in the above example i added a simple registry that tracks all keys that were clicked and released, performing movement of the sprite on each key press. So in the above example if i press up and left the sprite will move diagonally as we would expect because as you see in processmove() it processes movement according to registry check for each of the arrow keys.
p.s. Don't mind the choice in naming convention. this is merely a sunday night practice demo which is likely not to make it into the final game design/implementation (movement handling is too choppy for my liking and i will likely revise it time based in later demos).
Tags:
3 reponses to "Adding sprite from inside an external class onto stage and animating it using arrow key movement."
1. Yes. RECAPTCHA was failing
Yes. RECAPTCHA was failing for a while before i noticed. It is unfortunate i didnt have feature monitoring enabled. Things work back as they should now.
2. I attempted to create a
I attempted to create a comment earlier, however it hasn??™t shown up. Could there be something wrong with your spam filter? =-=
3. Time based movement processing
This example helps solve the issue where above example is dependent on how fast your key press repeat rate is as configured in your keyboard settings.
The following example performs time based movement. Key presses are now only important to register that they were clicked, they do not perform actual movement.
package {
import flash.ui.Keyboard;
import flash.events.KeyboardEvent;
import flash.display.Sprite;
import flash.utils.*;
public class foo extends Sprite {
public var keys:Array = new Array();
var sprite:Sprite = new Sprite();
public function foo(stage):void {
createAttachSprite(stage);
keys[Keyboard.LEFT] = false;
keys[Keyboard.RIGHT] = false;
keys[Keyboard.DOWN] = false;
keys[Keyboard.UP] = false;
}
private function createAttachSprite(stage) {
sprite.graphics.beginFill(0x41C5D2, 1);
sprite.graphics.drawRect(0, 0, 50, 50);
sprite.graphics.endFill();
stage.addChild(sprite);
runmove();
}
public function myKeyDown(event:KeyboardEvent):void {
keys[event.keyCode] = true;
}
public function myKeyUp(event:KeyboardEvent):void {
keys[event.keyCode] = false;
}
public function runmove() {
setInterval(processmove, 50);
}
public function processmove() {
trace(keys);
if ( keys[Keyboard.LEFT]) {
sprite.x -= 5;
}
if ( keys[Keyboard.UP]) {
sprite.y -= 5;
}
if ( keys[Keyboard.RIGHT]) {
sprite.x += 5;
}
if ( keys[Keyboard.DOWN]) {
sprite.y +=5;
}
}
}
}
Post new comment