By Harendra Alwis
Invisible buttons and movie clips
This week we will cover a few frame actions as promised, but in the mean
time I'll help you peep into the wonderfully creative stuff you can do
with buttons. To give you a brief insight into what we are going to do
this week, just let me tell you that buttons are not there simply for navigation
or to perform certain tasks, you can have as much fun with buttons as you
can with flash movies - just let me tell you how. In the mean time this
will also give you a chance to flex your muscles on flash movies. So have
a good workout.
Let me first introduce you to 'Invisible Buttons'. This is nothing special,
just a regular button, but without any 'Up', 'Over' or 'Down' state specified.
This will be clear to you if you actually take a look at the timeline for
a button symbol where you draw the shape of the button on a Keyframe on
the 'Hit' state and leave the rest of the frames blank. Drag an instance
of this button on to your stage. There the button will appear light blue
but when you test the movie (Ctrl+Enter or Control>Test Movie) you won't
see anything (well I did say that we were creating an invisible button
right?) Invisible buttons have the same capabilities as any other button,
so you can assign them the same actions and behaviours except the 'Up',
'Over' or 'Down' states because of the simple reason that they are invisible.
These are also known as 'ghost buttons' and as the name suggests, you
can do some spooky stuff with them. So give your creativity a field day
and tell me what you come up with. Reader Prageeth Thoradeniya sent in
one of his Flash experiments, which was very good for starters. So if you
have anything Flashy to show feel free to email them to Techno Page.
I'll leave you to experiment with buttons, and move on to movie clips.
If you thought that working with buttons was exciting, wait till you get
to the movie clips! There is not as much interactivity with movies as with
buttons, but Flash is more famous for its movies than for anything else.
Just recall the basics we learned about using symbols and tweening methods,
as they will come in handy when you are working with movies. So put on
your seatbelts because we are going to create something really cool and
simple with flash.
Open a new movie. In first keyframe type anything of your choice (For
example you can type 'Techno Page'). Now turn this into a graphic symbol.
You can do so by selecting the text and pressing 'F8', then giving it a
name of your choice and selecting 'Graphic' as the behaviour type. To add
a simple animation, we will turn it into a movie clip. So select it again,
press 'F8' and this time select 'Movie Clip' as the behaviour type before
you press 'Ok'. It will help, if we name this layer at this point. You
can give the layer any name you want, but make sure that name won't add
to the confusion.
Now you can either right-click the text clip and choose 'Edit in place'
or just double-click it to get into the movie clips' timeline. Rename 'Layer
1' as 'Text Clip' to show that you are editing the movie clip symbol. Then
create keyframes on frame 10, 20 and 30. At frame 10 and 20, chose 'Effect'
panel to change the colour of the text at each point. Then right-click
on any of the frames in-between and chose 'Create Motion Tween' to animate
the colour changes.
Now while you are still in the symbol-editing mode add another timeline
and name it 'Action Script'. Then double-click the first frame where you'll
get the 'Frame Actions' dialog box. There, click on 'Actions' (not 'Basic
Actions') and double click 'Start Drag'. Then you will see the code being
added in the immediate frame. Select the code-line that was added (if it
is not already selected) and you will see additional fields to be filled.
If you don't see them, make sure that the 'Normal Mode' is selected by
clicking on the small arrow button on the top right-hand corner of the
dialog box. There, type in 'GetProperty (_x,_y)' in the 'Target' field
and keep the 'Expression' check box checked. Make sure that 'Lock mouse
to center' is also checked.
Now you are all set to try out what you did, so close the 'Frame Actions'
dialog and hit 'Ctrl+Enter' or choose Control>Test Movie. Amazed? Well,
continue to try out new things and you'll be surprised at how such complex
actions could be done so easily in Flash.