连接线（同时拖动）中的Flex /的Actionscript

问题描述

我有一个MX：Canvas元素包含多个MX：面板元素。我希望能画一条线连接两个这样的MX：小组以这样的方式，该线继续连接两个MX：面板时一方或双方获得拖各地。看来喜欢的事，应该是微不足道的事，但我一直没能找到答案。

在实际上，这就是问题所在。

由于更新时，专家组到达它的最后位置，只要你开始拖动B面板，如果只剩下一个悬空行仅出现：

有一个可能的解决方案，如建议如下，将覆盖MX的updateDisplayList（）方法：Canvas组件。不幸的是，仅更新描绘的拖动之后，并且不同时在运动。听着xChanged和yChanged事件面板中会产生相同的结果覆盖up​​dateDisplayList（）中。

最终的解决方案，正如下文，要求调度从移动小组的画布上，它移动的移动事件。这会强制行获得重绘在整个议案。

感谢所有帮助！

解决方案

您可以收听<$c$c>MoveEvent.MOVE在小组的活动，并有处理要求的行重新划分，然后让面板调度这些事​​件，而他们正在拖通过侦听的MouseEvent.MOUSE_MOVE 中的事件舞台调度的移动事件处理程序（附上该处理器在小组的MouseEvent.MOUSE_DOWN 活动的舞台处理程序，以及一个处理程序侦听MouseEvent.MOUSE_UP （附加到舞台以及） - 那么这两个事件侦听器的阶段，在 MOUSE_UP 处理程序。）

下面是一个例子（这将是在面板的子类：）

 私有函数attachListeners（）：无效
{
    this.addEventListener（的MouseEvent.MOUSE_DOWN，selfMouseDownHandler，假，0，真正的）;
    this.addEventListener（MoveEvent.MOVE，selfMoveHandler，假，0，真正的）;
}

私有函数selfMoveHandler（事件：MoveEvent）：无效
{
    redrawConnectedLinks（）;
}

私有函数selfMouseDownHandler（事件：MouseEvent）方法：无效
{
    stage.addEventListener（侦听MouseEvent.MOUSE_UP，stageMouseUpHandler，假，0，真正的）;
    stage.addEventListener（的MouseEvent.MOUSE_MOVE，stageMouseMoveHandler，假，0，真正的）;
}

私有函数stageMouseUpHandler（事件：MouseEvent）方法：无效
{
    stage.removeEventListener（侦听MouseEvent.MOUSE_UP，stageMouseUpHandler，假）;
    stage.removeEventListener（的MouseEvent.MOUSE_MOVE，stageMouseMoveHandler，假）;
}

私有函数stageMouseMoveHandler（事件：MouseEvent）方法：无效
{
    则dispatchEvent（新MoveEvent（MoveEvent.MOVE））;
}
 

I have a mx:Canvas element that contains several mx:Panel elements. I want to be able to draw a line connecting two such mx:Panel's in such a way that the line continues to connect the two mx:Panels when one or both get dragged around. It seems like something that should be trivial to do, but I haven't been able to figure it out.

In effect, this is the problem.

Since the updates only occur when the Panel reaches it's final position, as soon as you start dragging the "B" panel, you are left with a dangling line:

A possible solution, as suggested below, would be to override the updateDisplayList() method of the mx:Canvas component. Unfortunately, that only updates the drawing after the dragging, and not while in motion.Listening to the "xChanged" and "yChanged" events in the Panel produces the same results as overriding the updateDisplayList().

The final solution, as pointed out below, requires dispatching the move events from the moving Panel to the Canvas on which it is moving. This forces the lines to get redrawn throughout the whole motion.

Thanks for all the help!

解决方案

You can listen to MoveEvent.MOVE events in the Panels and have the handler call for the redrawing of the lines, and then have the Panels dispatch these events while they are being dragged by listening for MouseEvent.MOUSE_MOVE events in the stage and dispatching the MOVE event in the handler (attach this handler to the stage in the Panel's MouseEvent.MOUSE_DOWN event handler, along with a handler for MouseEvent.MOUSE_UP (attached to the stage as well) -- then remove both of these event listeners from the stage in the MOUSE_UP handler.)

Here's an example (this would be in the Panel subclass:)

private function attachListeners():void
{
    this.addEventListener(MouseEvent.MOUSE_DOWN, selfMouseDownHandler, false,0,true);
    this.addEventListener(MoveEvent.MOVE, selfMoveHandler, false,0,true);
}

private function selfMoveHandler(event:MoveEvent):void
{
    redrawConnectedLinks();
}

private function selfMouseDownHandler(event:MouseEvent):void
{
    stage.addEventListener(MouseEvent.MOUSE_UP, stageMouseUpHandler, false,0,true);
    stage.addEventListener(MouseEvent.MOUSE_MOVE, stageMouseMoveHandler, false,0,true);
}

private function stageMouseUpHandler(event:MouseEvent):void
{
    stage.removeEventListener(MouseEvent.MOUSE_UP, stageMouseUpHandler, false);
    stage.removeEventListener(MouseEvent.MOUSE_MOVE, stageMouseMoveHandler, false);
}

private function stageMouseMoveHandler(event:MouseEvent):void
{
    dispatchEvent(new MoveEvent(MoveEvent.MOVE));
}

这篇关于连接线（同时拖动）中的Flex /的Actionscript的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！