[fmx]text effect

[virusdoder]

hy,

my englisch is not so good, sry there for!

i will create an effect like this:

virusdoder
v i r u s d od e r
v i r u s d o d e r

it must by horizontally

can sombody help me?

[upuaut]

Sorry my friend. You will have to try to ask the question again in more detail. It doesn't make any sense yet.

What is your native language?
I might be able to find someone who speaks that.

[virusdoder]

dutch

well, the distance between the characters must be bigger. so first the will stand with for ex. 0 cm, than 0.5, 1, 1.5 ...

it must be horizantoly, i mean, the letter must go to right and left.
i hope that you understand know a little bit better?

[Chiser99]

cant you just selct the text and use the a/v slider to make futher apart/ closer together

[blah-de-blah]

Do you want it tweeened, or done with code?

[virusdoder]

maybe it's stupid, but can you say the both, then i learn a little bit

[virusdoder]

Chiser99,

if i do that, then must i do it for a few frames and i thought that there was something in AS to do that

[blah-de-blah]

oh so you're looking for something coded right? i'll try but i might nto be able to get it. :-\

[blah-de-blah]

sorry, i don't have much clue actually :-\ I don't know what code i'd use :-\

[virusdoder]

and, whith tweening?
is that easier?

i know you can make this effect frame by frame, but that's not i like to do it

[blah-de-blah]

yea, thats tweening. Not frame by frame, but sorta. It doesn't take that long though if its something simple like that :) Unless you want it to go on forever

[virusdoder]

but how do i do that, i have tried, but it doesn't work.

p.s
my english: is it a little bit good or not?

[blah-de-blah]

its understandable, so thats fine :)

anyways, on frame 1, choose type your text.

then on frame 5 of the same layer, add a keyframe, and choose how you would like the text to be changed. So here you would add spaces and stuff.

then between frames 1 and 5, right click and choose 'create tween motion'. Thats it. If it doesn't work tell me :)

[virusdoder]

i have try it, but it doesn't work.

[kode]

something like this? :-\

createText = function(str, dmax) {
var i, d;
for (i=0; i<str.length; i++) {
this.createEmptyMovieClip("char"+i, i);
this["char"+i]._x = this["char"+(i-1)]._x+this["char"+(i-1)]._width;
this["char"+i].createTextField("charField", 0, 0, 0, 0, 0);
this["char"+i].charField.text = str.charAt(i);
this["char"+i].charField.autoSize = true;
this.onEnterFrame = function() {
if (d<dmax) {
for (i=0; i<str.length; i++) {
this["char"+i]._x = this["char"+(i-1)]._x+this["char"+(i-1)]._width+d;
}
d++;
} else {
delete this.onEnterFrame;
}
};
}
};
this.createText("virusdoder", 20);
if so, i guess i could try to explain it and work more on it to make it easier. :P

[Flashmatazz]

Well, Kax beat me to it, but I couldn't resist posting my attempt as well:

[virusdoder]

euh,

i will test it, but i think that i don't understand it, but i will do myne best

[Flashmatazz]

that's ok

p.s. Virusdoder, in het Nederlands is wat mij betreft ook ok. ;)

[virusdoder]

Flashmatazz,

thank you very well! that is what i'm looking for.
but i have one question.

now the characters are going to the right,
is it also possible to right en left the same?

thank you again

[virusdoder]

had het ni gezien, ja, mijn engels is niet zo goed, ik weet het.

je bent bedankt

[Flashmatazz]

I created an extra variable:



var startX = 100;


and changed a line in the onEnterFrame:



_root["char"+i]._x += ((((i - myArray.length/2)*spacing) - _root["char"+i]._x)/speed) + startX;


Hope you like it :)

[virusdoder]

thank you, that is it!

if i can do for you something, let me know!!!

but, i wil ask 1 thing more, euh, 2 thing
1) can you explain me the script, i will learn it
2) where can i put an apha en can i create more line whith the same effect?

[Flashmatazz]

new code (including random alpha change):


var speed = 2;
var pause = 2000;
var spacing = 10;
var startX = 100;
var myAlpha = 100;
var myText = "Virusdoder";

myArray = myText.split("");

for(i=0; i<myArray.length; i++){
character = _root.attachMovie("myMC", "char"+i, i);
character._x = i*10;
character.myChar.text = myArray[i];
}
function changeSpacing(){
spacing = Math.random()*40 + 10;
myAlpha = Math.random()*95 + 5;
}
_root.onEnterFrame = function(){
for(i=0; i<myArray.length; i++){
_root["char"+i]._x += ((((i - myArray.length/2)*spacing) - _root["char"+i]._x)/speed) + startX;
_root["char"+i]._alpha += (myAlpha - _root["char"+i]._alpha)/speed;
}
}
setInterval(changeSpacing,pause);


In order to work properly you also have to embed the font outline. Go into myMC and in the Properties panel of the textfield, click on Character. Make sure that the option 'All Characters' is ticked.

As for the explanation:


var myText = "Virusdoder";

This is the text that is to be animated



myArray = myText.split("");

This line breaks the variable myText into separate characters and puts them into an array.
In this case the resulting array is {v,i,r,u,s,d,o,d,e,r}



for(i=0; i<myArray.length; i++){
character = _root.attachMovie("myMC", "char"+i, i);
character._x = i*10;
character.myChar.text = myArray[i];
}

With this loop you place an instance of myMC on stage and give it a unique instancename and in it's own level.
E.g. you get char0 on level 0, char1 at level 1 etc.

Note: to be able to use attachMovie() you need to export the mc for actionscript: rightclick on the mc in the library and choose Linkage. Then tick the option 'Export for Actionscript'.

By assigning the attachMovie() to the variable 'character' I can set properties such as the _x and the content of the textfield within the loop by using e.g 'character._x'.

Then the actual function:


function changeSpacing(){
spacing = Math.random()*40 + 10;
myAlpha = Math.random()*95 + 5;
}

This sets a variable called 'spacing to a random value. Math.random() generates a value between 0 and 1. By multiplying by 40 and then adding 10, you get a value between 10 and 50.
In the same way, myAlpha gets a value between 5 and 100.



_root.onEnterFrame = function(){
for(i=0; i<myArray.length; i++){
_root["char"+i]._x += ((((i - myArray.length/2)*spacing) - _root["char"+i]._x)/speed) + startX;
_root["char"+i]._alpha += (myAlpha - _root["char"+i]._alpha)/speed;
}
}


onEnterFrame means that this is executed at the framerate of the movie, in this case 24 times per second.
Again, there is a loop, in which every mc that was created with the attachMovie() command gets a new _x and _alpha.
This is actually based on the easing motion tutorial found here (http://www.kirupa.com/developer/mx/followease.htm)

the last part:


setInterval(changeSpacing,pause);

just says to execute the changeSpacing function with a time-interval of the amount of milliseconds specified by the variable 'pause'.

I think that's about it.

Just let me know if my explanation isn't clear at any point. :)

[virusdoder]

thank you very much.

i understand everything
when you have a problem, let me now

;)

[Flashmatazz]

Cheers.

...and the only problem I'm having is that I don't have a Flash-related job. If you could help me with that... (-: