Creating Chess Board at Runtime using ActionScript

I experienced many time while developing games, some time we may required to create the graphics at runtime. Here I am going to share with you a same kind of Chess Board example, which is created at runtime using ActionScript.

Here you can move black piece on white boxes and white piece on black boxes.

Download Source

Creating Box Class

Create a new Flash file with main.as Document class file.
Now let’s start with creating Box class and name it “box.as”.
[as3]
/*box.as*/
package{
import flash.display.Sprite;
import flash.display.Graphics;
import flash.display.Shape;

// Defining class as dynamic class so it allows to assign/create new properties from other class
public dynamic class box extends Sprite{
protected var boxColor:Number;
protected var boxWidth:Number;
protected var boxHeight:Number;

public function box(_boxColor:uint, _boxWidth:Number, _boxHeight:Number){
super();

boxColor = _boxColor;
boxWidth = _boxWidth;
boxHeight = _boxHeight;

init();
}

protected function init():void{
// creating box
var s:Shape = new Shape();
s.graphics.beginFill(boxColor);
s.graphics.drawRect(0,0,boxWidth,boxHeight);
s.graphics.endFill();
this.addChild(s);
}
}
}
[/as3]

Creating Chess Board

In the main.as first we will define some Variables and Constants types.
[as3]
protected const ROWS:int = 8;
protected const COLS:int = 8;
protected const BOX_WIDTH:int = 40;
protected const BOX_HEIGHT:int = 40;
protected const BOX_COLOR_WHITE:uint = 0xFFFFFF;
protected const BOX_COLOR_BLACK:uint = 0x000000;
protected const SNAP_DISTANCE:int = 15;

protected var boxes_list:Array = new Array(); // for all boxes
protected var boxes_white_list:Array = new Array(); // for white boxes only
protected var boxes_black_list:Array = new Array(); // for black boxes only
[/as3]

Now place all the boxes to stage.
[as3]
protected function placeBoxes():void{
// placing 64 boxes
var b:box;
var yCord:int = 40;
//var remender:int = 0;
var row:int = 1;

for(var i:int=0; iPlacing Pieces

Now here we have to place some pieces to play.
[as3]
protected function placeKings():void{
// placing white king to intial position
king_white = new king_w();
king_white.x = boxes_black_list[30].x;
king_white.y = boxes_black_list[30].y;
king_white.mcColor = ‘white’;
addChild(king_white);

// placing black king to intial position
king_black = new king_b();
king_black.x = boxes_white_list[2].x;
king_black.y = boxes_white_list[2].y;
king_black.mcColor = ‘black’;
addChild(king_black);
}
[/as3]

Making Pieces Interactive

And finally assign interaction to pieces
[as3]
protected function assingInteractivity():void{
king_black.addEventListener(MouseEvent.MOUSE_DOWN, fnStartDrag);
king_black.addEventListener(MouseEvent.MOUSE_UP, fnStopDrag);

king_white.addEventListener(MouseEvent.MOUSE_DOWN, fnStartDrag);
king_white.addEventListener(MouseEvent.MOUSE_UP, fnStopDrag);
}

protected function fnStartDrag(e:MouseEvent):void{
e.currentTarget.lastX = e.currentTarget.x;
e.currentTarget.lastY = e.currentTarget.y;
e.currentTarget.startDrag(false,rect);
e.currentTarget.addEventListener(MouseEvent.MOUSE_OUT, fnStop);
}

protected function fnStopDrag(e:MouseEvent):void{
e.currentTarget.stopDrag();
e.currentTarget.removeEventListener(MouseEvent.MOUSE_OUT, fnStop);
// checking overlaping with boxes

var isSnap:Boolean = false;

for(var i:int=0; i= distance(e.currentTarget,boxes_list[i])){

e.currentTarget.x = boxes_list[i].x;
e.currentTarget.y = boxes_list[i].y;

isSnap = true;

break;
}
}

if(isSnap != true){
e.currentTarget.x = e.currentTarget.lastX;
e.currentTarget.y = e.currentTarget.lastY;
}
}

protected function fnStop(e:MouseEvent):void{
e.currentTarget.stopDrag();
e.currentTarget.removeEventListener(MouseEvent.MOUSE_OUT, fnStop);
e.currentTarget.x = e.currentTarget.lastX;
e.currentTarget.y = e.currentTarget.lastY;
}

protected function distance(mc1:Object,mc2:Object):Number{
var dist = Math.sqrt((mc1.y-mc2.y)*(mc1.y-mc2.y) + (mc1.x-mc2.x)*(mc1.x-mc2.x));
return dist;
}
[/as3]

Complete main.as

[as3]
/*main.as*/
package{
import flash.display.Sprite;
import flash.events.MouseEvent;
import flash.geom.Rectangle;

public class main extends Sprite{
protected const ROWS:int = 8;
protected const COLS:int = 8;
protected const BOX_WIDTH:int = 40;
protected const BOX_HEIGHT:int = 40;
protected const BOX_COLOR_WHITE:uint = 0xFFFFFF;
protected const BOX_COLOR_BLACK:uint = 0x000000;
protected const SNAP_DISTANCE:int = 15;

protected var boxes_list:Array = new Array(); // for all boxes
protected var boxes_white_list:Array = new Array(); // for white boxes only
protected var boxes_black_list:Array = new Array(); // for black boxes only

protected var king_white:king_w;
protected var king_black:king_b;

protected var rect:Rectangle = new Rectangle(115,40,280,280);

// Constructor
public function main():void{
super();
init();
}

protected function init():void{
placeBoxes(); // placing chess boxes
placeKings(); // placing kings to respective positions
assingInteractivity();
}

protected function placeBoxes():void{
// placing 64 boxes
var b:box;
var yCord:int = 40;
//var remender:int = 0;
var row:int = 1;

for(var i:int=0; i= distance(e.currentTarget,boxes_list[i])){

e.currentTarget.x = boxes_list[i].x;
e.currentTarget.y = boxes_list[i].y;

isSnap = true;

break;
}
}

if(isSnap != true){
e.currentTarget.x = e.currentTarget.lastX;
e.currentTarget.y = e.currentTarget.lastY;
}
}

protected function fnStop(e:MouseEvent):void{
e.currentTarget.stopDrag();
e.currentTarget.removeEventListener(MouseEvent.MOUSE_OUT, fnStop);
e.currentTarget.x = e.currentTarget.lastX;
e.currentTarget.y = e.currentTarget.lastY;
}

protected function distance(mc1:Object,mc2:Object):Number{
var dist = Math.sqrt((mc1.y-mc2.y)*(mc1.y-mc2.y) + (mc1.x-mc2.x)*(mc1.x-mc2.x));
return dist;
}
}
}
[/as3]

Creating Chess Board at Runtime using ActionScript

0 replies

Leave a Reply

Want to join the discussion?
Feel free to contribute!

Leave a Reply

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