Unit 12.  Buttons (II)

Text buttons. The importance of the active area

Since now, the buttons have a frame in which we indicate the active area. This seemed to be useless in the examples we saw up to now, since it's commonly believed that, evidently, the active area where we want to have our button is the area that includes the limits of this button.

Let's see that this isn't always so trivial. Here are two buttons created in Flash MX 2004. Let's verify what happens when the mouse moves over one and another.

Although they seem identical, the difference happens at the moment in which we locate the mouse on one of the spaces that exist between letter and letter or, in general, all those places that don't belong to the text itself.

In the left text the button is activated only when we place the mouse pointer over the letter. This can be uncomfortable and can bring to confusion, since someone that browses through our pages simply would like to make use of the button and not have to aim concretely some letters that perhaps could be very narrow.

This is due to the poor use of the active area. In the right button this problem is solved as we can verify again. Here you have an example of how to do it correctly. 

Including a clip in a button

  The inclusion of movie clips in the buttons can make them more colorful.

     It is usual to place a clip in the Over frame to indicate some type of extra information or an animation to go beyond a change of color.

     It's also common to see a movieclip acting as a button. This can be done, for example, by inseting the clip in the Up frame.

Let's see for example the following button:

Verify all the states of the mouse. From what the button tells us we can discern that something begins, but perhaps we don’t know clearly what.

If at certain moment we don’t want this to happen on our Web pages, we can introduce a clip in the button, to explain a little more about what will happen if we click.

Here you can follow the process that we commented 

And that is the result. 

Bitmaps and Buttons

In addition to clips, the buttons can also contain symbols of Graphic type.

     Since we've already seen, everything that is possible to do with a graphic can be done with a clip as well, let's focus in the Bitmaps that Flash allows us to import, since they are wide used as form of graphical expression all over the Network.

     If we consider the already known limitations on the bitmaps, then using of them in the creation of buttons can seem to be uninteresting, but it isn't the case.

     Basically we can make two things:

     1) Including different bitmap in each one of button frames, obtaining an effect similar to the effect obtained with languages like Javascript (always in view of the larger ease of Flash).

     2) Taking advantage of the Graphic properties in Flash. For this, first, we would have to import the Bitmap and convert it later into button symbol. Then we would publish it and, after inserting each keyframe, we would convert its content to Graphic symbol. Once we've done this, we will be able to obtain quite good effects by varying the effects of the instances in Flash (Alpha, Red, Brightness).

     Here is a small sample where we've only used a Bitmap of GIF type. We've converted it into a graphical button by applying an Alpha (Transparency) effect to the Up state. In the Over frame we have left the original GIF so that when passing over the button it seems to be switched on. Finally we have increased the intensity of red in the Pressing frame to make it seem to be incandescent.