H3XED

ActionScript 3 Semi-Transparent BitmapData, ARGB

May 31, 2011   Programming   Nick Vogt   Comments (1)
Please note that this post is over a year old and may contain outdated information.
Creating semi-transparent BitmapData in ActionScript 3 is done using an ARGB hexadecimal value (32-bit). ARGB stands for Alpha-Red-Green-Blue and is just like an RGB hex value but with an alpha level at the beginning. Due to the alpha level, ARGB hex values are 8 hex digits and not 6. If you aren't familiar with hexadecimal, I suggest reading up on it before continuing.

In the alpha level, 00 represents fully transparent and FF represents fully opaque (visible). For example, to create a fully opaque black, you would use FF000000 (0xFF000000). To create a semi-transparent black, you could use AA000000 (0xAA000000).

Look at this example. Copy & paste it into a new ActionScript 3 flash file and test it.

// When the 3rd argument is set to false, an opaque RGB bitmap is created
var box1:Bitmap = new Bitmap(new BitmapData(250, 150, false, 0x6699CC));
box1.x = 40;
box1.y = 40;
addChild(box1);

// When set to true, you can use ARGB to set the bitmap transparency level
var box2:Bitmap = new Bitmap(new BitmapData(250, 150, true, 0xAACC6666));
box2.x = 80;
box2.y = 80;
addChild(box2);

You should see a fully opaque blue square with a semi-transparent red square overlapping it. Experiment with the alpha values to get the hang of it.

Here's a quick chart for base-10 percentage transparency to hexadecimal values:

TransparencyHex Value
0%00
10%19
20%33
30%4c
40%66
50%7f
60%99
70%b2
80%cc
90%e5
100%ff
Share This Post
Twitter

Comments (1)

Valerie Martin   Mar 12, 2012
Thank you! I was only familiar with alpha transparency using RGBA of .1 to 1. Is there a more complete or detailed cheat sheet like yours above?
Share This Post
Twitter
H3XED © Nick Vogt   RSS   Policies   Twitter