鬼形触发greensock的TransformManger移动光标

时间:2014-12-14 21:54:58

标签: actionscript-3 flex flex4 greensock transformmanager

这可能是一个很长的镜头,但我已经花了一天多的时间,所以我想我会问。

我在Flex 4.6 / AS项目中使用greensock's TransformManger v:1.9669。问题是,如果选择了一个项目,TM“移动”光标将出现在选择范围之外,并且看起来像是一个重影形状或与选择大小相同的东西但是偏离触发它的中心。下面有一个截图来说明我的意思。

我在Photoshop中添加了红色矩形以指示触发TM移动光标的重影区域。此区域处于活动状态,可以通过在红色矩形内单击并拖动来移动选择。

我已经构建了一个精简的Flex项目来显示这个问题:exported .fxp(当然没有TransformManager lib,因为它不是免费的)。我从周二开始尝试各种方式,以确定这是不是我的错误而且没有看到它。这是一个Flex bug,TM bug吗?如果有人有使用TransformManager lib的经验并且可以告诉我这是什么问题,那么就会有一些啤酒业力(或赏金点)......

enter image description here

所选项目是加载swf的Flex Spark组。它是相当裸露的骨头,所以我对这个幽灵形状的来源感到困惑。我已经删除了下面的加载程序和其他AS代码

<?xml version="1.0" encoding="utf-8"?>
<s:Group xmlns:fx="http://ns.adobe.com/mxml/2009"
         xmlns:s="library://ns.adobe.com/flex/spark"
         xmlns:mx="library://ns.adobe.com/flex/mx"
         width="5" height="5"
         resize="resizeHandler(event)">

    <s:SWFLoader id="eventBtn"
                 width="{this.width - 5}" height="{this.height - 5}"
                 x="{regX}" y="{regY}"
                 verticalAlign="middle"  horizontalAlign="center"
                 complete="btn_completeHandler(event)" />

    <s:Rect id="bitmapBorder"
            x="{regX}" y="{regY}"
            width="100%" height="100%"
            visible="true">
        <s:stroke>
            <s:SolidColorStroke color="#ffffff" weight="2" />
        </s:stroke>
    </s:Rect>
</s:Group>

在SWFLoader完成加载外部.swf后调用

updateRegPoint。它旨在将SWFoader和Spark Rect的注册点定位到包含Spark Group的中心。

    protected function updateRegPoint():void
    {   
        regX = this.width * -.5;
        regY = this.height * -.5;
    }

1 个答案:

答案 0 :(得分:1)

好的 - 使用本网站上的代码:flash-flex-rotate-around-a-point-by-matrix我能够解决这个问题。

首先,不要更改构成我的组件的元素的注册点(原始mxml代码中的regX&amp; regY),而不是进行任何更改。

<s:SWFLoader id="eventBtn" 
             width="{this.width}" height="{this.height}" 
             verticalAlign="middle"  horizontalAlign="center" 
             complete="btn_completeHandler(event)" />

<s:Rect id="bitmapBorder" 
        x="0" y="0" 
        width="100%" height="100%" 
        visible="true">
    <s:stroke>
        <s:SolidColorStroke color="#ffffff" weight="2" />
    </s:stroke>
</s:Rect>

这适用于greenSock的TransformManager,并且没有&#34; ghost&#34;形状。那么问题是通过代码设置的旋转(例如obj.rotation = 45发生在点(0,0) - 顶部/左侧。

然后我调整了链接网站的代码,使其成为我要转换的组件的内部代码,以添加一个rotate函数,该函数可以旋转对象的变换矩阵。因此,调用obj.rotate(45)会将对象从中心旋转。 (我需要通过代码设置变换,因为用户通过TransformManager进行的变换在会话之间保存。)

(当然没有人会关心这个,因为Flex大部分已经死了,但是我把它放在这里是因为我已经花了几天时间在这上面,也许其他一些悲伤的编码器会遇到这种情况未来的事情; - )

        public function rotate(angle:Number):void
        {
            var m:Matrix = this.transform.matrix;
            var aroundPoint:Point = resetCenterPoint(this, this.width/2, this.height/2);
            var cm:Matrix = new Matrix(1, 0, 0, 1, -aroundPoint.x, -aroundPoint.y);
            m.concat(cm);

            m.rotate(Math.PI * angle / 180);

            var rcm:Matrix = new Matrix(1, 0, 0, 1, aroundPoint.x, aroundPoint.y);
            m.concat(rcm);
            this.transform.matrix = m;
        }

        private function resetCenterPoint(obj:DisplayObject, orgX:Number, orgY:Number):Point
        {
            var m:Matrix = obj.transform.matrix;

            var orgXY:Point = m.deltaTransformPoint(new Point(orgX, orgY));
            orgXY.x += m.tx;
            orgXY.y += m.ty;
            return orgXY;
        }