flex4 绕中心 旋转和翻转

特别参考文章：http://uh.9ria.com/space-28025-do-blog-id-10991.html

                   http://www.cnblogs.com/yjmyzz/archive/2010/05/20/1740377.html
1 简单方法1：可以通过设置autoCenterTransform为true或false来控制组件是绕中心点旋转还是绕左上角旋转 和翻转 例如
<s:Rotate3D  id="rotateEffect"  target="{apanel}"      autoCenterTransform="true"/>
代码中：{
rotateEffect.angleXFrom=0;
rotateEffect.angleXTo=旋转值;   //上下翻转
rotateEffect.play();
}

 

如果要设置旋转中心为其他任意点：

<s:Rotate3D id="rotateEffect" target="{apanel}"   autoCenterTransform="false " transformX="150" transformY="150"/>

即使用transformX和transformY 设置旋转中心。

同样也可以设置缩放中心：

<s:Scale3D id="scaleEffect" target="{apanel }"    autoCenterTransform="false" transformX="100" transformY="200"  />

另外投影中心autoCenterProjection及projectionX,projectionY又是另外一回事。
2 简单方法2：我们知道flex组件 默认的旋转中心点是左上点，同时组件的child也以此为中心点变化，那么把child的中心和父组件的左上角对齐，然后旋转父容器，那么child就成了以自己的中心点旋转的效果：

-------------------------------------------------------------------------------------------

换句话说，被旋转的其实是父容器，child的中心和父容器旋转中心重叠而已，貌似child绕自己的中心旋转了

用这种办法可以任意设置图片的旋转、翻转及缩放的中心。

代码如：

<s:BorderContainer id="containerPnl"   toolTip="父容器" width="100" height="100" x="250" y="250">
        <s:Panel width="200" height="200"  x="-100" y="-100" id="apnl" title="子容器"  />
    </s:BorderContainer>

 

然后旋转父容器： containerPnl.rotationX=45 ;