A seguinte técnica não é amplamente usada na web atualmente, mas sempre gera curiosidade pelos programadores Flash. O tutorial a seguir já utiliza da sintaxe do actionscript 3.

1. Criar o efeito Drag and Drop

Primeiro, crie um novo documento actionscript 3 no Flash. Insira um objeto qualquer no Flash (círculo, quadrado, imagem…). Transforme-o em símbolo (movieclip no caso) e dê uma instância particular a ele.

Agora, crie uma nova camada. Adicione o seguinte código ao primeiro frame desta.

objeto.addEventListener(MouseEvent.MOUSE_DOWN, drag); objeto.addEventListener(MouseEvent.MOUSE_UP, drop);

function drag(event:MouseEvent):void {
objeto.startDrag();
}

function drop(event:MouseEvent):void {
objeto.stopDrag();
}

Sendo que “objeto” é o valor dado a instância do seu movieclip. O código diz que, ao clique do mouse no movieclip ele irá arrastá-lo e, ao largar o botão do mouse, soltá-lo.

Resultado:

2. Efeito Drag and Drop com Múltiplos Objetos

Para aplicar o mesmo efeito em vários objetos, basta adicionar uma pequena parte ao código original e tomar cuidado ao inserir as instâncias de cada objeto. Segue abaixo o novo código, construído para adicionar o efeito em três objetos (objeto, objeto2 e objeto3).

objeto.addEventListener(MouseEvent.MOUSE_DOWN, drag);

objeto.addEventListener(MouseEvent.MOUSE_UP, drop);

objeto2.addEventListener(MouseEvent.MOUSE_DOWN, drag);

objeto2.addEventListener(MouseEvent.MOUSE_UP, drop);

objeto3.addEventListener(MouseEvent.MOUSE_DOWN, drag);

objeto3.addEventListener(MouseEvent.MOUSE_UP, drop);

function drag(event:MouseEvent):void {

event.target.startDrag();

}

function drop(event:MouseEvent):void {

event.target.stopDrag();

}

3. Efeito Drag and Drop com Limite

Para limitar a ação do Drag and Drop adicionando uma determinada área em que o objeto pode ser arrastado, é somente necessária a inclusão de uma linha no código e um pequeno ajuste ao mesmo.

objeto.addEventListener(MouseEvent.MOUSE_DOWN, drag); objeto.addEventListener(MouseEvent.MOUSE_UP, drop);

var limite:Rectangle = new Rectangle(50, 50, 320, 100);

function drag(event:MouseEvent):void {

objeto.startDrag(false, limite);

}

function drop(event:MouseEvent):void {

objeto.stopDrag();

}

No caso, adicionamos uma área retangular, a qual chamamos de limite, com 320×100 pixels, posicionada a 50 pixels da margem esquerda e 50 pixels do topo, e definimos que o objeto só poderia ser arrastado dentro desta área.

Resultado: