PDA

View Full Version : the "Hit" frame on buttons


dpru
01-23-2007, 11:06 PM
I got a quick question about the "Hit" frame on buttons.

I have a set of images that are images of different nations (Brazil, Argentina, etc.) I have converted each image into a button, because I want the user to be able to click on the country, and then information about that specific country will be displayed on the right side of the flash stage.

My dilemma: setting the clickable area for each image. By default Flash sets the clickable area to be the entire image (including empty white-space). I do not desire this.

I already know that I can edit each symbol and create a keyframe on the "Hit" frame, and then I can draw lots of nice little shapes that will become the clickable area for that button, but that is NOT what I want.

Drawing nice little beautiful shapes will not accurately portray the shape of each nation. I would like the clickable area of each button to be exactly outlined by the outline of each nation in the image.

In other words, if the button is an image of Brazil, I want all of Brazil to be clickable, no less, and no more. No whitespace should be clickable, but no part of Brazil should be left out.

If I just drew nice little shapes...they certainly would either cover too much or not enough of the image. Using the Lasso tool would give me better accuracy than drawing little shapes, but using the Lasso tool to outline about one-hundred nations is extremely tedious and slow.

There has to be a more simple way to accomlish this. So, how might I accomplish this?

I originally tried this: I decided to go into Photoshop and make the background of the image (all that whitespace) transparent. It didn't work. Flash didn't care what part of the image was declared as being transparent and what part was declared as being opaque. All of the image was still considered "clickable", even whitespace.

So...once again...how might I accomplish this? Any ideas?

JulieLeanne
01-24-2007, 08:35 AM
Using invisible buttons over your images would allow you to accomplish this. You can make the invisible button, the same shape as brazil and place it directly over your image. This way, only the area inside of the country shape would be clickable.

Also, if you do not want to re-trace your country shapes, while still in photoshop you can save your mask selections as work paths, and then export the work path as vector art. The vector art can import to flash. you would just want to make sure there is no fill on the shape, as to not cover up your images.

Hope that helps

Julie

Noct
01-24-2007, 04:05 PM
I already know that I can edit each symbol and create a keyframe on the "Hit" frame, and then I can draw lots of nice little shapes that will become the clickable area for that button, but that is NOT what I want.The hit frame is what is displayed AFTER someone has clicked a button, so I don't see how that would help you...
Beyond that, don't use buttons for this, use movieClips. (There is less functionality to a button.)

Also, while JulieLeanne is right about you needing to create "invisible" clips to handle the click events, it will not work the way she is describing. By the way you explained it, the shapes you want to click on are somewhat complicated? We aren't talking about clicking a square flag in the middle of white space right?

The reason I ask is that every symbol in Flash has a bounding box around it, and If you want something to be clickable, it must be made into a symbol. So, even if you define a complex shape around your object using a lasso, or path to vector, or whatever...the bounding box around it is still just that..a box. If you want more complicated shapes to be your rollOver, you would need to:

1.) Build your rollOver area using a series of small boxes to outline your image, one under the outline to catch clicks to the "fill", and run the same script on all of them.

2.) Use hitTest to determine when the mouse is Over an image, then use an array of points to hitTest where you are in the image.

I'm sure there is ten other ways I'm not remembering right now too...

Julie also mentioned removing the fill from your rollOver shapes...that would not be good. If there was no fill, the event would only happen when you rollOver the lines outlining the image.