Comunidad de diseño web y desarrollo en internet online

carrusel

Citar            
MensajeEscrito el 24 Dic 2008 03:49 pm
Hola estoy haciendo un tuto de gotoandlearn y quería hacerle una variante..... Es un tuto sobre un carrusel en 3d, que pinchas sobre cada imagen y te hace un zoom sobre la misma. Yo en vez de esto, quiero que se abra la imagen correspondiente, más grande en otro cargador...

Tengo el siguiente código, que carga dinámicamente una serie de imagenes de un xml, en una serie de loaders mediante un bucle. Lo que quiero es ser capaz de relacionar la imagen que ha cargado cada loader para poder abrir las imágenes del carrusel en otro loader...


Código :

for(var i:int=0; i<list.length(); i++)
         {   
            var lG:Loader = new Loader();
            var imcG:Sprite = new Sprite();
            var imc:imCon = new imCon();//Esto es un mc de la biblioteca
            imc.buttonMode = true;
            
            imc.addEventListener(MouseEvent.CLICK, onClick);
            
            var l:Loader = new Loader();
            l.x = -250;
            l.y = -167;

            l.load(new URLRequest(list[i].@src));
            imc.addChild(l);
            imc.angle = (i*anglePer) - Math.PI/2;//Esto es para colocar los items
            imc.x = Math.cos(imc.angle) * 450;
            imc.z = Math.sin(imc.angle) * 450;
            imc.rotationY = 36 * -i; // 

            container.addChild(imc);
         }
             function onClick(e:MouseEvent):void
            {
               
            }


Espero haberme explicado. He intentado explicarlo en el foro de gotoandlearn y con mi inglés da más la risa que otra cosa.

un saludo.

Por audilon

11 de clabLevel



 

msie7
Citar            
MensajeEscrito el 26 Dic 2008 10:53 am
Funciona igual que con AS.2, le das una variable al MC y la usas en la función. Vamos

Código ActionScript :

for(var i:int=0; i<list.length(); i++)
         {   
            var lG:Loader = new Loader();
            var imcG:Sprite = new Sprite();
            var imc:imCon = new imCon();//Esto es un mc de la biblioteca
            //<--le doy valor a una variable----->
           imc.id=i
           ...el resto igual....
}
....En la función onClick....
function onClick(e:MouseEvent):void
            {
               trace(e.target.id);  //<--usamos la variable,p.e.
                //si tienes un atributo en tu XML que sea img_big
               var fichero:String=list[e.target.id].@img_big;
               trace(fichero)
             }

Por Eliseo2

710 de clabLevel



 

msie7
Citar            
MensajeEscrito el 26 Dic 2008 11:17 am
Gracias por la ayuda.....
Al final conseguí hacerlo funcionar de la siguiente manera:

Código :

package
{
   import com.gskinner.motion.GTween;
   import com.theflashblog.fp10.SimpleZSorter;
   
   import fl.motion.easing.Exponential;
   
   import flash.display.Loader;
   import flash.display.Sprite;
   import flash.events.Event;
   import flash.events.MouseEvent;
   import flash.net.URLLoader;
   import flash.net.URLRequest;

   public class Carousel2 extends Sprite
   {
      private var container:Sprite;
      private var loader:URLLoader;
      private var anglePer:Number;
      
      private var grande:Sprite= new Sprite

      public function Carousel2()
      {
         init();
         loadXML();
      }
      
      private function loadXML():void
      {
         loader = new URLLoader(new URLRequest("images.xml"));
         loader.addEventListener(Event.COMPLETE, createCarousel);
      }
      
      private function createCarousel(e:Event):void
      {
         var xml:XML = new XML(e.target.data);
         var list:XMLList = xml.image;
         anglePer = (Math.PI*2) / list.length();
         
         for(var i:int=0; i<list.length(); i++)
         {   
            var lG:Loader = new Loader();
            var imcG:Sprite = new Sprite();
            var imc:imCon = new imCon();
            imc.buttonMode = true;
            
            imc.addEventListener(MouseEvent.CLICK, onClick);
            
            var l:Loader = new Loader();
            l.x = -250;
            l.y = -167;
            l.load(new URLRequest(list[i].@src));
            imc.addChild(l);
            imc.scaleX = imc.scaleY = 0.5;
            imc.angle = (i*anglePer) - Math.PI/2;//
            imc.x = Math.cos(imc.angle) * 450;
            imc.z = Math.sin(imc.angle) * 450;
            imc.rotationY = 36 * -i; // 
            container.addChild(imc);
            imc.src = list[i].@src;
            
         }
             function onClick(e:MouseEvent):void
            {
               
               lG.load(new URLRequest(e.currentTarget.src));
               addChild(grande)
               grande.addChild(lG)
               container.visible=false
               //removeChildAt(1);
               grande.buttonMode=true
               grande.addEventListener(MouseEvent.CLICK, desonClick);
            }
            
         
         function desonClick(me:MouseEvent):void
         {

         lG.unload()
         removeChild (grande)
         container.visible=true
         
      }
         
}
      private function init():void
      {
         container = new Sprite();
         container.x = 350;
         container.y = 250;
         container.z = 600;
         addChild(container);
         
         this.addEventListener(Event.ENTER_FRAME, loop);
      }
      
         
      private function loop(e:Event):void
      {   
         this.container.rotationY = (mouseX - 350) * 0.5;
         SimpleZSorter.sortClips(container);
      }
   }
}

Por audilon

11 de clabLevel



 

