Как нарисовать линию между двумя компонентами в flex

Question

У меня есть два компонента, один из которых является дочерним по отношению к другому, и мне нужно нарисовать линию между ними с помощью mouseDown и MouseUp . Проблема в том, что я не знаю, как найти реальный х, у из shape1 и shape2

(компонент является рекурсивным компонент, который я написал)

есть часть моего кода, но не работают правильно

его мой компонент:

<mx:Box id="component" borderStyle="solid" width="100%" height="500"> 
    <local:compforSM id="compForSS" label="پرسپکتیو" rotateLabel="true" statusColor="{0x008000}" layoutType="{compforSM.HORIZENTAL}" width="80%" height="80%" creationComplete="createComplete()" /> 

мой MouseDownHandler:

private function mouseDown(e:MouseDownOrUpEvent):void { 
if (e.target != null) { 
if(firstObject == null){ 
firstObject = e.target; 
     firstPoint = component.localToGlobal(new Point(component.x, component.y)); 
     firstPoint.x = mouseX - firstPoint.x; 
     firstPoint.y = mouseY - firstPoint.y; 
     } 

     } 

}

Answer 1

Я не сделал это в то время, но я думаю, что вы первый хотели бы преобразовать в глобальную точку, используя компоненты верхнего левого координат.

Затем, если не рисовать на сцене, а на другом компоненте, вы хотите преобразовать глобальную точку обратно в локальную точку относительно этого компонента.

Что-то вроде этого:

var globalPoint:Point = component.localToGlobal(new Point(0, 0)); 

var newLocalPoint:Point = componentWhereYouWantToDrawIfNotStage.globalToLocal(globalPoint); 

EDIT:

Я не знаю, что это именно то, что вы пытаетесь достичь. Я предполагаю, что вы хотите нарисовать где-то указатель мыши, но не уверены. Также я не знаю, что вы подразумеваете под рекурсивным компонентом.

Вот несколько примеров, чтобы нарисовать линию от центра внутренней к центру внешнего компонента. Я использую холст поверх всех компонентов, чтобы убедиться, что линия видна, независимо от того, какие компоненты могут быть.

<?xml version="1.0" encoding="utf-8"?> 
<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" minWidth="955" minHeight="600" 
       creationComplete="onCreationComplete();"> 

    <fx:Script> 
     <![CDATA[ 

     private function onCreationComplete():void 
     { 
      var globalInnerPoint:Point = innerComponent.localToGlobal(new Point(innerComponent.width/2, innerComponent.height/2)); 
      var globalOuterPoint:Point = outerCcomponent.localToGlobal(new Point(outerCcomponent.width/2, outerCcomponent.height/2)); 

      var canvasLayerInnerPoint:Point = canvasLayer.globalToLocal(globalInnerPoint); 
      var canvasLayerOuterPoint:Point = canvasLayer.globalToLocal(globalOuterPoint); 

      canvasLayer.graphics.lineStyle(4, 0xFF0000); 
      canvasLayer.graphics.moveTo(canvasLayerInnerPoint.x, canvasLayerInnerPoint.y); 
      canvasLayer.graphics.lineTo(canvasLayerOuterPoint.x, canvasLayerOuterPoint.y); 
     } 
     ]]> 
    </fx:Script> 


    <mx:Box id="outerCcomponent" borderStyle="solid" width="100%" height="500"> 
     <mx:Box id="innerComponent" width="80%" height="80%" borderStyle="solid"/> 
    </mx:Box> 

    <mx:Canvas id="canvasLayer" height="100%" width="100%" /> 

</s:Application>