"Finally a blog post after 4 months!!! seriously guys been busy.."

First you have to grab the google analtics API for flash, called GA for Flash. You can download it here. And by the way its Actionscript 3.

GA for flash helps to track visitor movement of your website. (you don't even have to use SWF Address)

1. After downloading the GA for Flash, unzip the file. In the "lib" folder copy "analytics_flash.swc" file.

2. Now you have to paste this file into the Adobe components folder, you can find it.. {drive}\Program Files\Adobe\Adobe Flash CS3\en\Configuration\Components



3. Open a New Flash File (Actionscript 3).. Do not open flash file before pasting the swc file.

4. Press Ctrl+F7 to open components panel. Under Standard Components you can find Analytics component.

5. Drag and Drop the component into the library panel.

Now we have to do little bit of Actionscript.


import com.google.analytics.AnalyticsTracker;
import com.google.analytics.GATracker;


We have to import the GA class files into our flash.


var tracker:AnalyticsTracker = new GATracker( this, "UA-796209-3", "AS3", false );


Setting up the google analtyics tracker. The GATracker class consist of four parameters:
1. Reference the current display object. (in this example its 'this')
2. The web property ID: You google analytics Urchin ID, you can find it in the dashboard and the google analytics code.
3. Tracking mode: Valid parameters are Bridge or AS3.
4. Debug mode: Keep it false for production and true for trouble shooting.

Finally,

tracker.trackPageview("/page1");

Above code is all that needed to track the page. Copy paste this code everywhere you want to track your visitors. "/page1" is the virtual name given to track the page. You can change it to any name you want.

I have just made a simple example, a site with four links. Grab the source file below.

Example:


Download Source Files

Labels: ActionScript 3, Flash, Google Analytics

Labels: Blog, christmas

Shared Objects are used to store information on the user machine. For example, you can store your website template settings. The data will be stored till the user clears his/her temporary memory of the machine.

In this example let us store a string in the user machine and we will retrieve it using shared objects.

In the below example after saving a data, refresh the page and click on retrieve button to get the saved data.

Demo:



Download Source Files

Concept:

1. Declaring Shared Object,

var myso:SharedObject;


2. Creating shared object on the client local machine..

myso = SharedObject.getLocal("myApp");

"myApp" is like unique ID, it has to be different for each flash applications you develope. We will access the values using this ID.

3. Storing data to shared object..

myso.data.val = "Data to be Stored";


"val" is the variable name.

4. Delete Shared Object..

delete myso.data.val;


5. Closing shared object..

myso.close();

After the Shared Object has been used, its wise to close it.

- End of Tutorial

Labels: ActionScript 3, Flash

Output:


Download Source Files

We are not going to use startDrag() and stopDrag() functions.
First thing you have to do is download the Tweener Class. Place the Tweener class in your global class folder or in the root folder of your .fla file.

Click here to download the Tweener Class (AS3)

Step 1: Create a new Flash File (Actionscript 3.0)

Step 2: Create a movieclip,set the registration point to center. We are going to add the drag and drop functionality to this MovieClip. Give drag_mc as the instance name to the movieclip.

Step 3: Create another movieclip, which will be the target movieclip. Give the instance name as target_mc

Step 4: Now open the Actionscript panel (press F9), copy and paste the below code..


import caurina.transitions.*;

var cirX:Number = 60;
var cirY:Number = 60;

drag_mc.addEventListener(MouseEvent.MOUSE_DOWN,
beginDrag);

function beginDrag(e:MouseEvent):void {

stage.addEventListener(MouseEvent.MOUSE_MOVE,moveMC);
stage.addEventListener(MouseEvent.MOUSE_UP,endDrag);
}


function endDrag(e:MouseEvent):void {
stage.removeEventListener(MouseEvent.MOUSE_MOVE,moveMC);
drag_mc.stopDrag();
if (drag_mc.hitTestObject(target_mc)) {
Tweener.addTween(drag_mc,{x:340,
y:145,
time:1,
transition:"easeIn"});

} else {
Tweener.addTween(drag_mc,{x:60,
y:60,
time:1,
transition:"easeIn"});
}
stage.removeEventListener(MouseEvent.MOUSE_UP,endDrag);
}

function moveMC(e:MouseEvent):void {

Tweener.addTween(drag_mc,{x:mouseX,y:mouseY,time:0.5,transition:"easIn"});
e.updateAfterEvent();
}



Step 5: Hit Ctrl+Enter to test the movie.

Code Explanation:


import caurina.transitions.*;


As I told before, we importing the Tweener Class. This class is used to make the transition smoother and its easy to implement. Make sure the caurina folder is placed on the same path of the .fla file or in your global class folder.


var cirX:Number = 60;
var cirY:Number = 60;


Here we are initializing the initial position of our movieclip.


drag_mc.addEventListener(MouseEvent.MOUSE_DOWN,
beginDrag);


We add Event Listener to the drag_mc. When the mouse is pressed downed on the drag_mc movieclip beginDrag function is called.



function beginDrag(e:MouseEvent):void {

stage.addEventListener(MouseEvent.MOUSE_MOVE,moveMC);
stage.addEventListener(MouseEvent.MOUSE_UP,endDrag);
}


In beginDrag function we add Event Listeners to the stage. Since AS3 does not support releaseOutside function. On mouse move function moveMC is called and on mouse up endDrag function is called.


function moveMC(e:MouseEvent):void {

Tweener.addTween(drag_mc,{x:mouseX,y:mouseY,time:0.5,transition:"easIn"});
e.updateAfterEvent();
}

Here we are calling the addTween function which is available in the Tweener Class.
It takes two arguments first one is the movieclip instance name and tweening properties. Then we are calling updateAfterEvent to refresh the mouse movement.



function endDrag(e:MouseEvent):void {
stage.removeEventListener(MouseEvent.MOUSE_MOVE,moveMC);

if (drag_mc.hitTestObject(target_mc)) {
Tweener.addTween(drag_mc,{x:340,
y:145,
time:1,
transition:"easeIn"});

} else {
Tweener.addTween(drag_mc,{x:60,
y:60,
time:1,
transition:"easeIn"});
}
stage.removeEventListener(MouseEvent.MOUSE_UP,endDrag);
}

We are removing the Event Listener for moveMC function. Its a good practice to remove Event Listeners when they are not needed. Otherwise it will result in memory problems. We are checking whether the drag_mc has hit traget_mc, if its true we call the addTween function to place drag_mc in the coordinate of traget_mc. If its false then we call addTween function place the drag_mc to its initial position.
Finally we remove the event listener for endDrag.

- End of Tutorial

Labels: ActionScript 3, Flash

Output:



Download Source Files

Step 1: Open a new flash document and select Flash File(ActionScript 3.0)

Step 2: Select the Oval tool (o) from tools panel.

Step 3: Draw a circle in the center of the stage.

Step 4: Convert the circle to a movieclip.

Step 5: Give myBT as instance name to the circle.

Step 6: Now, Create Motion Tween animation of circle growing. (upto frame 30)

Step 7: Insert a new layer, and name it as actions. Here we will write our
actionscript 3 code.

Step 8: on the first frame copy & paste this code:


stop();
var rewind:Boolean = false;
myBT.addEventListener(MouseEvent.ROLL_OVER,growUP);
myBT.addEventListener(MouseEvent.ROLL_OUT,growDown);
myBT.addEventListener(MouseEvent.CLICK,gotoSite);

myBT.buttonMode = true;
myBT.useHandCursor = true;

function growUP(e:MouseEvent):void{
play();
rewind = false;
}

function growDown(e:MouseEvent):void{
rewind = true;
}
function gotoSite(e:MouseEvent):void{
navigateToURL(new URLRequest("http://www.getw3help.com","_blank"));
}

this.addEventListener(Event.ENTER_FRAME,revFrame);
function revFrame(e:Event):void{
if(rewind == true){
prevFrame();
}
}


Step 9: On the last frame create a blank keyframe and give stop(); command to it.

Step 10: Ctrl + Enter to test the flash movie.


Code Explanation:


var rewind:Boolean = false;


A variable used to store the rollover condition of the button. If the button is rolled over it will be assigned as true and if the button is rolled out, rewind will be false. If the button is rolled over it will be assigned as false and if the button is rolled out, rewind will be true.



myBT.addEventListener(MouseEvent.ROLL_OVER,growUP);
myBT.addEventListener(MouseEvent.ROLL_OUT,growDown);
myBT.addEventListener(MouseEvent.CLICK,gotoSite);


Adding event listeners to the button. On rollover state we call growUP function. On rolled out state we call growDown function. When the button is click we call gotoSite function.


myBT.buttonMode = true;
myBT.useHandCursor = true;


Since we are using a movieclip, to get the hand cursor on the button we have to enable the buttonMode and useHandCursor.


function growUP(e:MouseEvent):void{
play();
rewind = false;
}


This function is called when the movieclip is rolled over, this function calls the play(); and lets the flash movie to play.


function growDown(e:MouseEvent):void{
rewind = true;
}


When the movieclip is rolled out, we assign rewind as false.


function gotoSite(e:MouseEvent):void{
trace("hello");
navigateToURL(new URLRequest("http://www.getw3help.com"));
}

This function is called when the movieclip is clicked. We call the navigateToURL to go to the required URL.


this.addEventListener(Event.ENTER_FRAME,revFrame);
function revFrame(e:Event):void{
if(rewind == true){
prevFrame();
}
}

This code is similar to onEnterFrame in AS2, it keeps checking rewind, if rewind is true it just goes back to the previous frame from the current frame.

- End of Tutorial

Labels: ActionScript 3, Flash