如何使用Flash Builder 4.6沿Y轴旋转图像?

时间:2012-01-05 18:17:08

标签: flash actionscript-3 flex flash-builder

下午好, 我试图使用rotationY旋转图像,但它总是基于图像的左侧旋转有没有办法将旋转点更改为图像的中心?看起来您应该能够使用transformAround()方法,但我在查找与图像有关的transformAround示例时遇到了问题。有没有人有任何关于如何做到这一点或以某种方式做错事的例子?我想要做的是建立一个旋转的幻灯片放映,你点击图像放大。 感谢您的帮助,对不起,这是一个冗长的问题。

1 个答案:

答案 0 :(得分:1)

由于您使用的是Flex框架,因此您可以使用Spark 3D效果旋转图像,而不是使用变换。请参阅下面的示例(您可以轻松地将Rect替换为您的图像)。 Rotate3D的autoCenterTransform属性可以完成将x,y,z旋转点移动到对象中心的所有工作。

<?xml version="1.0"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:s="library://ns.adobe.com/flex/spark"
               xmlns:mx="library://ns.adobe.com/flex/mx">

    <fx:Declarations>
        <s:Rotate3D 
            id="rotateEffect"
            target="{myImage}"
            angleYFrom="0"
            angleYTo="360"
            duration="1000" 
            autoCenterTransform="true"/>
    </fx:Declarations>

    <s:Button label="Rotate" 
              x="10" y="10"
              click="rotateEffect.play()"/>

    <s:Rect id="myImage" 
             x="20" y="40"
             height="100" width="100">
        <s:fill>
            <s:SolidColor color="0xABABAB"/>
        </s:fill>   
    </s:Rect>

</s:Application>

或者,如果您不想完全居中变换点,只是将变换点移动到允许Y旋转,则可以调整图像的transformX属性,如下所示:

<?xml version="1.0"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:s="library://ns.adobe.com/flex/spark"
               xmlns:mx="library://ns.adobe.com/flex/mx">

    <fx:Declarations>
        <s:Rotate3D 
            id="rotateEffect"
            target="{myImage}"
            angleYFrom="0"
            angleYTo="360"
            duration="1000" 
            />
    </fx:Declarations>

    <s:Button label="Rotate" 
              x="10" y="10"
              click="rotateEffect.play()"/>

    <s:Rect id="myImage" 
             x="20" y="40"
             height="100" width="100" 
             transformX="{myImage.width/2}">
        <s:fill>
            <s:SolidColor color="0xABABAB"/>
        </s:fill>   
    </s:Rect>

</s:Application>