firefox
Citar            
MensajeEscrito el 08 Dic 2009 01:43 am
Hola Chicos

creo que no pasa nada si escribo pregunta en este tema,
no tengo mucha idea en matemática.
Estoy intentando modificar este mismo código para poder rotar imágenes en Y no X

Código ActionScript :

   private function loop(e:Event):void
      {
var mx:Number = mouseX - STAGE_WIDTH / 2;
container.rotationX += my * 0.01;         
//container.rotationY += mx * 0.01;
SimpleZSorter.sortClips(container);

      }


función que calcula es por supuesto esta:

Código ActionScript :

private function createCarousel(e:Event):void
      {
         var xml:XML = new XML(e.target.data);
         var list:XMLList = xml.image;
      
         var num:Number=list.length()
         var anglePer = (Math.PI*2) / num
         var baseDegree:Number = 360 / num;
         
         
         for(var i:int=0; i<list.length(); i++)
         {
            var imc:imCon = new imCon();
            imc.buttonMode = true;
            imc.addEventListener(MouseEvent.CLICK, onClick);
            imc.AS3.text=list[i].@src
            imc.scaleX = imc.scaleY = 0.5;
            imc.angle = (i*anglePer) - Math.PI/2;
            imc.y = Math.cos(imc.angle) * 360;
            imc.z = Math.sin(imc.angle) * 360;
            imc.rotationX = -baseDegree * i;
            container.addChild(imc);
            
         }
      }


por favor ayúdame. gracias

/ perdona por mi castellano.

Por maxcleee

3 de clabLevel



 

firefox
Citar            
MensajeEscrito el 08 Dic 2009 11:37 am
De nuevo, vi que probablemente no me explico correctamente,
refiero a

imc.rotationX = 36 * -i

codigo actual tiene

imc.rotationY = 36 * -i

problema es en linea

imc.angle = (i*anglePer) - Math.PI/2

linea esta no calcula correctamente rotación del objecto

Por maxcleee

3 de clabLevel



 

firefox
Citar            
MensajeEscrito el 08 Dic 2009 01:31 pm
Hola, perdona estaba medio dormido creo.

Lo resuelto ... aquí va código por si alguien se atascaba con esta tontería

cod en base de http://www.gotoandlearn.com/play?id=92

funciona como menú rotativo en eje X del mismo xml

algunos modificaciones le hacen más accesible

Código ActionScript :

package 
{
   import com.gskinner.motion.GTween;
   import com.leebrimelow.utils.Math2;
   import com.theflashblog.fp10.SimpleZSorter;
   
   import fl.motion.easing.Exponential;
   
   import flash.display.Sprite;
   import flash.events.Event;
   import flash.events.MouseEvent;
   import flash.net.URLLoader;
   import flash.net.URLRequest;
   

   public class Carousel extends Sprite
   {
      private var container:Sprite;
      private var loader:URLLoader;
      private var anglePer:Number;
      private const STAGE_WIDTH:Number = stage.stageWidth;
      private const STAGE_HEIGHT:Number = stage.stageHeight   ;


            
      public function Carousel()
      {
         init();
         loadXML();
      }
      
      private function loadXML():void
      {
         loader = new URLLoader(new URLRequest("menu.xml"));
         loader.addEventListener(Event.COMPLETE, createCarousel);
      }
      
      private function createCarousel(e:Event):void
      {
         var xml:XML = new XML(e.target.data);
         var list:XMLList = xml.image;
      
         var num:Number=list.length()
         var anglePer = (Math.PI*2) / num
         var baseDegree:Number = 360 / num;
         
         
         for(var i:int=0; i<list.length(); i++)
         {
            var imc:imCon = new imCon();
            imc.buttonMode = true;
            imc.addEventListener(MouseEvent.CLICK, onClick);
            imc.AS3.text=list[i].@src
            imc.scaleX = imc.scaleY = 0.5;
            imc.angle = (i*anglePer) - Math.PI/2;
            imc.y = Math.cos(imc.angle) * -360;
            imc.z = Math.sin(imc.angle) * 360;
            imc.x=0
            
            


            imc.rotationX = baseDegree* - i;
            container.addChild(imc);
            
         }
      }
      
      private function onClick(e:MouseEvent):void
      {
         var tw:GTween = new GTween(container, 0.8, {rotationY:Math2.toDeg(e.currentTarget.angle+Math.PI/2), z:200},
                                          {ease:Exponential.easeInOut});
      }
      
      private function init():void
      {
         container = new Sprite();
         container.x = 350;
         container.y = 250;
         container.z = 900;
         addChild(container);
         cover.addEventListener(MouseEvent.CLICK, stageClick);
         this.addEventListener(Event.ENTER_FRAME, loop);
      }
      
      private function stageClick(e:MouseEvent):void
      {
         var tw:GTween = new GTween(container, 0.8, {z:400}, {ease:Exponential.easeInOut});
      }
      
      private function loop(e:Event):void
      {
            var mx:Number = mouseX - STAGE_WIDTH / 2;
         var my:Number = mouseY - STAGE_HEIGHT / 2;

         container.rotationX += my * 0.01;
         //container.rotationY += mx * 0.01;

         SimpleZSorter.sortClips(container);
      }
   }
}

Por maxcleee

3 de clabLevel



 

firefox
Citar            
MensajeEscrito el 06 Abr 2010 06:49 pm
Justo lo que andaba buscando!
Gracias.

Por tkb

4 de clabLevel



 

firefox

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.