[CS3] Flash buttons with fade effects.

Thread view:

Enable EMail Alerts

Start New Thread

Thread rating:

K0raX - 06 Jul 2008 09:11 GMT

Well as the title says, i've got some buttons in Flash CS3, using AS 2 which
when clicked changes the frame. The thing is that i want to add a fade effect
to the text area AFTER the button was pressed. So for example:
The user is reading the text, he presses one of the buttons (all of which
change frames, in this case text) and the text fades away and the new text
fades in.
Well, i've designed the frames needed for this, so i've got 10 frames before
the frame the user will see for it to fade in and 10 frames after it to fade
out. What i havent figured out yet is how i'll make the script do that. I mean,
i can make the script go forward one frame, starting the fade out effect, i can
make it go to the frame i want but how will i do both.
I've got 6 buttons and 6 corresponding texts.
Does anyone have any ideas?
Thank you in advance.
P.S.: Any ideas welcome. I can change the frame layout.

Reply to this Message

kglad - 06 Jul 2008 17:54 GMT

cross-fading two objects is much easier if you use actionscript than if you use
the timeline.

you might want to reconsider the entire setup of your application if you
intend to pursue the cross-fading.

Reply to this Message

K0raX - 06 Jul 2008 20:04 GMT

First off, thanks for your answer.

I see. So a [b]correct[/b] usage of that would be?
As i was saying i can re-model everything, so i'm open to any suggestions as
long as they work.
I'm quite new to AS, so i dont know most of the functions that come with it
(experience comes due time :smile; ).

Reply to this Message

clbeech - 06 Jul 2008 21:03 GMT

I agree kg ;)

to make this as simple as possible KOraX - place each of the text 'objects'
(which im assuming are MovieClip instances) on the stage, in different layers,
and give them instance names. do the same with your buttons on a seperate layer
but you will only need one for them all - don't forget instance names - then
you can use the Tween class to cause the transition. you will want to place the
instance names of both the buttons and the clips within arrays to assign the
handler code to all instances within a loop, for simplicity, as in something
like:

import mx.transitions.Tween;
import mx.transitions.easing.*;

var btns = [btn01, btn02, btn03, btn04, btn05, btn06];
var clips= [clip01, clip02, clip03, clip04, clip05, clip06];
var current:MovieClip;

for(var i=0; i<btns.length; i++) {
btns[i].id = i;
btns[i].onPress = function() {
new Tween(current, '_alpha', Strong.easeOut, 100, 0, 10, false);
new Tween(clips[this.id], '_alpha', Strong.easeOut, 0, 100, 10, false);
current = this;
}
}

//start the first clip transition 'in'
current = clips[0];
new Tween(clips[0], '_alpha', Strong.easeOut, 0, 100, 10, false);

Reply to this Message

K0raX - 06 Jul 2008 22:48 GMT

I've already had them placed each on their layer. I thought i might need
mobility on the timeline.

Let me see how much of this i understand...

[Q]which im assuming are MovieClip instances[/Q]

They're graphics but i can simply change them to be movie clips if it's the
case.

[Q]do the same with your buttons on a seperate layer but you will only need
one for them all [/Q]

I've lost you here....you're saying ill only need one AS reference?

[Q]for(var i=0; i<btns.length; i++) {[/Q]

Hmm... you're using the size of the array to set how many times the loop
control will actually loop? Took me a bit to figure out what length an array
could have :wink;

[Q] new Tween(current, '_alpha', Strong.easeOut, 100, 0, 10, false);
new Tween(clips[this.id], '_alpha', Strong.easeOut, 0, 100, 10, false);
current = clips[this.id];
}
}

//start the first clip transition 'in'
current = clips[0];
new Tween(clips[0], '_alpha', Strong.easeOut, 0, 100, 10, false);[/Q]

Ok i didnt get most of this but i'll have to check out the parameters for the
Tween function. :tounge;
Actually i plan on going from a 50% alpha to a 100%, but that's just my choice.

Thanks a lot and hope i dont become too annoying. :grin;

P.S. I had a huge revelation at the end when i re-read the code and finally
understood how this is going to work.

Reply to this Message

clbeech - 06 Jul 2008 23:31 GMT

lol - yeah o :) - you should convert them to movieclips symbols - this is so
that you can assign a 'instance name' to each - with one selected on the stage
look in the properties panel, and you will see a box for it - enter a name for
each symbol there. those that i have assigned in the array for the 'clips' as
in: clip01, clip02, etc. are examples - they should be the same as the instance
names you assign to each corresponding MC.

i only meant the you only need to use a 'single' layer to place all of the
button instances on, although you can separate them if you wish - however the
above does still apply to those as well - they will all need instance names.
again the 'btns' array is where those names should be the same as those you
assign.

an array can be as big as you like (although i do think there is a cutoff
limit around 17k or something like that) and yes this is a common method of
iterating through an array - even when it may be dynamically generated - ie.
the amount of items change regularly.

going from a '50%' alpha isn't really going to work - in this case you would
'see' all of the instance that are 'stacked' atop one another. they will need
to run up from zero.

don't worry about it ;) this is the place to ask questions like this and learn.

Reply to this Message

K0raX - 09 Jul 2008 12:13 GMT

ok sorry to bring this back up but since i had a change in plans i've been
bugged by a question.
Well. I can assign the same instance name to a button twice right? But will
they both work the way they would if i wrote the same code for each of them?
I've thought about that since i have 2 sub-menus on each of 2 of the main
menus, but i also want it to open up the first clip not simply show the
sub-menu. So for example a user clicks on Home, the home clip (text) comes up.
But when he clicks About which has 2 more choices, About me, About my team, it
automatically opens up the About me clip.
Would that work or is there a "more correct" way to do it?
Thanks again :D

Reply to this Message

clbeech - 09 Jul 2008 14:25 GMT

actually, although it seems like one should be able to, you cannot assign the
same instance name to multiple buttons. however, you can assign the same
method call to different instances. so for instance, each 'about' button could
play the 'about clip' but each button also 'send' the playhead to a different
frame or label.

Reply to this Message

K0raX - 12 Jul 2008 12:49 GMT

Ok so i finally managed to get the separate buttons thing going on by making
the 2 buttons INSIDE the movie clip itself. But the problem is that the 2 text
clips that have submenus overlapse, making only one of the buttons on that
particular area work. I thought about tabIndex but it wouldnt work or at least
i presume i used it correctly. I added to btn02
on(release){
clip02.tabIndex = 1;
clip03.tabIndex = 2;
}

and the otherway around for btn03.
Any other way i can make one take preceeding of the other or dissapear when
the other is showing?

Reply to this Message

Webmaster Forum / Flash / Flash Actionscript / July 2008

[CS3] Flash buttons with fade effects.