The situation looks like this:


- The two shapes are siblings so they have the same parent (i.o.w. the two shapes can’t be nested).
- The blue oval is on top of the green rectangle.
- I want to know when the mouse leaves the green rectangle.

The problem is that the green rectangle dispatches a ROLL_OUT and MOUSE_OUT event as soon as the mouse hits the blue oval.

I tried all combinations of mouseChildren, buttonMode and enabled on the oval and on the parent of the two clips, but nothing seems to make the oval not “steal focus” of the rectangle.

Here is the source of the test: Rollout test (zip)

I can think of some workarounds (hitArea, using an invisible button, etc.) but I much rather find a straight way to handle this kind of situation.
Since this was never a problem in as2 I believe there should be a decent solution in as3 as well.

If someone has an answer to this problem or knows about a secret property I haven’t tried, please let me know…

Just fooling around I came up with this result:

Jolly jellyfish - vector animation | download

The movement and generation of the jellyfish is all actionscript (2.0), the “squezing” is timeline-animation…

Apparently it is some weird bug when it comes to multiplying decimals values by 3. Take this little script for example:

1
2
3
4
5

var j:Number; 
for(var i:int=0; i<10; i++){ 
	j = i/10; 
	trace(j+"*3 =\t"+(j*3)); 
}

It outputs:
0*3 = 0
0.1*3 = 0.30000000000000004
0.2*3 = 0.6000000000000001
0.3*3 = 0.8999999999999999
0.4*3 = 1.2000000000000002
0.5*3 = 1.5
0.6*3 = 1.7999999999999998
0.7*3 = 2.0999999999999996
0.8*3 = 2.4000000000000004
0.9*3 = 2.7

And it doesn’t stop just there. The same problems occur when adding a decimal value to the double of it’s value:

1
2
3
4

trace(.1+.2) //0.30000000000000004 
trace(.2+.4) //0.6000000000000001 
trace(.3+.6) //0.8999999999999999 
trace(.4+.8) //1.2000000000000002

The problem occurres in Javascript as well as in Actionscript (and probably some other languages too) so it’s probably caused by the way decimal values are treated at byte-level. Because it’s not likely there will be a fix for this soon, here is a little workaround:
i = int(i *10)/10; //use int() in favour of Math.round() to speed up the code

Very smart Adobe!

Fortunately I thought of an easy way to get this problem solved; simply copy the remoting classes from Flash 8 to some other directory and set this directory as one of your default Flash 9 – as2 – classpaths. (Copying it into the default classpath with all other default classes didn’t work for me somehow.)

To make it easy for you I extracted the remoting classes and put them in a zip: as2RemotingPackage.zip

PS: I coudn’t find any info about this on the internet so either nobody ever needed it, nobody ever bothered to try and find a solution or this solution is so simple nobody ever bothered to write about it.
Anyway I bother to write about it for those of you who couldn’t find a solution or just didn’t bother to find one.

Hope this will help you…

ribbon #1 (2003?)
soap (2005)
particles #1 (2005)
particles #2 (2006)
particles #3 (2006)
mouse #1 (2006)

Let me know what you think of them…

I hope to convert some older experiments in to as3 in the near future. I’ll keep you posted!

Update (2007-12-05)
I moved my experiments to a new domain and I renamed them because their numbers became too overwhelming
You can find these and other experiments on http://labs.powerupmedia.nl

As it turned out, the width and height of the MovieClip only represent the bounding box of the original shape (when it still had a rotation of 0). The only way to get the actual width and height of the MovieClip was to use the getBoundsmethod. This method calculates the boundingbox according to the current shape and orientation of the MovieClip giving the trrue width and height.

To test this create a movieclip width a circle in it and place the code below on the first frame (I’m no fan of timeline-code but it’s ideal for testing purpose ).

1
2
3
4

this.onEnterFrame = function(){ 
	this._rotation += 15; 
	trace("boundingbox-width: "+(this.getBounds().xMax-this.getBounds().xMin)+"\t\twidth: "+this._width); 
}

The sample is as2 but the problem and solution are the same in as3.

I hope this helps some of you who were wondering why a 25px circel suddenly had a 35.4px width .

To save you the time and frustration, here is why it didn’t work:
You can’t use the allowFullScreen = true and wmode = transparent together

Somehow the flashplayer is not smart enough to simply make the background opaque when you set the player to fullscreen mode.

Lets hope they fix this in the next player update…

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34

//slow:
z = Math.abs(x);
//faster:
z = (x<0) ? -x : x;
 
//slow:
z = Math.min(x,y);
//faster:
z = (x<y) ? x : y; 
 
//slow:
z = Math.max(x,y);
//faster:
z = (x>y) ? x : y; 
 
//slow:
z = Math.floor(x);
//faster:
z = (x >>> 0); 
 
//slow:
z = Math.ceil(x);
//faster:
z = (x >>> 0) + 1; //mind the brackets! 
 
//slow:
z = Math.round(x);
//faster:
z = int(x); 
 
//slow:
z = Math.pow(x,2);
//faster:
z = x*x; //this one only works faster if the power is a fixed value; for-loops in case of a variable power are most of the time slower than the Math.pow!

Of course most of the above method replacements make your code more sloppy, so I suggest you only use these replacements when the speed of the application really matters (for example in huge for-loops) or in libraries or components which rarely need adjustment.

If you have any good additions to this list please let me know…

Unfortunately many people omit them in their code . Not sure why though, but my guess is that they are ignorant or just lazy (don’t be offended if you don’t use the this keyword for another reason, but please let me know why).
Even Adobe (and Macromedia before them) neglects the this keyword. None of their examples uses this and it’s nowhere to be found in their own code either!
Shame on them!

At the company where I work we didn’t use the keyword up until a year or two/three ago. Some of us found the keyword to be very handy and convinced the rest (not sure which group I belonged to at that time).

First of all, using the this instance variables supplies you the option to declare a local variable with the same name:

1
2
3
4

this.myVar = "my instance var"; 
var myVar:String = "my local var"; 
trace(this.myVar); //my instance var 
trace(myVar); //my local var

(Note that the above code only works in a class and not in the timeline!)

This can come in really handy when you need to store some temporarily data, during a for loop for example.

The second and most important reason to use this, is that it keeps your code clean and neat. It will help you to visually distinguish the local variables from the instance variables. This is vital if you work in a team on the same project or if other people need to work on your project later on (bug fixing, implementing new feature, etc.)
In all these cases it’s important to scan through someone’s code quickly and see at a glance where a certain variable comes from or is declared. If you omit the this keyword you would first have to scan the entire method to see if, maybe, the variable is declared local in this method. While if you do use the this keyword you know for sure it is declared in the Class definition and you know you can use it throughout the entire class (and in case of a public var, throughout the entire code).

So using the this keyword gives you more control over your code and it lets you (and your colleagues) programme in old or other peoples code much faster!

If you don’t use the this keyword at the moment, I hope this post convinced you to try out the this keyword for a while (even if it’s only for one single project) and I’m sure you never want to programme with out it, ever again.

If you already did use the this keyword, maybe this post wil help you to convince some ignorant fools in your vicinity .