Comunidad de diseño web y desarrollo en internet online

problema con el tamaño de un swf dinámico dentro de un mc

Citar            
MensajeEscrito el 12 Feb 2010 06:05 am
hola a la comunidad forera
Tengo un problema bastante urgente.
Estoy desarrollando una aplicación flash y as3. Se trata de unas animaciones (que realizo utilizando tweener) en las que unas "pastillas" giran cuando se pasa el ratón sobre ellas...
El problema es el siguiente... antes tenía una foto como imagen frontal y un cuadro relleno de color como imagen de fondo, ahora mi cliente desea poner una animación swf en lugar de la imagen frontal... Me estoy volviendo loco porque el swf se redimensiona constantemente y no me permite mostrarlo al tamaño que deseo... Que puedo hacer?

diré que utilizo un loader y un contenedor para la imagen. he probado a cambiar el tamaño de l loader y del mc cargador... Se modifica si, pero no consigo dar con ello... Tiene que ver con el punto de registro o es otra cosa?

y lo mas curioso es que cuando ya está en cache la página y vuelves a entrar, funciona perfectamente y lo deja al tamaño que quiero...
que puedo hacer? alguna sugerencia,
muchas gracias
pd: no soy muy experto en as3

Por mig

16 de clabLevel



 

firefox
Citar            
MensajeEscrito el 12 Feb 2010 02:27 pm
No entiendo exactamente el caso, pero si funciona con cache, entonces es que te falta un preloader antes de lanzar el efecto, si lo haces antes de que haya terminado de cargar = problemas

Jorge

Por solisarg

BOFH

13669 de clabLevel

4 tutoriales
5 articulos

Genero:Masculino   Bastard Operators From Hell Premio_Secretos

Argentina

firefox
Citar            
MensajeEscrito el 12 Feb 2010 02:31 pm
Si posteo el código, quizás sea mas sencillo ayudarme...
He quitado los elementos que no eran necesarios para hacer el código mas legible

Código ActionScript :

