Comunidad de diseño web y desarrollo en internet online

Ayuda con CLASES AS3 y Tooltips

Citar            
MensajeEscrito el 07 Jun 2008 11:37 pm
Que tal gente, tengo un pequeño problema terminando una pagina y quiero ver si me pueden dar una mano, ya hace 48hs q estoy tratando de buscar una solucion pero no lo logro.
Les cuento, tengo una pagina hecha completamente en Flash con AS3 , con 5 secciones en la misma, en una de estas secciones cargo una galeria XML con thumbnails y tooltips en cada foto.
EL PROBLEMA es el siguiente, al cambiar de seccion en la pagina y volver a la galeria simplemente no aparecen los tooltips, como si no existieran... :shock:
Ese es el maldito problema que me tiene retrasado 72hs, y no logro ver donde esta el error :oops: . Se que es dificil la ayuda sin ver el codigo, por eso aca va todo el codigo para ver si alguien mas experimentado en AS3 puede darme una mano. Sera muy bien agradecido.

- cargadorDeFotos es una MC donde cargo las fotos
- all_thumbs es una MC donde cargo los thumbnails
- galleryPane es un scrollPane que carga la MC all_thumbs
CODIGO EN Seccion Galeria capa 1 fotograma 1:

Código :

import fl.transitions.Tween;
import fl.transitions.easing.*;

include "galerias/actionscript/initial_variables.as"; 
include "galerias/actionscript/xml_load.as"; 
include "galerias/actionscript/load_thumbnails.as"; 
include "galerias/actionscript/tooltip.as";
include "galerias/actionscript/hor_vert_settings.as";
include "galerias/actionscript/fade_in_or_out_thumbs.as";
include "galerias/actionscript/botones_categorias.as";
include "galerias/actionscript/dragging_code.as";




CODIGO EN Initial_variables.as :

Código :

var all_thumbs:MovieClip = new MovieClip();
addChild(all_thumbs);

galleryPane.source = all_thumbs;
var fadeIn:Tween;
var urlVar:String = "galeria_sonido.xml";
var picturePathList:Array = [];
var thumbPathList:Array = [];
var pictureTitleList:Array = [];
var pictureDescList:Array = [];
var tooltips:Array = [];
var fotosTotales:Number;
var c:Number = 0;
var xSpacing:Number = 100;
var ySpacing:Number = 87;
var xs:Number = 0;
var ys:Number = 0;
var thumbRowCount:Number = 4;
var thumb_orientation:String;

verticalColumn(); //especifico thumbnails en vertical en archivo hor_ver_settings

loadTheXML();
tooltipClick();




CODIGO EN xml_load.as:

Código :

function loadTheXML() {
   
   var xmlURLLoader:URLLoader = new URLLoader();
   var xmlURLRequest:URLRequest = new URLRequest(urlVar);
   xmlURLLoader.load(xmlURLRequest);
   
   xmlURLLoader.addEventListener(Event.COMPLETE, ordenarXML);
   
   function ordenarXML(event:Event):void{
      var XMLData:XML = new XML (xmlURLLoader.data);
      var a:Number = XMLData.picture_path.length();
      
      fotosTotales = a;
      var b:Number = 0;
      
      while (b < a) {
         picturePathList.push(XMLData.picture_path[ b ]);
         thumbPathList.push(XMLData.thumb_path[ b ]);
         pictureTitleList.push(XMLData.picture_title[ b ]);
         pictureDescList.push(XMLData.picture_desc[ b ]);
         b = b + 1;
      } //fin while
      //var randomNum:Number = Math.round( Math.random() * (fotosTotales - 1) );
      var mainLoader:Loader = new Loader();
      //si quiero una foto al azar cambio el 0 por la variable "randonNum"
      var mainRequest:URLRequest = new URLRequest( picturePathList[ 0 ] ); 
      mainLoader.load(mainRequest);
      mainLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, fotosCargadas);
      
      function fotosCargadas(event:Event):void{
         fadeIn = new Tween(cargadorDeFotos, "alpha", None.easeNone, 0, 1, 10, false);         
         cargadorDeFotos.addChild(mainLoader.content);
         
         picTitle.text = pictureTitleList[ 0 ];
         picDesc.text = pictureDescList[ 0 ];
         picTitle.x = cargadorDeFotos.x;
         picDesc.x = cargadorDeFotos.x;
         picTitle.y = cargadorDeFotos.y + cargadorDeFotos.height + 215;
         picDesc.y = cargadorDeFotos.y + cargadorDeFotos.height + 230;
         picTitle.width = cargadorDeFotos.width;
         picDesc.width = cargadorDeFotos.width;      
      } // fin funcion fotosCargadas
      
      loadTheThumbs();
      
   } //fin funcion ordenarXML
   
} //fin funcion loadXML




