Finally I managed to have something which work perfectly and without external library. The trick was so simple that I don't understand why I don't tried it before.
Instead of applying X, Y and Z transformations on the same element, I apply the X and Y rotations on a container and the Z axis on the picture inside the container.
Like this, the Z rotation doesn't disturb the other axis anymore.
Here is the working test code:
<fx:Script>
<![CDATA[
private function init():void
{
moveZ();
var timer:Timer = new Timer(5000);
timer.addEventListener(TimerEvent.TIMER, repeat);
timer.start();
}
private function repeat(e:TimerEvent):void
{
moveZ();
}
private function moveX():void
{
rotX += 20;
fx.angleXTo = rotX;
fx.angleYTo = rotY;
fx.angleZTo = 0;
fx.duration = 1000;
fx.play(new Array(container));
}
private function moveY():void
{
rotY += 20;
fx.angleXTo = rotX;
fx.angleYTo = rotY;
fx.angleZTo = 0;
fx.duration = 1000;
fx.play(new Array(container));
}
private function moveZ():void
{
rotZ += 360;
fx.angleXTo = 0;
fx.angleYTo = 0;
fx.angleZTo = rotZ;
fx.duration = 5000;
fx.play(new Array(image));
}
]]>
</fx:Script>
<fx:Declarations>
<fx:Number id="rotX">0</fx:Number>
<fx:Number id="rotY">0</fx:Number>
<fx:Number id="rotZ">0</fx:Number>
<s:Rotate3D id="fx" autoCenterProjection="true" autoCenterTransform="true"/>
</fx:Declarations>
<s:VGroup id="vGroup" left="10" top="10">
<s:Button label="X" buttonDown="moveX()"/>
<s:Button label="Y" buttonDown="moveY()"/>
</s:VGroup>
<s:BorderContainer id="container" width="200" height="200" horizontalCenter="0"
verticalCenter="0">
<s:BitmapImage id="image" width="200" height="200" horizontalCenter="0" smooth="true"
source="@Embed('assets/circle.png')" verticalCenter="0"/>
</s:BorderContainer>