package components
{
   import caurina.transitions.Tweener;

   import flash.display.Graphics;
   import flash.display.Loader;
   import flash.display.MovieClip;
   import flash.display.Sprite;
   import flash.events.Event;
   import flash.events.HTTPStatusEvent;
   import flash.events.IOErrorEvent;
   import flash.events.MouseEvent;
   import flash.events.ProgressEvent;
   import flash.net.URLLoader;
   import flash.net.URLRequest;
   import flash.net.URLRequestMethod;
   import flash.net.URLVariables;
   import flash.net.navigateToURL;
   import flash.text.AntiAliasType;
   import flash.text.GridFitType;
   import flash.text.TextField;
   import flash.text.TextFormat;
   
   // ------------------------------
   // -= Autor : Ionica Estudio =-
   // ------------------------------
   
   public class Item extends MovieClip
   {
      // -------------------------------------------------------------------------------------------------------
      // -= Private Variable =-
      // -------------------------------------------------------------------------------------------------------
      
      private static const INIT_WIDTH:Number = 388;  //  para jpg
      private static const INIT_HEIGHT:Number = 260; //  para jpg
      private static const WIDTH:Number = 185;
      private static const HEIGHT:Number = 122;
      private static const BG_COLOR:uint = 0x8A2F97;  // NUEVO COLOR MORADO
      private var frontImageLoader:Loader;
      private var backImageLoader:Loader;
      private var frontTextBorder:Sprite;
      private var backTextBorder:Sprite;
      private var button:Sprite;
      private var rotator:Rotator;
      private var frontImageURL:String;
      private var backImageURL:String;
      private var itemType:String;
      private var redirectURL:String;
      private var redirectWindowTarget:String;
      private var redirectMethod:String;
      private var image_id:int;
      private var i:int;
      private var phpVariables:URLVariables;
      private var phpURLRequest:URLRequest;
      private var urlLoader:URLLoader;
      private var isMouseOverInit:Boolean;
      private var _this:MovieClip;
      
      // -------------------------------------------------------------------------------------------------------
      // -= Public Function =-
      // -------------------------------------------------------------------------------------------------------
      
      public function Item(_this:MovieClip, i:int, id:int, frontImageURL:String, backImageURL:String, itemType:String,
                      frontTextString:String, backTextString_1:String, backTextString_2:String,
                      backTextString_3:String, p_redirectURL:String, p_redirectWindowTarget:String, p_redirectMethod:String)
      {
         super();
         this.redirectMethod = p_redirectMethod;
         this.redirectURL = p_redirectURL;
         this.redirectWindowTarget = p_redirectWindowTarget;
         this._this = _this;
         this.i = i;
         this.image_id = id;
         this.frontImageURL = frontImageURL;
         this.backImageURL = backImageURL;
         this.itemType = itemType;
         this.phpVariables = new URLVariables();
         this.phpURLRequest = new URLRequest();
         this.urlLoader = new URLLoader();
         this.button = new Sprite();
         this.button.mouseChildren = false;
         this.button.buttonMode = true;
         this.backImageLoader = new Loader();
         this.backImageLoader.mouseEnabled = false;
         this.frontImageLoader = new Loader();
         this.backImageLoader.mouseEnabled = false;
         this._this.front.alpha = 0;
         this._this.front.mouseEnabled = false;
         this._this.front.mouseChildren = true;
         this._this.back.alpha = 0;
         this._this.back.mouseChildren = true;
         this._this.back.mouseEnabled = false;
         this.rotator = new Rotator();
         this._this.back.image.addChild(this.backImageLoader);
         this._this.front.image.addChild(this.frontImageLoader);
         this._this.addChild(this.rotator);
         this.rotator.x = -this.rotator.width * 0.25;
         this.rotator.y = -this.rotator.height * 0.25;
         this._this.button.addChild(this.button);
         this.frontTextBorder = new Sprite();
         this.frontTextBorder.alpha = 0;
         this._this.front.image.addChild(this.frontTextBorder);
         var frontTextBorderGraphics:Graphics = this.frontTextBorder.graphics;
         frontTextBorderGraphics.clear();
         frontTextBorderGraphics.beginFill(0, 0);  //// sombreado para leeer texto en front, lo pongo a 0 para la animación swf
         this.backTextBorder = new Sprite();
         this.backTextBorder.alpha = 0;
         this._this.back.image.addChild(this.backTextBorder);
         var backTextBorderGraphics:Graphics = this.backTextBorder.graphics;
         backTextBorderGraphics.clear();
         backTextBorderGraphics.beginFill(0, 0.3);   //// sombreado para leeer texto en back
         var frontImageGraphics:Graphics = this._this.front.bg.graphics;
         var backImageGraphics:Graphics = this._this.back.bg.graphics;
         frontImageGraphics.clear();
         backImageGraphics.clear();
         if (frontImageURL.length == 0) frontImageGraphics.beginFill(BG_COLOR);
         else frontImageGraphics.beginFill(BG_COLOR, 0);
         if (backImageURL.length == 0) backImageGraphics.beginFill(BG_COLOR);
         else backImageGraphics.beginFill(BG_COLOR, 0);
         var buttonGraphics:Graphics = this.button.graphics;
         buttonGraphics.clear();
         buttonGraphics.beginFill(BG_COLOR, 0);
         
         if (this.i == 0) {
            this._this.front.txt.htmlText = frontTextString;
//            this._this.back.txt2.htmlText = frontTextString;
            this._this.back.txt2.htmlText = backTextString_2;
            this._this.back.txt1.htmlText = backTextString_1;
            this._this.back.txt3.htmlText = backTextString_3;

                      
            frontTextBorderGraphics.drawRect(-INIT_WIDTH * 0.5, INIT_HEIGHT * 0.5 - 80, INIT_WIDTH, 80);
            backTextBorderGraphics.drawRect(-INIT_WIDTH * 0.5, -INIT_HEIGHT * 0.5, INIT_WIDTH, 40);
            buttonGraphics.drawRect(-INIT_WIDTH * 0.5, -INIT_HEIGHT * 0.5, INIT_WIDTH, INIT_HEIGHT);
            frontImageGraphics.drawRect(-INIT_WIDTH * 0.5, -INIT_HEIGHT * 0.5, INIT_WIDTH, INIT_HEIGHT);
            backImageGraphics.drawRect(-INIT_WIDTH * 0.5, -INIT_HEIGHT * 0.5, INIT_WIDTH, INIT_HEIGHT);

////////// control de posicion ////////
            this.frontImageLoader.x = -INIT_WIDTH * 0.5;
            this.frontImageLoader.y = -INIT_HEIGHT * 0.5;
            this.backImageLoader.x = -INIT_WIDTH * 0.5;
            this.backImageLoader.y = -INIT_HEIGHT * 0.5;


         }         else         {
            frontTextBorderGraphics.beginFill(0, 0.8);  //// sombreado para leeer texto en front
            this._this.front.txt.htmlText = frontTextString;
//            this._this.back.txt2.htmlText = backTextString_2; // de momento, no son necesarias
            this._this.back.txt1.htmlText = backTextString_1;
            this._this.back.txt3.htmlText = backTextString_3;
            
            frontTextBorderGraphics.drawRect(-WIDTH * 0.5, HEIGHT * 0.5 - 37, WIDTH, 37);
            backTextBorderGraphics.drawRect(-WIDTH * 0.5, HEIGHT * 0.5 - 37, WIDTH, 37);
            buttonGraphics.drawRect(-WIDTH * 0.5, -HEIGHT * 0.5, WIDTH, HEIGHT);
            frontImageGraphics.drawRect(-WIDTH * 0.5, -HEIGHT * 0.5, WIDTH, HEIGHT);
            backImageGraphics.drawRect(-WIDTH * 0.5, -HEIGHT * 0.5, WIDTH, HEIGHT);
            
            this.frontImageLoader.x = -WIDTH * 0.5;
            this.frontImageLoader.y = -HEIGHT * 0.5;
            this.backImageLoader.x = -WIDTH * 0.5;
            this.backImageLoader.y = -HEIGHT * 0.5;
         }
         frontTextBorderGraphics.endFill();
         backTextBorderGraphics.endFill();
         buttonGraphics.endFill();
         frontImageGraphics.endFill();
         backImageGraphics.endFill();
         if (this.backImageURL.length > 0) this.loadBackImage();
         else this.loadFrontImage();
         
         
         
      
      }
      
      // -------------------------------------------------------------------------------------------------------
      // -= Private Function =-
      // -------------------------------------------------------------------------------------------------------
      
      private function loadBackImage():void
      {
         this.backImageLoader.alpha = 0;
         this.backImageLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, this.backImageLoadCompleteHandler);
         this.backImageLoader.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS, this.backImageLoadProgressHandler);
         this.backImageLoader.contentLoaderInfo.addEventListener(IOErrorEvent.IO_ERROR, this.imageLoadErrorHandler);
         this.backImageLoader.load(new URLRequest(this.backImageURL));
      }
      
      private function loadFrontImage():void
      {
         this.frontImageLoader.alpha = 0;
         this.frontImageLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, this.frontImageLoadCompleteHandler);
         this.frontImageLoader.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS, this.frontImageLoadProgressHandler);
         this.frontImageLoader.contentLoaderInfo.addEventListener(IOErrorEvent.IO_ERROR, this.imageLoadErrorHandler);
         this.frontImageLoader.load(new URLRequest(this.frontImageURL));
      }
      

      private function alComenzar():void   {
         trace("Tweener a Comenzado");
      }      

      
      private function alTerminar():void      {

         trace("Tweener a Terminado");
      }
      
      private function alTerminar1():void      {
         trace("Tweener a Terminado");
      }
      
      private function show1():void  // efectos para la imagen destacada
      {  /// efecto para ver la imagen de entrada 
         this._this.removeChild(this.rotator);
         this._this.front.x = 0;
         this._this.front.y =- 150;
         Tweener.addTween(this._this.front, {x: 0, y: 0, time: 0.9, transition: "easeOutExpo", onStart: alComenzar, onComplete: alTerminar});
         Tweener.addTween(this._this.front, {alpha:1, time:2});
         Tweener.addTween(this.frontImageLoader, {alpha:1, time:2});
         Tweener.addTween(this.frontTextBorder, {alpha:1, time:2});
         Tweener.addTween(this._this.front.txt, {alpha:1, time:2, onComplete:frontShowComplete});
      }
      
      private function show():void // efectos para el resto de imagenes
      {  /// efecto para ver la imagen de entrada 
         this._this.removeChild(this.rotator);
         this._this.front.x = 0;
         this._this.front.y =- 150;
         this._this.front.width = WIDTH * 0;
         this._this.front.height = HEIGHT * 0;
         Tweener.addTween(this._this.front, {x: 0, y: 0, time: 1.2, transition: "easeInOutExpo", onStart: alComenzar, onComplete: alTerminar1});
         Tweener.addTween(this._this.front, {width: WIDTH * 1.01, height: HEIGHT * 1.055, time: 1.3, transition: "easeInOutExpo", onStart: alComenzar, onComplete: alTerminar1});   
         Tweener.addTween(this._this.front, {alpha:1, time:1});
         Tweener.addTween(this.frontImageLoader, {alpha:1, time:1});
         Tweener.addTween(this.frontTextBorder, {alpha:1, time:1});
         Tweener.addTween(this._this.front.txt, {alpha:1, time:1, onComplete:frontShowComplete});
      }
      
      private function frontShowComplete():void
      {
         Tweener.addTween(this._this.back, {alpha:1, time:0});
         Tweener.addTween(this.backImageLoader, {alpha:1, time:0});
         Tweener.addTween(this.backTextBorder, {alpha:1, time:0});
         Tweener.addTween(this._this.back.txt1, {alpha:1, time:1});
         Tweener.addTween(this._this.back.txt2, {alpha:1, time:1, onComplete:backShowComplete});
         Tweener.addTween(this._this.back.txt3, {alpha:1, time:1});
      }
      
      private function backShowComplete():void
      {
         this.addListeners();
      }
      
      private function addListeners():void
      {
         this.button.addEventListener(Event.ENTER_FRAME, this.checkDepth);
         this.button.addEventListener(MouseEvent.MOUSE_OVER, this.mouseOverHandler);
         this.button.addEventListener(MouseEvent.MOUSE_OUT, this.mouseOutHandler);
         this.button.addEventListener(MouseEvent.CLICK, this.clickHandler);
      }
      
      // -------------------------------------------------------------------------------------------------------
      // -= Event Listener =-
      // -------------------------------------------------------------------------------------------------------
      
      private function checkDepth(event:Event):void
      {
         if(this._this.front.rotationY > 90)
         {
            this._this.setChildIndex(this._this.front, 0);
            this.frontImageLoader.alpha = 0;
            this._this.front.bg.alpha = 0;
            this._this.back.bg.alpha = 1;
            this._this.front.image.alpha = 0;
            this._this.back.image.alpha = 1;
         }
         else
         {
            this._this.setChildIndex(this._this.back, 0);
            this.frontImageLoader.alpha = 1;
            this._this.front.bg.alpha = 1;
            this._this.back.bg.alpha = 0;
            this._this.front.image.alpha = 1;
            this._this.back.image.alpha = 0;
         }
      }
      
      
      private function sendCompleteHandler(event:Event):void
      {
         trace(" Success : " + event);
      }
      
      private function ioErrorHandler(event:IOErrorEvent):void
      {
         trace(" IO Error : " + event);
      }
      
      private function httpStatusHandler(event:HTTPStatusEvent):void
      {
         trace(" HTTP Status : " + event);
      }
      
      private function frontImageLoadCompleteHandler(event:Event):void
      {
         /// suaviza la imagen para que no se rompan los textos
         var img = event.target.content;
         img.smoothing = true;                                 
               //////////////////////                  
         this.frontImageLoader.contentLoaderInfo.removeEventListener(Event.COMPLETE, this.frontImageLoadCompleteHandler);
         this.frontImageLoader.contentLoaderInfo.removeEventListener(ProgressEvent.PROGRESS, this.frontImageLoadProgressHandler);
         this.frontImageLoader.contentLoaderInfo.removeEventListener(IOErrorEvent.IO_ERROR, this.imageLoadErrorHandler);
         if (this.i == 0)
         {
            this.frontImageLoader.content.width = INIT_WIDTH;  
            this.frontImageLoader.content.height = INIT_HEIGHT; 
            
            this.show1();
         }
         else
         {
            this.frontImageLoader.content.width = WIDTH;
            this.frontImageLoader.content.height = HEIGHT;

            this.show();
         }
         this.show1();
      }
      
      private function backImageLoadCompleteHandler(event:Event):void
      {
         this.backImageLoader.contentLoaderInfo.removeEventListener(Event.COMPLETE, this.backImageLoadCompleteHandler);
         this.backImageLoader.contentLoaderInfo.removeEventListener(ProgressEvent.PROGRESS, this.backImageLoadProgressHandler);
         this.backImageLoader.contentLoaderInfo.removeEventListener(IOErrorEvent.IO_ERROR, this.imageLoadErrorHandler);
         if (this.i == 0)
         {
            this.backImageLoader.content.width = INIT_WIDTH;
            this.backImageLoader.content.height = INIT_HEIGHT ;
         }
         else
         {
            this.backImageLoader.content.width = WIDTH;
            this.backImageLoader.content.height = HEIGHT;
         }
         this.loadFrontImage();
      }
      
      private function frontImageLoadProgressHandler(event:ProgressEvent):void
      {
         //trace("Front Image Load progress : " + event.bytesTotal + " - " + event.bytesLoaded);
      }
      
      private function backImageLoadProgressHandler(event:ProgressEvent):void
      {
         //trace("Back Image Load progress : " + event.bytesTotal + " - " + event.bytesLoaded);
      }
      
      private function imageLoadErrorHandler(event:IOErrorEvent):void
      {
         trace("ERROR while Load Image : " + event);
      }
   }
}

