A cool animated christmas card design using particle effect.

Few days back when I am watching a video tutorials about the particle systems inside action script 3. this Christmas card design came in my mind. So I thought let's apply the technique and create a cool design. For this design I used illustrator for background and mountain illustration and rest all animated thing are using AS3.
It's cool.

Animated circle using if condition.

The conditional statement allows you to test a condition and execute a block of code if that condition exists, or execute an alternative block of code if the condition does not exist.

In this post, I will show you how to create a moving ball animation (and it should not exit the stage area) using the if condition. This technique you will get useful when you are creating game.

Final Preview:


Create a new Action script 3 document(width-475, height-250) from the flash welcome screen. After creating the new file. Open the action panel from window menu. You can use the shortcut key F9 from your keyboard. In side your action panel copy and paste the following code and test the movie, you will find out some animated circle.

Action script code:

import flash.display.Sprite;

var myArray:Array=[];
var xVel:Number=5;
var yVel:Number=5;
var myBall:Sprite;

for (var i:Number = 0; i < 75; i++) { myBall = new Sprite(); myBall.graphics.beginFill(Math.random() * 0xffffff, 1); myBall.graphics.drawCircle(0, 0, 2 + Math.random() * 20); myBall.graphics.endFill(); myBall.x= 100 + (Math.random()*(stage.stageWidth-200)); myBall.y= 100 + (Math.random()*(stage.stageHeight-200)); addChild(myBall); var ballObj:Object = new Object(); ballObj.ball=myBall; ballObj.xVal=2+Math.random()*8; ballObj.yVal=2+Math.random()*8; myArray.push(ballObj); } this.addEventListener(Event.ENTER_FRAME, onEnter); function onEnter(event:Event):void { for (var i:Number = 0; i < myArray.length; i++) { myArray[i].ball.x+=myArray[i].xVal; myArray[i].ball.y+=myArray[i].yVal; if (myArray[i].ball.x>=stage.stageWidth-myArray[i].ball.width/2||myArray[i].ball.x<0+myArray[i].ball.width/2) { myArray[i].xVal=- myArray[i].xVal; } if (myArray[i].ball.y>=stage.stageHeight-myArray[i].ball.height/2||myArray[i].ball.y<0+myArray[i].ball.height/2) {
myArray[i].yVal=- myArray[i].yVal;
}
}
}

Simple puzzle game using hitTestObject.

Flash is not only for the creating animation. Using flash, developer can create game for any plat form like desktop, mobile, iPhone and even though for android. Creating flash game is not too much hard, if you are having solid knowledge of oops(object oriented programming) concept. Action script 3.0 is purely object oriented and It is very much similar to java script language.

In this post I will show you how to create a simple puzzle game using AS 3.0 inbuilt method call hitTestObject. For this Game I am using the external action script. The Drag game is my document class and the DragDrop class I am using to drag the puzzle piece. I am sharing the source code. Fell free to change your way and have fun.



DragGame class (document class) -

package classes{
import flash.display.Sprite;
import classes.DragDrop;
import TL;
import TM;
import TR;
import BL;
import BM;
import BR;
import endSlide;
import flash.events.MouseEvent;
import flash.text.TextField;
import flash.text.TextFieldAutoSize;
import flash.utils.Timer;
import flash.events.TimerEvent;
import classes.blinkText;
import fl.transitions.Tween;
import fl.transitions.easing.*;

public class DragGame extends Sprite {
private var tl:TL;
private var tm:TM;
private var tr:TR;
private var bl:BL;
private var bm:BM;
private var br:BR;
private var messageSlide:endSlide;
public var slideTween:Tween;

private var totalPieces:Number;
public var currentPieces:Number;

public function DragGame() {
totalPieces = 6;
currentPieces = 0;
createPuzzlePiece();
}

public function createPuzzlePiece():void {
tl = new TL();
addChild(tl);
randomPosition(tl);
tl.targetPiece = tlt_mc;
tl.addEventListener(MouseEvent.MOUSE_UP, checkTarget);

tm = new TM();
addChild(tm);
randomPosition(tm);
tm.targetPiece = tmt_mc;
tm.addEventListener(MouseEvent.MOUSE_UP, checkTarget);

tr = new TR();
addChild(tr);
randomPosition(tr);
tr.targetPiece = trt_mc;
tr.addEventListener(MouseEvent.MOUSE_UP, checkTarget);

bl = new BL();
addChild(bl);
randomPosition(bl);
bl.targetPiece = blt_mc;
bl.addEventListener(MouseEvent.MOUSE_UP, checkTarget);

bm = new BM();
addChild(bm);
randomPosition(bm);
bm.targetPiece = bmt_mc;
bm.addEventListener(MouseEvent.MOUSE_UP, checkTarget);

br = new BR();
addChild(br);
randomPosition(br);
br.targetPiece = brt_mc;
br.addEventListener(MouseEvent.MOUSE_UP, checkTarget);
}
private function checkTarget(event:MouseEvent):void {
if(event.currentTarget.hitTestObject(event.currentTarget.targetPiece)) {
currentPieces++;
event.currentTarget.x = event.currentTarget.targetPiece.x;
event.currentTarget.y = event.currentTarget.targetPiece.y;
event.currentTarget.removeEvent();
if (currentPieces == totalPieces) {
  //trace("you win the game");
messageSlide = new endSlide();
addChild(messageSlide);
//messageSlide.alpha = .75;
slideTween = new Tween(messageSlide,"y",Elastic.easeOut,-300,0,2,true);
}
}
else {
event.currentTarget.x = event.currentTarget.origX;
event.currentTarget.y = event.currentTarget.origY;
}

}
public function randomPosition(puzzlePiece:*):void {
puzzlePiece.x = Math.round(Math.random() * (190 - puzzlePiece.width));
puzzlePiece.y = Math.round(Math.random() * (275 - puzzlePiece.height));
puzzlePiece.origX = puzzlePiece.x;
puzzlePiece.origY = puzzlePiece.y;
}
}

}

