Нужно уметь рисовать стрелки мышкой и уметь ее выбирать - PullRequest
Новая
       3

Нужно уметь рисовать стрелки мышкой и уметь ее выбирать

3 голосов
/ 27 октября 2011

Я пытаюсь создать приложение Flash, которое позволит пользователю рисовать стрелки на экране / холсте с помощью мыши.Поэтому, если они нажмут и удержат левую кнопку мыши в точке с координатами 23,12 и отпустят левую кнопку в точке с координатами 84,45, то между двумя точками будет проведена линия со стрелкой на второй координате.нужно, чтобы каждая отдельная стрелка была доступна для выбора, чтобы их можно было перемещать или удалять (я знаю, как сделать эту часть!).

Если кто-то может помочь мне и указать мне правильное направление (например, пример или учебник), был бы очень признателен!

1 Ответ

3 голосов
/ 27 октября 2011

Поскольку это ваш первый вопрос:

enter image description here

package
{
    import flash.display.CapsStyle;
    import flash.display.Graphics;
    import flash.display.JointStyle;
    import flash.display.LineScaleMode;
    import flash.display.Sprite;
    import flash.display.StageAlign;
    import flash.display.StageScaleMode;
    import flash.events.Event;
    import flash.events.MouseEvent;
    import flash.geom.Point;

    [SWF(percentWidth = 100, percentHeight = 100, backgroundColor = 0xefefef, frameRate = 30)]
    public class Arrows extends Sprite
    {

        public var arrows:Vector.<Sprite> = new Vector.<Sprite>();

        public var canvas:Sprite;

        public var lineColor:uint = Math.random() * 0xffffff;

        public var lineWeight:Number = 5;

        private var startPoint:Point;


        public function Arrows()
        {
            super();

            addEventListener(Event.ADDED_TO_STAGE, addedToStageHandler);
        }

        protected function addedToStageHandler(event:Event):void
        {
            stage.scaleMode = StageScaleMode.NO_SCALE;
            stage.align = StageAlign.TOP_LEFT;

            addCanvas();
        }

        protected function addCanvas():void
        {
            canvas = new Sprite();
            addChild(canvas);

            lineColor = Math.random() * 0xffffff;

            // give alpha for interaction
            var g:Graphics = canvas.graphics;
            g.beginFill(0x0, 0.0);
            g.drawRect(0, 0, stage.stageWidth, stage.stageHeight);
            g.endFill();

            // listen for mouse down
            canvas.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler);
        }

        protected function mouseDownHandler(event:MouseEvent):void
        {
            canvas.removeEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler);

            // mark start point
            startPoint = new Point(event.localX, event.localY);

            // start rendering
            canvas.addEventListener(Event.ENTER_FRAME, enterFrameHandler);

            // listen for mouse up / out to end arrow
            canvas.addEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);
            canvas.addEventListener(MouseEvent.MOUSE_OUT, mouseUpHandler);
        }

        protected function enterFrameHandler(event:Event):void
        {
            var angle:Number = polarAngle(new Point(mouseX, mouseY), new Point(startPoint.x, startPoint.y));

            // draw line
            var g:Graphics = canvas.graphics;
            g.clear();

            // give alpha for interaction
            g.beginFill(0x0, 0.0);
            g.drawRect(0, 0, stage.stageWidth, stage.stageHeight);
            g.endFill();

            g.lineStyle(lineWeight, lineColor, 1, true, LineScaleMode.NORMAL, CapsStyle.SQUARE, JointStyle.MITER);
            g.moveTo(startPoint.x, startPoint.y);
            g.lineTo(mouseX, mouseY);

            // draw arrow head
            g.moveTo(mouseX - (20 * Math.cos((angle - 45) * Math.PI / 180)),
                     mouseY - (20 * Math.sin((angle - 45) * Math.PI / 180)));

            g.lineTo(mouseX + (5 * Math.cos((angle) * Math.PI / 180)),
                     mouseY + (5 * Math.sin((angle) * Math.PI / 180)));

            g.lineTo(mouseX - (20 * Math.cos((angle + 45) * Math.PI / 180)),
                     mouseY - (20 * Math.sin((angle + 45) * Math.PI / 180)));
        }

        protected function polarAngle(point:Point, center:Point=null):Number
        {
            if (!center)
                center = new Point(0, 0);

            return Math.atan2(point.y - center.y, point.x - center.x) * 180 / Math.PI;
        }

        protected function mouseUpHandler(event:MouseEvent):void
        {
            canvas.removeEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);
            canvas.removeEventListener(MouseEvent.MOUSE_OUT, mouseUpHandler);

            // stop rendering
            canvas.removeEventListener(Event.ENTER_FRAME, enterFrameHandler);

            // push canvas to arrows collection
            arrows.push(canvas);

            // add a fresh canvas
            addCanvas();
        }

    }
}

Вы говорите, что знаете, как их перемещать, поэтому я оставлю это на ваше усмотрение.

...