CODIGO EN load_thumbnails.as:

Código :

function loadTheThumbs() {
   var thumbLoader:Loader = new Loader();
   var thumbRequest:URLRequest = new URLRequest( thumbPathList [ c ] );
   thumbLoader.load(thumbRequest);
   thumbLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, thumbsCargados);

   function thumbsCargados(event:Event):void {
      var thisThumbLink:String = picturePathList[ c ];
      var thisPicsTitle:String = pictureTitleList[ c ];
      var thisPicsDesc:String = pictureDescList[ c ];
      thumbLoader.x = (xs * xSpacing);// + 8;
      thumbLoader.y = (ys * ySpacing);// + 5;
      xs = xs + 1;
      if (xs == thumbRowCount) {
         xs = 0;
         ys = ys + 1;
      }//fin IF


      //CODIGO PARA CLICK DE MOUSE

      thumbLoader.addEventListener(MouseEvent.CLICK, loadMainPic);

      function loadMainPic(event:MouseEvent):void {
         thumbLoader.removeEventListener(MouseEvent.CLICK, loadMainPic);
         if (cargadorDeFotos.numChildren == 1) {
               cargadorDeFotos.removeChildAt(0);
         }
         picDesc.text = "";
         picTitle.text = "";
         //loadingText.x = mainPicPlacementX;
         //loadingText.y = mainPicPlacementY;
         var mainLoader:Loader = new Loader();
         var mainRequest:URLRequest = new URLRequest( thisThumbLink );
         mainLoader.load(mainRequest);
         mainLoader.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS, progressHandler);
         mainLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, fotosCargadas);   
         
         
         function progressHandler(event:ProgressEvent):void {
            var kbLoaded:String = Number(event.bytesLoaded / 1024).toFixed(1);
            var kbTotal:String = Number(event.bytesTotal / 1024).toFixed(1);
            loadingText.text = "Cargados " + kbLoaded + " de " + kbTotal + " KB";
         }//fin funcion progressHandler


         function fotosCargadas(event:Event):void {
            thumbLoader.addEventListener(MouseEvent.CLICK, loadMainPic);
            loadingText.text = "";
            cargadorDeFotos.addChild(mainLoader);//.content);
            fadeIn = new Tween(cargadorDeFotos, "alpha", None.easeNone, 0, 1, 10, false);      
            picTitle.text = thisPicsTitle;
            picDesc.text = thisPicsDesc;
            picTitle.x = cargadorDeFotos.x;
            picDesc.x = cargadorDeFotos.x;
            picTitle.y = cargadorDeFotos.y + cargadorDeFotos.height + 215;
            picDesc.y = cargadorDeFotos.y + cargadorDeFotos.height + 230;
            picTitle.width = cargadorDeFotos.width;
            picDesc.width = cargadorDeFotos.width;      
            

         }// fin funcion fotosCargadas
         
      }// fin funcion loadMainPic

      all_thumbs.addChild(thumbLoader);
      
      loadTooltip(); //llamo a la funcion loadTooltip en tooltip.as
      
      c = c + 1;
      if (c < fotosTotales) {
         loadTheThumbs();
         galleryPane.update();
      } else {
         xs = 0;
         ys = 0;
         c = 0;
         galleryPane.update();         
         
      }//fin if-else
      
   }//fin funcion thumbsCargados
   
}//fin funcion LoadTheThumbs



CODIGO EN tooltip.as:

Código :

import com.onebyonedesign.utils.OBO_ToolTip;
var toolTip:OBO_ToolTip;
toolTip = OBO_ToolTip.createToolTip(cargadorDeFotos, new LibraryFont(), 0x0489E1, .8, OBO_ToolTip.ROUND_TIP, 0xFFFFFF, 12, false);
//var descripcionText:String = pictureDescList[ c ];