Por mig

16 de clabLevel



 

firefox
Citar            
MensajeEscrito el 12 Feb 2010 02:50 pm
gracias por responder Jorge,
Yo creo que lanzo el efecto despues de que termine el Loader... (funcion frontImageLoadCompleteHandler) en ese momento es cuando lanzo la función show1(); (que es la que controla el mc que contiene el swf). (en el código que he puesto lanzo dos veces la función show1();, sé que no es necesario, simplemente lo dejé "olvidado" despues de probar y probar)
De hecho tengo dos propiedades que me indican el tamaño del movieclip:
INIT_WIDTH = 388;
INIT_HEIGHT = 260;

estoy equivocado?

Por mig

16 de clabLevel



 

firefox
Citar            
MensajeEscrito el 12 Feb 2010 08:38 pm
En show1 no veo que modifiques alto o ancho, solo alpha y posición x. Verifica que la animación no tenga ninguna acción ... Y si se reescala chequea que no haya onEnterFrames o algún timer suelto ... no he podido revisar las 360 líneas de code que posteaste ;)

Jorge

Por solisarg

BOFH

13669 de clabLevel

4 tutoriales
5 articulos

Genero:Masculino   Bastard Operators From Hell Premio_Secretos

Argentina

firefox
Citar            
MensajeEscrito el 15 Feb 2010 09:13 am
Muchas Gracias Jorge,
si, era demasiado código para revisar, tienes razón...
Ya lo he solucionado, era cuestión de dar con la tecla, a veces las cosas mas sencillas se vuelven difíciles de verdad...
Lo que hice fue usar img.scaleX e img.scaleY para ajustar el tamaño del mcContainer al Loader... y funcionó...

muchas gracias de nuevo,
mig

Por mig

16 de clabLevel



 

msie7

 

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