DragDrop class -
package classes{
import flash.display.Sprite;
import flash.events.MouseEvent;
import flash.filters.DropShadowFilter;

public class DragDrop extends Sprite {

public var targetPiece:*;
public var origX:Number;
public var origY:Number;

public function DragDrop() {
origX = this.x;
origY = this.y;

this.addEventListener(MouseEvent.MOUSE_DOWN, dragPuzzle);
this.addEventListener(MouseEvent.MOUSE_UP, dropPuzzle);
this.buttonMode = true;

}
public function dragPuzzle(event:MouseEvent):void {
//trace("drag");
this.startDrag();
this.parent.addChild(this);
this.filters = [new DropShadowFilter(10, 45, 0x000000, 1, 5, 5, 1, 1)];
}
public function dropPuzzle(event:MouseEvent):void {
//trace("drop");
this.stopDrag();
this.filters = [];
}
public function removeEvent():void {
this.removeEventListener(MouseEvent.MOUSE_DOWN, dragPuzzle);
this.removeEventListener(MouseEvent.MOUSE_UP, dropPuzzle);
this.buttonMode = false;
}

}

}

Wish you a very happy Diwali.

Diwali is a festival of Lights. On the precious moment of Diwali I wish you Happy Diwali and I pray that you get all your endeavors fulfilled as well as you get lots of gifts and sweets this Diwali.

Animated background for your movie project.

Flash is not only for the web. Using flash you can create application for broadcast and for third screen like mobile, iPhone and android. In this post I will show you some of the animated background which and all I was created during my learning time. For this animation I am not use any action script. Animation is timeline base.
If you want to see the story boarding for the animated back ground, then feel free to click this link. Click here to see the story boarding.
A city side animated scene :

A rainy day evening :

A scene from mountain :

A scene from river side :

A full moon day evening :


Final animation from my you Tube channel:

A simple photo gallery using Array and looping functionality.

Creating a slide-show is best practice for learn Array,
condition and looping structure. If you are familiar with all those
then you can do so many thing, inside action script.

This project is very straight-forward. I am creating a series of thumbnail images for the click event and another series of large image to display to the main content area. Very beginning I am hiding all the large images using a property called visible. And I am storing all the thumb images and the large images instance name inside two array called "imageArray" and "thumbArray". And I am looping inside the array using for loop statement.

This is a very simple example, If you are having little bit of AS 3.0 knowledge.
So, Hope you will get this post helpful. Feel free to copy the code for your experiment and have fun.
Example:


Source sode :

import flash.events.MouseEvent;

var imageArray:Array = [one_mc,two_mc,three_mc,four_mc,five_mc,six_mc,seven_mc];
var thumbArray:Array = [thumbOne_mc, thumbTwo_mc, thumbThree_mc, thumbFour_mc, thumbFive_mc,
thumbSix_mc, thumbSeven_mc];

//This for loop is for the mouse event.
//If you are repeating one type of function again and again, then
//loop structure is the right choice. So, you can easily itirate each of then very easily.

for (var i:Number = 0; i < thumbArray.length; i++) {
thumbArray[i].addEventListener(MouseEvent.ROLL_OVER, onOver);
thumbArray[i].addEventListener(MouseEvent.ROLL_OUT, onOut);
thumbArray[i].addEventListener(MouseEvent.CLICK, onClick);
thumbArray[i].mouseChildren = false;
}

function onOver(evt:MouseEvent):void {
evt.target.gotoAndPlay("rollOver");
evt.target.buttonMode = true;
}

function onOut(evt:MouseEvent):void {
evt.target.gotoAndPlay("rollOut");
}

function onClick(evt:MouseEvent):void {

clearPhotos();

var count:Number = thumbArray.length;
var index:Number;

for (var i:Number = 0; i < count; i++) {
if (evt.target.name == thumbArray[i].name) {
index = i;
}
}
imageArray[index].visible = true;
}

//This function is to clear all photo, when the movie will start.
function clearPhotos():void {
one_mc.visible = false;
two_mc.visible = false;
three_mc.visible = false;
four_mc.visible = false;
five_mc.visible = false;
six_mc.visible = false;
seven_mc.visible = false;
}
clearPhotos();

A real world project using mouse over and mouse out Event inside AS 3.0

Events takes responsibility for to do certain things. There are many Events inside Flash like Mouse Event, keyBoard and so many others. Using different type of Event you can create so many thing. For this post, I am using Mouse Event.
In this post I will show you how to create a simple real world project using Mouse Event. If you are creating any project something like this. Then this blog will help you a lot. To see the live preview click here.

This simple project one I created, when I was a AS 3.0 beginner.I gave all instance's name, in my way. So, see the code, modified your own way and Have fun.
source file for the project