function loadTooltip() {   
    tooltips.push(pictureDescList[ c ] );
}//fin funcion loadTooltip
   

function tooltipClick(){
cargadorDeFotos.addEventListener(MouseEvent.ROLL_OVER, displayToolTip);
cargadorDeFotos.addEventListener(MouseEvent.ROLL_OUT, removeToolTip);
         
   function displayToolTip(me:MouseEvent):void {
      var descripcionText:String = picDesc.text;
      toolTip.addTip(descripcionText);
   }//fin funcion displayToolTip

   function removeToolTip(me:MouseEvent):void {
      toolTip.removeTip();
   }//fin funcion removeToolTip
   
      //DESCARGAR TODO AL CAMBIAR DE SECCION   
      cargadorDeFotos.addEventListener(Event.REMOVED_FROM_STAGE, borrarTodo);
      function borrarTodo() {
      cargadorDeFotos.removeEventListener(MouseEvent.ROLL_OVER, displayToolTip);
      cargadorDeFotos.removeEventListener(MouseEvent.ROLL_OUT, removeToolTip);
      if (cargadorDeFotos.numChildren == 1) {
         cargadorDeFotos.removeChildAt(0);
      }
      while (all_thumbs.numChildren > 0) {
         all_thumbs.removeChildAt(0);
      }
      picDesc.text = "";
      picTitle.text = "";
   }//fin funcion borrarTodo
}




CODIGO DE CLASE TOOLTIP EN com/onebyonedesign/utils/OBO_ToolTip.as:

Código :

/**
* Singleton Tool Tip class AS3 Style
* @author Devon O. Wolfgang
*/

