Flex: перетаскивание, простой пример - PullRequest
0 голосов
/ 21 декабря 2009

Я хочу реализовать возможности перетаскивания в моем приложении. Вот мой исходный код:

Я добавил изображения в контейнер и теперь хочу иметь возможность перемещать их из элемента PieceContainer на панель элементов (определенную в другом классе). Я попытался определить обработчик перемещения мыши, как показано здесь: http://livedocs.adobe.com/flex/3/html/help.html?content=dragdrop_7.html,, но он ничего не делает ... На самом деле я не понимаю, как определить инициатор drap и обработчик drop

public class PieceContainer extends Canvas
{
    //private var image:Image = new Image();
    private var piecesWhite:Dictionary;
    private var piecesBlack:Dictionary; 
    private var images:ArrayCollection = new ArrayCollection();
    private var placeX:Number;

    public var items:Dictionary;

    public function PieceContainer()
    {
        super();
        this.addEventListener(Event.ADDED_TO_STAGE, displayPiece);
    }

    private function displayPiece(event:Event):void
    {
        placePiecesDict(new Point(0, 0), items);
    }

    private function placePiecesDict(start:Point, dict:Dictionary):void
    {
        placeX = 0;
        for (var item:* in dict)
    {

            var image:Image = new Image();
                image.source = dict[item];
                image.x = placeX/1.4;
                image.y = start.y;
                image.addEventListener(MouseEvent.MOUSE_MOVE, doDrag);
                images.addItem(image);
                this.addChild(image);
            placeX += height; 
            }
        }


        private function doDrag(evt:Event):void
        {
            trace(evt);
        }
    }

Пожалуйста, см. Прикрепленное изображение для более подробного описания: http://img.skitch.com/20091221-e6j8d62y9iin621hmcdbssrp6d.png


Я реорганизовал код следующим образом:

public class PieceContainer extends Canvas
{

    private var piecesWhite:Dictionary;
    private var piecesBlack:Dictionary; 
    private var images:ArrayCollection = new ArrayCollection();
    private var placeX:Number;  
    public var items:Dictionary;

    public function PieceContainer()
    {
        super();
        this.addEventListener(Event.ADDED_TO_STAGE, displayPiece);
    }

    private function displayPiece(event:Event):void
    {
        placePiecesDict(new Point(0, 0), items);
    }

    private function placePiecesDict(start:Point, dict:Dictionary):void
    {
        placeX = 0;
        for (var item:* in dict)
        {

            var image:Image = new Image();
                     image.source = dict[item];
                     image.x = placeX/1.4;
                 image.y = start.y;
                 image.addEventListener(MouseEvent.MOUSE_MOVE, mouseMoveHandler);
            images.addItem(image);
            this.addChild(image);
            placeX += height; 
        }
        }


    private function mouseMoveHandler(evt:MouseEvent):void
    {

        var dragInitiator:Image =  Image(evt.currentTarget);
        var ds:DragSource = new DragSource();
        ds.addData(dragInitiator, "img");
        DragManager.doDrag(dragInitiator, ds, evt);
    }

А также добавлены обработчики перетаскивания на доску:

public class BoardCell extends Canvas
{

    private var _color:Number;

    public function BoardCell()
    {
        super();
        this.addEventListener(DragEvent.DRAG_ENTER, dragEnterHanler);
        this.addEventListener(DragEvent.DRAG_DROP, dragDropHandler);
    }

    public function placeMe(x:int, y:int, width:Number, color:Number):void
    {
        graphics.lineStyle(1, 0x000000);
        graphics.beginFill(color);
        graphics.drawRect(x, y, width, width);
        graphics.endFill(); 
    }


    private function dragEnterHanler(event:DragEvent):void
    {
        if(event.dragSource.hasFormat("img"))
        {
            DragManager.acceptDragDrop(Canvas(event.currentTarget))
        }
    }

    private function dragDropHandler(event:DragEvent):void
    {
        event.dragInitiator.x = 0;
        event.dragInitiator.y = 0;

    }

Но на самом деле есть 2 проблемы:

Во-первых: предметы можно перетаскивать, но когда я добавляю их на доску, они остаются в PiecesContainer. Второе: я хочу, чтобы элементы копировались, а не просто перемещались (но когда они на борту, они должны быть подвижными, а не скопированными)

Спасибо, заранее

1 Ответ

1 голос
/ 22 декабря 2009

Первая проблема легко решается. dragMoveEnabled=true - это то, как вы делаете это в элементе управления списком, но, поскольку вы делаете что-то очень нестандартное, вам нужно оглянуться назад на инициатор перетаскивания и удалить из него элемент препарата. Подробности здесь: http://livedocs.adobe.com/flex/3/html/help.html?content=dragdrop_8.html

Это также поможет вам настроить функции перетаскивания, чтобы вы могли решить и проблему 2.

...