Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Bom dia galera.
Estou desenvolvendo um projeto que faça o efeito "DRAG", como nesse site:clique aqui
Eu estou buscando as imagens de um xml, pois futuramente buscarei swf também. O xml ficou básico, "trabalhos.xml:
<?xml version="1.0"?>
<dataroot>
<subitem name="imagem01.jpg" width="320" height="428"></subitem>
<subitem name="imagem02.jpg" width="320" height="428"></subitem>
<subitem name="imagem03.jpg" width="320" height="428"></subitem>
<subitem name="imagem04.jpg" width="320" height="428"></subitem>
<subitem name="imagem05.jpg" width="320" height="428"></subitem>
<subitem name="imagem06.jpg" width="320" height="428"></subitem>
</dataroot>
E o AS3 que desenvolvi (tudo dinâmico), ficou assim até o momento:
import flash.display.*;
import flash.events.*;
import flash.net.*;
import flash.events.MouseEvent;
import gs.*;
import gs.TweenMax;
var _odstep:Number = 10;
var container:MovieClip;
var lo:Loader;
var mc:MovieClip;
var xmlLoader:URLLoader;
var xmlList:XMLList;
var startX:Number = 0;
var xml:XML;
var startY:Number;
this.xmlLoader = new URLLoader();
this.xmlLoader.addEventListener(Event.COMPLETE, this.xmlLoaded);
this.xmlLoader.load(new URLRequest("trabalhos.xml"));
this.container = new MovieClip();
this.container.x = 0;
this.container.y = stage.stageHeight / 2 -110;
this.container.cacheAsBitmap = true;
addChild(this.container);
function xmlLoaded(param1:Event) : void{
var loc_2:Number;
var loc_3:Number;
this.xml = new XML(this.xmlLoader.data);
this.xmlList = this.xml.children();
var loc_1:int;
while (loc_1 < this.xmlList.length()){
loc_2 = this.xmlList[loc_1].@width;
loc_3 = this.xmlList[loc_1].@height;
this.mc = new MovieClip();
this.lo = new Loader();
this.lo.load(new URLRequest(this.xmlList[loc_1].@name));
addChild(this.mc);
this.mc.addChild(this.lo);
this.container.addChild(this.mc);
this.mc.x = this.startX;
this.startX = this.mc.x + loc_2 + this._odstep;
this.startY = (stage.stageHeight / 2 - loc_3) / 2;
this.mc.y = this.startY;
this.mc.addEventListener(MouseEvent.MOUSE_DOWN, startDragging);
this.mc.addEventListener(MouseEvent.MOUSE_UP, stopDragging);
this.mc.buttonMode = true;
loc_1++;
}
return;
}
var offsetX:Number;
var offsetY:Number;
var posicaoInicial:Number;
var posicaoAtual:Number
function tween(){
if(posicaoAtual > posicaoInicial){
TweenMax.to(container, 1, {x:container.x + 150});
}else if(posicaoAtual < posicaoInicial){
TweenMax.to(container, 1, {x:container.x - 150});
}
}
function startDragging(event:MouseEvent):void{
offsetX = event.stageX - container.x;
posicaoInicial = container.x;
stage.addEventListener(MouseEvent.MOUSE_MOVE, dragContainer);
}
function stopDragging(event:MouseEvent):void{
posicaoAtual=container.x;
stage.removeEventListener(MouseEvent.MOUSE_MOVE, dragContainer);
tween();
}
function dragContainer(event:MouseEvent):void{
container.x = event.stageX - offsetX;
event.updateAfterEvent();
}
Ta quase lá, certo?Aqui eu ja consigo mover para os lados quando precionamos o mouse e ao soltar eu mando dar um TWEEN.
Agora não sei como fazer ele chegar até o fim, e fazer a animação de BATER E VOLTAR. Ah, e aqui quando eu arrasto uma pouco mais rápido, ele meio q desapare e aparece bem rapido, como uma piscada!
Se alguem poder dar um força, fico grato!
PS.: referente a mudar a forma do mouse (o ponteiro), isso eh suce!
Carregando comentários...