Question

我试图创建一个弧形的旋转动画。即使在尝试了所有这些示例之后，我也无法围绕中心旋转它。它绕着左上角旋转。

private function init():void
        {
            var hgroup:Group=new Group();
            this.addElement(hgroup);

            arc1=new Graphic();
            arc1.graphics.lineStyle(12,0xff0000,1,false,"normal",CapsStyle.SQUARE);
            draw_arc(arc1,CENTER,CENTER,70,14,288,1);

            hgroup.addElement(arc1);

            var matrix:Matrix = arc1.transform.matrix; 
            var rect:Rectangle = arc1.getBounds(arc1.parent); 
            matrix.translate(- (rect.left + (rect.width/2)), - (rect.top + (rect.height/2))); 
            matrix.rotate((90/180)*Math.PI); 
            matrix.translate(rect.left + (rect.width/2), rect.top + (rect.height/2));

            var rot:Rotate = new Rotate();
            rot.angleBy = 360;
            rot.duration = 1000;
            rot.target = arc1;
            rot.play();

        }

        public function draw_arc(movieclip:Sprite,center_x:Number,center_y:Number,radius:Number,angle_from:Number,angle_to:Number,precision:Number):void {
            var angle_diff:Number=angle_to-angle_from;
            var steps:Number=Math.round(angle_diff*precision);
            var angle:Number=angle_from;
            var px:Number=center_x+radius*Math.cos(angle*deg_to_rad);
            var py:Number=center_y+radius*Math.sin(angle*deg_to_rad);
            movieclip.graphics.moveTo(px,py);
            for (var i:Number=1; i<=steps; i++) {
                angle=angle_from+angle_diff/steps*i;
                movieclip.graphics.lineTo(center_x+radius*Math.cos(angle*deg_to_rad),center_y+radius*Math.sin(angle*deg_to_rad));
            }
        }

Answer 1

你需要这个属性：

rot.autoCenterTransform="true"

请参阅文档底部的示例：http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/spark/effects/Rotate.html

Answer 2

我有一个类似的问题（带有旋转箭头），我修复了这个问题：

<s:Group width="0" height="0" verticalCenter="0" right="14">
    <s:Graphic id="arrow" rotation="90" rotation.selectedStates="0">
        <s:Path data="M 0 0 L 5 5 L 0 10 Z" left="-2.5" top="-5">
            <s:fill>
                <s:SolidColor id="arrowFill"/>
            </s:fill>
        </s:Path>
    </s:Graphic>
</s:Group>

容器Group的大小设置为0，因为它仅用作其包含的图形的锚点。此Group的位置是旋转中心点。 Path中的Graphic被定位为其锚点位于其中心（即它的宽度为5px，高度为10px，因此它向左重新定位2.5px，向左重新定位5px）。

实际轮播是通过此处的States和Transformations完成的，但Effect执行同样的操作。

Answer 3

我以前用过这个解决方案;它运作良好，非常简单：

http://www.chadupton.com/blog/2008/02/rotate-on-center-in-adobe-flex/

Answer 4

要在中心旋转图像，您必须指定此属性

rot.autoCenterTransform="true";
rot.applyChangesPostLayout = false;

围绕中心旋转柔性图形对象

4 个答案: