拉伸和旋转影片剪辑而不变形

Question

我正在构建一个 Flash 桌面应用程序，用户需要使用一条线路（或任何可以完成这项工作的设备）在舞台上（一台计算机和一台路由器）链接两个 Movieclip，我想达到同样的效果： image1。我搜索并找到了这个solution，我尝试了代码并做了一些修改：

link.addEventListener(MouseEvent.CLICK, linkOnClick);
function linkOnClick(e:MouseEvent){

this.addEventListener(Event.ENTER_FRAME, enterFrame);

var linkPoint:Point = new Point(link.x, link.y);
var mousePoint:Point = new Point();
var distance:Number;
var radians:Number;

function enterFrame(e:Event):void { 

    //Distance
    mousePoint.x = stage.mouseX;
    mousePoint.y = stage.mouseY;
    distance = Point.distance(linkPoint, mousePoint);
    link.width = distance;

    //Rotation
    radians = Math.atan2(stage.mouseY - link.y, stage.mouseX - link.x);
    link.rotation = radians * (180/ Math.PI);

    if(link.hitTestObject(router)){trace("Success");}
}

当我编译代码时，我得到了这个：image2，所以你可能会说，我发现的问题是：

1-线条的边缘跟随鼠标的方向，但有时会超出光标，我希望光标拖动线条的边缘。

2-线条改变它的宽度，如果它是 90°，线条宽度非常显着，我希望线条具有恒定的宽度。

我怎样才能达到与 image1 相同的效果？

Answer 1

// First, lets create mouse-transparent container for drawing.
var DrawingLayer:Shape = new Shape;
addChild(DrawingLayer);

// Hook the event for starting.
stage.addEventListener(MouseEvent.MOUSE_DOWN, onDown);

// Define a storage for keeping the initial coordinates.
var mouseOrigin:Point = new Point;

function onDown(e:MouseEvent):void
{
    // Save the initial coordinates.
    mouseOrigin.x = DrawingLayer.mouseX;
    mouseOrigin.y = DrawingLayer.mouseY;

    // Hook the events for drawing and finishing.
    stage.addEventListener(MouseEvent.MOUSE_UP, onUp);
    stage.addEventListener(MouseEvent.MOUSE_MOVE, onDraw);
}

function onDraw(e:MouseEvent):void
{
    // Remove the previous line.
    DrawingLayer.graphics.clear();

    // Draw a new line.
    DrawingLayer.graphics.lineStyle(5, 0xFF6600);
    DrawingLayer.graphics.moveTo(mouseOrigin.x, mouseOrigin.y);
    DrawingLayer.graphics.lineTo(DrawingLayer.mouseX, DrawingLayer.mouseY);
}

function onUp(e:MouseEvent):void
{
    // Unhook the events for drawing and finishing.
    stage.removeEventListener(MouseEvent.MOUSE_UP, onUp);
    stage.removeEventListener(MouseEvent.MOUSE_MOVE, onDraw);
}

Answer 2

这是因为动作脚本试图通过更改其容器 MovieClip 的比例来拉伸线条粗细。但是您可以通过将 line Scale 选项设置为 None 来防止这种情况。

为此，请选择您的行并打开属性菜单，然后从“缩放”选项的下拉菜单中选择“无”。

但是， 我建议你用代码画一条线：Draw line from object to Mouse (AS3)

编写以下代码：

this.graphic.clear ();
this.graphic.lineStyle(0x000000);
this.moveTo(startPoint.x,startPoint.y);
this.lineTo(endpoint.X,endpoint.y);