package com.onebyonedesign.utils {

    import flash.display.DisplayObjectContainer;
    import flash.display.Sprite;
    import flash.events.*;
    import flash.filters.DropShadowFilter;
    import flash.text.AntiAliasType;
    import flash.text.Font;
    import flash.text.TextField;
    import flash.text.TextFieldAutoSize;
    import flash.text.TextFormat;

    public class OBO_ToolTip extends Sprite {
        
        public static const ROUND_TIP:String = "roundTip";
        public static const SQUARE_TIP:String = "squareTip";
        
        private static var OBO_TT:OBO_ToolTip;
        
        private var _adv:Boolean;
        private var _tipText:TextField;
        private var _tipColor:uint;
        private var _tipAlpha:Number;
        private var _format:TextFormat;
        private var _ds:DropShadowFilter;
        private var _root:DisplayObjectContainer;
        private var _userTip:String;
        private var _orgX:int;
        private var _orgY:int;
        
        /**
        * singleton class - use static createToolTip() method for instantiation
        * @private
        */
        
        public function OBO_ToolTip(tc:TipCreator, myRoot:DisplayObjectContainer, font:Font, tipColor:uint = 0xFFFFFF, tipAlpha:Number = 1, tipShape:String = "roundTip", fontColor:uint = 0x000000, fontSize:int = 11, advRendering:Boolean = true) {
            if (!tc is TipCreator) throw new Error("OBO_ToolTip class must be instantiated with static method OBO_ToolTip.createToolTip() method.");
            
            _root = myRoot;
            _tipColor = tipColor;
            _tipAlpha = tipAlpha;
            _userTip = tipShape;
            _adv = advRendering;
            _format = new TextFormat(font.fontName, fontSize, fontColor);
            _ds = new DropShadowFilter(3, 45, 0x000000, .7, 2, 2, 1, 3);
            
            this.mouseEnabled = false;
        }
        
        /**
        * The OBO_ToolTip is a Singleton class which is instantiated using the the static method createToolTip(). It allows you to easily add tool tip items to DisplayObject instances.
        * 
        * @example The following example creates a simple red square Sprite instance then instantiates a tool tip instance which displays when the mouse rolls over the square:
        * <listing version="3.0">
        *  package {
        *
        *     import flash.display.Sprite;
        *     import com.onebyonedesign.utils.OBO_ToolTip;
        *     import flash.events.MouseEvent;
        *
        *         public class ToolTipExample extends Sprite {
        * 
        *         private var _toolTip:OBO_ToolTip;
        *         private var _mySprite:Sprite;
        *
        *         public function ToolTipExample() {
        *             _mySprite = drawSprite();
        *             _mySprite.x = 100;
        *             _mySprite.y = 100;
        *             addChild(_mySprite);
        *
        *             _toolTip = OBO_ToolTip.createToolTip(this, new LibraryFont(), 0x000000, .8, OBO_ToolTip.ROUND_TIP, 0xFFFFFF, 8, false);
        *          
        *             _mySprite.addEventListener(MouseEvent.ROLL_OVER, displayToolTip);
        *             _mySprite.addEventListener(MouseEvent.ROLL_OUT, removeToolTip);
        *         }
        * 
        *         private function displayToolTip(me:MouseEvent):void {
        *             _toolTip.addTip("This is a tool tip example.");
        *         }
        * 
        *         private function removeToolTip(me:MouseEvent):void {
        *             _toolTip.removeTip();
        *         }
        * 
        *         private function drawSprite():Sprite {
        *             var s:Sprite = new Sprite();
        *             s.graphics.beginFill(0xFF0000);
        *             s.graphics.drawRect(0, 0, 50, 50);
        *             s.graphics.endFill();
        *             return s;
        *         }
        *     }
        * }
        * </listing>
        * 
        * 
        * @param    myRoot      The "root" display object which will parent the tool tip.
        * @param    font            An instance of the embedded font class to use for the tool tip text.
        * @param    tipColor        The hexadecimal color of the tool tip.
        * @param    tipAlpha        The alpha of the tool tip (0 - 1).
        * @param    tipShape        The shape of the tool tip. Either <code>OBO_ToolTip.ROUND_TIP</code> or <code>OBO_ToolTip.SQUARE_TIP</code>.
        * @param    fontColor      The hexadecimal color of the tool tip's text.
        * @param    fontSize        The size of the tool tip text.
        * @param    advRendering    Recommend <code>false</code> for pixel fonts and <code>true</code> for others.
        * @return               A single instance of the OBO_ToolTip class.
        */
        public static function createToolTip(myRoot:DisplayObjectContainer, font:Font, tipColor:uint = 0xFFFFFF, tipAlpha:Number = 1, tipShape:String = "roundTip", fontColor:uint = 0x000000, fontSize:int = 11, advRendering:Boolean = true):OBO_ToolTip {
            if (OBO_TT == null) OBO_TT = new OBO_ToolTip(new TipCreator(), myRoot, font, tipColor, tipAlpha, tipShape, fontColor, fontSize, advRendering);
            return OBO_TT;
        }
        
        /**
        * Use this method to display the tool tip.
        * 
        * @param    words         The message the tool tip should display.
        * @return
        */
        public function addTip(words:String):void {
            _root.addChild(this);
            _tipText = new TextField();
            _tipText.mouseEnabled = false;
            _tipText.selectable = false;
            _tipText.defaultTextFormat = _format;
            _tipText.antiAliasType = _adv ? AntiAliasType.ADVANCED : AntiAliasType.NORMAL;
            _tipText.width = 1;
            _tipText.height = 1;
            _tipText.autoSize = TextFieldAutoSize.LEFT;
            _tipText.embedFonts = true;
            _tipText.multiline = true;
            _tipText.text = words;

            var w:Number = _tipText.textWidth;
            var h:Number = _tipText.textHeight;
            
            var tipShape:Array;
    
            switch (_userTip) {
                case ROUND_TIP :
                    tipShape = [[0, -13.42], [0, -2], [10.52, -15.7], [13.02, -18.01, 13.02, -22.65], [13.02, -16-h], [13.23, -25.23-h, 3.1, -25.23-h], [-w , -25.23-h], [-w -7, -25.23-h, -w - 7, -16-h], [-w - 7, -22.65], [-w - 7, -13.42, -w, -13.42]];
                    break;
                case SQUARE_TIP :
                    tipShape = [[-((w / 2) + 5), -16], [-((w / 2) + 5), -((18 + h) + 4)], [((w / 2) + 5), -((18 + h) + 4)], [((w / 2) + 5), -16], [6, -16], [0, 0], [-6, -16], [-((w / 2) + 5), -16]];
                    break;
                default :
                    throw new Error("Undefined tool tip shape in OBO_ToolTip!");
                    break;
            }
        
            var len:int = tipShape.length;
            this.graphics.beginFill(_tipColor, _tipAlpha);  
            for (var i:int = 0; i < len; i++) {
                if (i == 0) {
                    this.graphics.moveTo(tipShape[i][0], tipShape[i][1]);
                } else if (tipShape[i].length == 2) {
                    this.graphics.lineTo(tipShape[i][0], tipShape[i][1]);
                } else if (tipShape[i].length == 4) {
                    this.graphics.curveTo(tipShape[i][0], tipShape[i][1], tipShape[i][2], tipShape[i][3]);
                }
            }
            this.graphics.endFill();
            
            this.x = stage.mouseX;
            this.y = stage.mouseY;
            this.filters = [_ds];
            _tipText.x = (_userTip == ROUND_TIP) ? Math.round(-w) : Math.round(-(w / 2)) - 2;
            _orgX = _tipText.x;
            _tipText.y = Math.round(-21 - h);
            _orgY = _tipText.y;
            this.addChild(_tipText);
            
            stage.addEventListener(MouseEvent.MOUSE_MOVE, onTipMove);
        }
        
        private function onTipMove(me:MouseEvent):void {
            //this.x = Math.round(me.stageX);
            //this.y = Math.round(me.stageY - 2);
         this.x = Math.round(me.stageX - 140);
            this.y = Math.round(me.stageY - 130);
            
            if (this.y - this.height < 0) {
                this.scaleY = _tipText.scaleY = - 1;
                _tipText.y = (_userTip == ROUND_TIP) ? - 18 : -16;
                this.y = Math.round(me.stageY  + 5);
             } else {
                this.scaleY = _tipText.scaleY = 1;
                _tipText.y = _orgY;
            }

            if (this.x - (this.width - 18) < 0) {
                if (_userTip == ROUND_TIP) {
                    this.scaleX = _tipText.scaleX  = - 1;
                    _tipText.x = 5;
                }
            } else {
                this.scaleX = _tipText.scaleX = 1;
                _tipText.x = _orgX;
            }
            
            me.updateAfterEvent();
        }
        
        /**
        * Use this method to remove the tool tip.
        * 
        * @return
        */
        public function removeTip():void {
            stage.removeEventListener(MouseEvent.MOUSE_MOVE, onTipMove);
            this.removeChild(_tipText);
            this.graphics.clear();
            _root.removeChild(this);
        }
        
        /**
        * Sets the shape of the tool tip. Valid arguments are the strings <code>OBO_ToolTip.ROUND_TIP</code> (or "roundTip") and <code>OBO_ToolTip.SQUARE_TIP</code> (or "squareTip"). Anything else will throw an error.
        *       
        * @return
        */
        public function set tipShape(shape:String):void {
            if (shape != ROUND_TIP && shape != SQUARE_TIP) throw new Error("Invalid tip shape \""+ shape + "\" specified at OBO_ToolTip.tipShape.");
            _userTip = shape;
        }
    }
    
}

