Transparency png issues with creating a Flash Map in Flash CS4

Posted on 2010-01-07
Medium Priority
Last Modified: 2013-11-12
Hi everyone, I'm having a problem at the moment as I try to create a Flash map of England. I've imported transparent png images of all the different counties within England and converted them into rollover buttons. Every single county button has its own layer on the timeline, but the problem arises as the mouse detects the square box around each png image and not the county outline within. I want the 'hit area' for each button to just be non-transparent part of the png.

Does anyone have any simple ideas on how I could get round this problem?
Question by:far2cool
LVL 13

Expert Comment

ID: 26202738
You won't be able the use the transparency to determine hit areas. The best way around this is to create vector shapes and turn them into button symbols.
LVL 19

Expert Comment

ID: 26202839
You asked for a "simple" solution - and crooksy88 is right - your best best would be to use vectors.  If it's not feasible to recreate them in the Flash API, you can take the layers from photoshop to Illustrator and save them as vectors there, then import those directly to flash.

If that too isn't feasible for you, you could technically use a mouseMove handler with Bitmap and BitmapData methods to check the color of the pixel beneath the pointer using getPixel32, and if it's not transparent, react.  But that's definitely not a simple solution : )
LVL 14

Accepted Solution

TanLiHao earned 1000 total points
ID: 26206564
Like what crooksy88 said, you can't use the transparency to determine hit areas. There is no simple solution too to determine where is the transparency using Actionscript like what moagrius said.

But here's a trick, in the up, over, and down state of your button, you might want to keep the bitmap. In the hit area, duplicate your bitmap and place it there. Click the bitmap, you should be able to see the border around the transparency, if you don't. There is no transparency.

If there is, press ctrl b on the bitmap. Go to the properties panel, you should now see it as a shape. Of course, you might realise that you can only select the entire shape and not the individual portions. Now deselect the shape. Click the lasso tool, go to the context-sensitive option in the tools panel, i.e. should be near the bottom of the tools panel. Click on the transparent part of the shape. The transparent part should now be selected. Press delete, the transparent portion will be gone.

If you get other parts of the shape being deleted when you use the magic wand. Click the magic wand settings, which is below the magic wand when you select lasso tool. Change the threshold to 0 and redo the above steps.
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

LVL 12

Expert Comment

ID: 26207281
crooksy88 is solution.

Author Comment

ID: 26208655
Thank you everyone for the quick replies. TanLiHao your solution worked perfectly, thank you for the clear and concise instructions. I am now just deleting the transparent background of each png image in the hit state of the button and means I can keep all of my existing png's in my Flash project (as they were neatly arranged!).
LVL 14

Expert Comment

ID: 26272499
Sorry for posting but I have waited a day and I thought you might have forgot about assigning points to the solutions that helped you.

You might want to assign the one that answered your question entirely as the accepted solution and for the assisted solutions, you might want to give the points to those who help you clarify some concepts related to your question.

Featured Post

Keep up with what's happening at Experts Exchange!

Sign up to receive Decoded, a new monthly digest with product updates, feature release info, continuing education opportunities, and more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Recently, I was asked to recommend a tracking system to be implemented on a clients website. As the entire site was built on flash, my first thought was to suggest custom built tracking system. However, our company at that point of time didn't h…
Turn A Profile Picture Into A Cartoon Using Photoshop And Illustrator This tutorial will teach you how to make a cartoon style image out of a regular picture. I have tried to keep the tutorial as simple as possible. I used Adobe CS4 for this tuto…
The goal of the tutorial is to teach the user how to live broadcast using Flash Media Live Encoder and connecting it to YouTube to broadcast. Log into your Youtube account, choose live stream settings, start live stream from Flash Media Live Enc…
The goal of the tutorial is to teach the user how to select which audio input to use. Once you have an audio input plugged into the laptop or computer, you will go into the audio input settings and choose which audio input you want to use.
Suggested Courses

862 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question