изменить форму круга, перетаскивая точку на круге - PullRequest
0 голосов
/ 16 марта 2012

Я хочу создать круг и поставить 8 точек на нем. Таким образом, пользователь может перетащить каждую точку, чтобы изменить ее форму.

Есть ли способ сделать это во флэш-памяти?

У меня есть следующий код:

Ref. - Как нарисовать непрерывную изогнутую линию из 3 заданных точек одновременно

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

public class SplineTest extends Sprite
{
    // ====================================================================
    private const A:Point = new Point(0, 0);
    private var B:Point = new Point(100, 200); // yes, var.. this will change
    private const C:Point = new Point(200, 0);

    private const D:Point = C.subtract(A); // midpoint between A and C (I normalize it in the constructor)
    private var DB:Point;

    private var controlPoint:Sprite;
    private var curveCanvas:Sprite;
    private var move:Boolean = false;
    // ====================================================================

    // ====================================================================
    // CONSTRUCTOR
    // ====================================================================

    // --------------------------------------------------------------------
    public function SplineTest()
    {
        // normalize D to be the midpoint
        D.normalize(D.length * 0.5);

        // draw A and C
        graphics.beginFill(0xFF0000);
        graphics.drawCircle(A.x, A.y, 5);
        graphics.drawCircle(C.x, C.y, 5);
        graphics.endFill();
        // move the root for visual convinience
        x = y = 100;

        DB = B.subtract(D);

        // create the canvas for the curve and draw it!     
        curveCanvas = addChild(new Sprite()) as Sprite;
        drawTheCurve();

        // create the controlPoint (B) and draw it!
        controlPoint = curveCanvas.addChild(new Sprite()) as Sprite;
        controlPoint.graphics.beginFill(0xFF0000);
        controlPoint.graphics.drawCircle(0, 0, 5);
        controlPoint.x = B.x;
        controlPoint.y = B.y;

        // add listeners to important events (for moving the control point)
        controlPoint.addEventListener(MouseEvent.MOUSE_DOWN, mouseDown);
        stage.addEventListener(MouseEvent.MOUSE_MOVE, mouseMove);
        controlPoint.addEventListener(MouseEvent.MOUSE_UP, mouseUp);
    }

    // --------------------------------------------------------------------
    private function drawTheCurve():void
    {
        with (curveCanvas.graphics)
        {
            clear();

            // draw the curve
            lineStyle(1, 0);
            moveTo(A.x, A.y);
            curveTo(B.x, B.y, C.x, C.y);

            // draw D and DB
            lineStyle(1, 0x00FF00);
            drawCircle(D.x, D.y, 5);
            moveTo(D.x, D.y);
            lineTo(D.x + DB.x, D.y + DB.y);
        }
    }

    // --------------------------------------------------------------------
    private function mouseDown(event:MouseEvent):void { move = true; }
    // --------------------------------------------------------------------
    private function mouseMove(event:MouseEvent):void
    {
        if (!move) return;

        // obtain the mouse position of B
        B = curveCanvas.globalToLocal(new Point(event.stageX, event.stageY));
        controlPoint.x = B.x;
        controlPoint.y = B.y;

        // if you run the next line the curve passes trough B
        calculatePoints();

        drawTheCurve();
    }
    // --------------------------------------------------------------------
    private function mouseUp(event:MouseEvent):void { move = false; }

    // --------------------------------------------------------------------
    private function calculatePoints():void
    {
        DB = B.subtract(D);
        B = B.add(DB);
    }
}}

Итак, кто-нибудь может преобразовать эти три точки кривой в 8 точек круга?

Заранее спасибо ..

1 Ответ

1 голос
/ 17 марта 2012

Здесь есть сообщение http://www.codereflections.com/blog/archives/tag/bezier-curves-as3-flash с кодом, который вы можете загрузить, который, вероятно, укажет вам правильное направление.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...