고스트 모양의 greensock의 TransformManger 트리거 커서 이동

Question

이것은 장시간이 걸릴 수도 있지만이 질문에 답하기 위해 하루 이상을 보냈습니다.

Flex 4.6/AS 프로젝트에서 greensock's TransformManger v : 1.9669를 사용하고 있습니다. 문제는 선택한 항목을 사용하면 선택 영역 바깥에 TM "이동"커서가 나타나고 선택과 크기가 같지만 트리거하는 가운데에서 오프셋 된 것처럼 보입니다. 아래의 스크린 샷을 보면 무슨 뜻인지 알 수 있습니다.

Photoshop에서 TM 이동 커서를 트리거하는 고스트 영역을 나타내는 빨간색 직사각형을 추가했습니다. 이 영역은 활성화되어 있으며 빨간색 사각형 내를 클릭하고 드래그하여 선택 영역을 이동할 수 있습니다.

저는이 문제를 보여주는 플립 프로젝트를 작성했습니다 : exported .fxp (물론 무료는 아니기 때문에 TransformManager 라이브러리가 없어도됩니다). 화요일부터 모든 방법을 시도해보고 내 버그인지 확인하지 못했습니다. 이것은 플렉스 버그인가, TM 버그인가? 사람이 TransformManager lib 디렉토리와 경험을 가지고 있으며, 문제가 무엇인지 말해 줄 수 있다면, 약간의 맥주 카르마 (또는 현상금 점) ...

선택한 항목이 플렉스 스파크 그룹이되는 swf를로드합니다. 그것은 꽤 맨손의 뼈다. 그래서 나는이 유령 모양이 어디에서오고 있는지에 대해 당혹 스럽다. 나는 SWFLoader의 외부 .SWF로드 완료 후라고

<?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> 

---

updateRegPoint 아래 코드와 로더 등을 제거했습니다. SWFoader 및 Spark Rect의 등록 포인트를 포함하는 Spark Group의 가운데에 위치시키기위한 것입니다.

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

Answer 1

오케이 -이 사이트의 코드 사용 : flash-flex-rotate-around-a-point-by-matrix이 문제를 해결할 수있었습니다.

먼저 구성 요소를 구성하는 요소의 reg 지점 (원래 mxml 코드에서 regX & 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와 함께 작동하며 "유령"모양이 없습니다. 그러면 문제는 코드를 통해 회전이 설정됩니다 (예 : obj.rotation = 45 (0,0) - 위/왼쪽)

나는 변환 할 구성 요소의 내부에 코드를 적용했습니다. 객체의 변환 매트릭스를 회전시키는 rotate 기능. 그래서 중심에서 물체를 회전한다 obj.rotate(45) 호출을 추가한다. (I는 TransformManager 통해 사용자가 만드는 변형은 세션 사이에 저장되기 때문에 코드를 변환을 설정할 필요).

을 (물론 Flex는 대부분 죽었으므로 아무도 신경 쓰지 않겠지 만, 며칠 동안 고통스럽고 어쩌면 다른 슬픈 코더가 이런 종류의 일에 직면 할 것이기 때문에 여기에 넣었습니다. e future ;-)

 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; 
     }