Home Flash & Swish Flash Tutorials Dynamic Matrix Text Effect

Dynamic Matrix Text Effect

Author: 10Steps.SG More by this author

Added: Sep 24, 2009 Rating:

Level: Beginner Software: n/a

Preparations:

Create a new flash file (ActionScript 2.0) and save it as test.fla in this case.

Dynamic Matrix Text Effect image 1

Step 1:

Create a Dynamic Text on the Stage and key in "txt" as the value for Var.

Dynamic Matrix Text Effect image 2

Step 2:

Convert the Dynamic Text into a Movie Clip Symbol and set its instance name to "mc0".

Dynamic Matrix Text Effect image 3

Step 3:

Create a layer on top of the object layer and name it as actions.

Dynamic Matrix Text Effect image 4

Step 4:

Right-click on the frame and select Actions to open up the Actions panel.

Dynamic Matrix Text Effect image 5

Step 5:

Insert these codes inside the Actions panel.

Change the string of "MY_STRING" to your own preferred sentence.

Change the kern value to space out the letters depending on the font size of your dynamic text.

MY_STRING="Welcome to 10Steps.SG";
kern = 10;
total = MY_STRING.length;
xstart = mc0._x
mc0._visible = 0;
var i = 0;
counterAppear = false;
function txtDuplication(){
counterAppear = false;
if(i<total){
mc0.duplicateMovieClip("mc"+ (i+1),i);
do{
this["mc"+(i+1)].final = MY_STRING.charCodeAt(i);
this["mc"+(i+1)].starting = MY_STRING.charCodeAt(i) + random(8);
} while(MY_STRING.charCodeAt(i) == this["mc"+(i+1)].starting);
this["mc"+(i+1)]._x = xstart + (kern*i);
i++;
}
}txtDuplication();

Step 6:

Right-click on mc0 on the Stage and select Actions to open up the Actions panel.

Dynamic Matrix Text Effect image 6

Step 7:

Insert these codes inside the Actions panel.

onClipEvent(load){
this._visible = 0;
txt = chr(starting);
steps = final-starting;
if(steps==0){
this._visible = 1;
}
adding = steps > 0 ? +1 : -1;
_parent.counterAppear = true;
}
onClipEvent(enterFrame){
if(steps == 0){
return;
}
if(_root.counterAppear==true){
_parent.txtDuplication();
}
this._visible = 1;
thisChar = ord(txt);
txt = chr(thisChar + adding);
steps = steps - adding;
}

You can find plenty of Bitmap Fonts over at Dafont. The one I used in this tutorial is "Visitor by Enigma".

Hope you enjoyed the session. Have fun!

Author's URL: 10Steps.SG