flash as3 - получение позиции родительского клипа относительно позиции ребенка

Question

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

/*private function drawLine(childCircle,parentCircle):void
{
    parentCircle.graphics.clear();
    parentCircle.graphics.lineStyle(lineWeight,lineColor);
    parentCircle.graphics.moveTo(0,0);
    parentCircle.graphics.lineTo(childCircle.x,childCircle.y);
}*/

Но проблема в том, что из родительского элемента можно создать несколько дочерних кругов, поэтому вышеописанная функция очищает линию от родительского элемента до первого дочернего элемента в пользу рисования от родительского элемента до второго дочернего элемента. Поэтому я решил, что мне нужно добавить линию в дочерний круг вместо родительского, но когда я это делаю, я не могу получить правильные координаты родительского круга относительно дочернего. Это мой код:

private function drawLine(childCircle,parentCircle):void
{
    //trace (parentCircle.x + "|" + childCircle.x);
    childCircle.graphics.clear();
    childCircle.graphics.lineStyle(lineWeight,lineColor);
    childCircle.graphics.moveTo(0,0);
    childCircle.graphics.lineTo(parentCircle.x,parentCircle.y);
}

Кто-нибудь знает, как я это сделаю? Я видел функции для globalToLocal и localToGlobal, но мне не нужна глобальная позиция - просто позиция на один уровень выше. Я попробовал это:

private function drawLine(childCircle,parentCircle):void
{
    trace (parentCircle.x + "|" + childCircle.x);
    childCircle.graphics.clear();
    childCircle.graphics.lineStyle(lineWeight,lineColor);
    childCircle.graphics.moveTo(0,0);
    childCircle.graphics.lineTo(-childCircle.x,-childCircle.y);
}

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

Answer 1

Вместо рисования от родителя, я бы рассмотрел создание класса Child, который заботится о своем собственном рисовании линий.Я бы также забыл о событии Enter Frame и вместо этого осуществлял рисование линий только во время перемещения Child ... В этом случае оно вызывается событием MouseMove, но это может быть любой другой тип триггера.

private var container:DisplayObject;
private var line:Shape = new Shape();

public function Child()
{
      //add the Line to be drawn as a Shape
      addChild( line );

      //everything starts after the Child has been added to the Stage
      addEventListener( Event.ADDED_TO_STAGE , onAdded );
}

private function onAdded( event:Event):void
{
      // remove this listener
      removeEventListener( Event.ADDED_TO_STAGE , onAdded );

      //identify the container
      container = this.parent;

      //listen to a Mouse Down event
      addEventListener( MouseEvent.MOUSE_DOWN , onMouseDown );

      //the Stage listens to a Mouse Up event
      stage.addEventListener( MouseEvent.MOUSE_UP , onMouseUp );
}

private function onMouseDown( event:MouseEvent):void
{
     //start listening to the Mouse Move when the mouse is down
      addEventListener( MouseEvent.MOUSE_MOVE , onMouseMove );
}

private function onMouseMove( event:MouseEvent):void
{ 
     //draw the line from the parent coordinates to the child coordinates
     line.graphics.clear();
     line..graphics.lineStyle(1);
     line.graphics.moveTo( container.x , container.y );
     line.graphics.lineTo( this.x , this.y );
}

private function onMouseUp( event:MouseEvent):void
{
      removeEventListener( MouseEvent.MOUSE_MOVE , onMouseMove );
}

Answer 2

Это даст вам перетаскиваемый родительский клип, который также содержит перетаскиваемые дочерние клипы, соединенные с родителем линиями.

Класс круга:

package
{
    import flash.display.Sprite;
    import flash.events.MouseEvent;

    public class Circle extends Sprite
    {
        private var _fill:int;

        public function Circle(fill:int=0xFFFFFF)
        {
            super();

            this._fill = fill;

            this.addEventListener(MouseEvent.MOUSE_DOWN, _startDrag);
            this.addEventListener(MouseEvent.MOUSE_UP, _stopDrag);

            draw();
        }

        public function draw():void
        {
            this.graphics.lineStyle(2);
            this.graphics.beginFill(this._fill);
            this.graphics.drawCircle(0, 0, 7);
            this.graphics.endFill();
        }

        private function _startDrag(e:MouseEvent):void
        {
            e.stopPropagation()
            this.startDrag();
        }

        private function _stopDrag(e:MouseEvent):void
        {
            e.stopPropagation()
            this.stopDrag();
        }
    }
}

Основной класс (сценический класс)

package
{
    import flash.display.DisplayObject;
    import flash.display.Sprite;
    import flash.events.Event;

    [SWF(backgroundColor="#EDEDED", frameRate="30", width="500", height="500")]
    public class Main extends Sprite
    {
        private var _parentCircle:Circle;
        private var _children:Array = [];

        public function Main()
        {
            _parentCircle = new Circle(0xFF0000);
            this.addChild(_parentCircle);
            _parentCircle.x = 250;
            _parentCircle.y = 250;

                    // create some children
            for (var i:int=0; i < 5; i++)
            {
                var childCircle:Circle = new Circle();
                childCircle.x = Math.random() * 500 - 250;
                childCircle.y = Math.random() * 500 - 250;
                _parentCircle.addChild(childCircle);
            }

            this.addEventListener(Event.ENTER_FRAME, _redraw);
        }

        private function _redraw(e:Event):void
        {
            _parentCircle.graphics.clear();
            _parentCircle.graphics.lineStyle(1);

            for (var i:int=0; i < _parentCircle.numChildren; i++)
            {
                var child:DisplayObject = _parentCircle.getChildAt(i);
                _parentCircle.graphics.moveTo(0, 0);
                _parentCircle.graphics.lineTo(child.x, child.y);
            }

            _parentCircle.draw();
        }
    }
}

Answer 3

Вы можете сделать что-то вроде этого:

private function drawLines():void
{
    // Clear graphics, prep line style
    parentCircle.graphics.clear();
    parentCircle.graphics.lineStyle(lineWeight,lineColor);

    // Create an array of all children to draw to, then 
    // loop through that array drawing a line to each 
    var ar:Array = [child1, child2, child3];
    var len:uint = ar.length;
    for ( var i:uint=0; i<len; i++ )
    {
        drawLine( ar[i], parentCircle );
    }
}

private function drawLine(childCircle,parentCircle):void
{
    parentCircle.graphics.moveTo(0,0);
    parentCircle.graphics.lineTo(childCircle.x,childCircle.y);
}