internal class TipCreator {};


Y eso es todo, los otros .as creo que no son relevantes para el problema. Cualquier ayuda sera eternamente agradecida...

Por neuromante

10 de clabLevel



Genero:Masculino  

msie
Citar            
MensajeEscrito el 09 Jun 2008 07:01 pm
Bueno, jeje, veo que me las tendre que arreglar solo... pero ahora se me ha facilitado un poco la cosa y quiero ver si me pueden dar una mano con esto.
Haciendo un trace cada vez que se produce un tooltip me he dado cuenta de que la funcion existe y se produce luego de cambiar de seccion en la pagina y volver, pero el problema es que no veo el tooltip, no se si no se renderiza o si es que al volver afecta el orden de las capas y el tooltip quede abajo de la foto...??? estoy un poco liado con esto. Hay alguna funcion en AS3 que me permita poner el tooltip en el primer lugar de capas?, es decir delante de todo.
Desde ya muchas gracias.

Por neuromante

10 de clabLevel



Genero:Masculino  

msie
Citar            
MensajeEscrito el 09 Jun 2008 07:25 pm
Sugerencia: nunca pegues 300 líneas de código, porque te asegurarás de que nadie las lea.
Para manejar el depth de un MC, usa setChildIndex(), swapChildren() o swapChildrenAt()

Jorge

Por solisarg

BOFH

13669 de clabLevel

4 tutoriales
5 articulos

Genero:Masculino   Bastard Operators From Hell Premio_Secretos

Argentina

firefox

 

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