Volver al Flash y ActionScript Foro

Fading in / out dinámica de texto XML

  • DAVE EVANS
  • Born
  • Born
  • No Avatar
  • Registrado: Ago 20, 2008
  • Mensajes: 3
  • Status: Offline

Nota Agosto 20th, 2008, 8:01 am

Hola a todos

Pasó todo el día buscando foros y tratando de código para realizar esta tarea sencilla;

Fade en un texto dinámico cuando el usuario pasa el ratón sobre una imagen.

Ive consiguió el texto que muestra muy bien, apenas tratando de conseguir que se desvanezca, y cuando el usuario mueve el cursor alejándolo de la imagen, el texto se desvanece de nuevo.

¿Hay alguien aquí puede ayudar?

Soy muy nuevo para la codificación de ActionScript BTW!

Mi código hasta ahora es el siguiente:

Código: [ Select ]
 
 
import mx.utils.Delegate;
 
var numOfItems:Number;
var radiusX:Number = 210;
var radiusY:Number = 10;
var centerX:Number = Stage.width / 2.51;
var centerY:Number = Stage.height / 2;
var speed:Number = 0.003;
var perspective:Number = 100;
var home:MovieClip = this;
 
tn_group_mc._visible = false;
fm_label.text = ""; fm_info.text = "";
 
var tooltip:MovieClip = this.attachMovie("tooltip","tooltip",10000);
tooltip._alpha = 0;
 
var xml:XML = new XML();
xml.ignoreWhite = true;
 
xml.onLoad = function()
{
    var nodes = this.firstChild.childNodes;
    numOfItems = nodes.length;
    for(var i=0;i<numOfItems;i++)
    {
        var t = home.attachMovie("item","item"+i,i+1);
        t.angle = i * ((Math.PI*2)/numOfItems);
        t.onEnterFrame = mover;
        t.icon.inner.loadMovie(nodes[i].attributes.image);
        t.r.inner.loadMovie(nodes[i].attributes.image);
        t.icon.onRollOver = over;
        t.icon.onRollOut = out;
        t.icon.onRelease = released;
       
        t.fm_label = nodes[i].attributes.label;
        t.fm_info = nodes[i].attributes.info;
        t.fm_url = nodes[i].attributes.url;
 
        }
}
 
function over()
{
 
            fm_label.text =  this._parent.fm_label; 
            fm_info.text = this._parent.fm_info;   
            fm_url.text = this._parent.fm_url; 
 
            home.tooltip.tipText.text = this._parent.fm_label;
            home.tooltip._x = this._parent._x;
            home.tooltip._y = this._parent._y - this._parent._height/2;
            home.tooltip.onEnterFrame = Delegate.create(this,moveTip);
            home.tooltip._alpha = 100;
           
           
}
 
function out()
{
            fm_label.text = "";
            fm_info.text = "";
            fm_url.text = "";
           
            delete home.tooltip.onEnterFrame;
            home.tooltip._alpha = 0;
}
 
function released()
{
            getURL(this._parent.fm_url);
}
 
function moveTip()
{
    home.tooltip._x = this._parent._x;
    home.tooltip._y = this._parent._y - this._parent._height/2;
}
 
xml.load("icons.xml");
 
function mover()
{
    this._x = Math.cos(this.angle) * radiusX + centerX;
    this._y = Math.sin(this.angle) * radiusY + centerY;
    var s = (this._y - perspective) /(centerY+radiusY-perspective);
    this._xscale = this._yscale = s*100;
    this.angle += this._parent.speed;
    this.swapDepths(Math.round(this._xscale) + 100);
}
 
this.onMouseMove = function()
{
    speed = (this._xmouse-centerX)/15000;
}
 
 
  1.  
  2.  
  3. import mx.utils.Delegate;
  4.  
  5. var numOfItems:Number;
  6. var radiusX:Number = 210;
  7. var radiusY:Number = 10;
  8. var centerX:Number = Stage.width / 2.51;
  9. var centerY:Number = Stage.height / 2;
  10. var speed:Number = 0.003;
  11. var perspective:Number = 100;
  12. var home:MovieClip = this;
  13.  
  14. tn_group_mc._visible = false;
  15. fm_label.text = ""; fm_info.text = "";
  16.  
  17. var tooltip:MovieClip = this.attachMovie("tooltip","tooltip",10000);
  18. tooltip._alpha = 0;
  19.  
  20. var xml:XML = new XML();
  21. xml.ignoreWhite = true;
  22.  
  23. xml.onLoad = function()
  24. {
  25.     var nodes = this.firstChild.childNodes;
  26.     numOfItems = nodes.length;
  27.     for(var i=0;i<numOfItems;i++)
  28.     {
  29.         var t = home.attachMovie("item","item"+i,i+1);
  30.         t.angle = i * ((Math.PI*2)/numOfItems);
  31.         t.onEnterFrame = mover;
  32.         t.icon.inner.loadMovie(nodes[i].attributes.image);
  33.         t.r.inner.loadMovie(nodes[i].attributes.image);
  34.         t.icon.onRollOver = over;
  35.         t.icon.onRollOut = out;
  36.         t.icon.onRelease = released;
  37.        
  38.         t.fm_label = nodes[i].attributes.label;
  39.         t.fm_info = nodes[i].attributes.info;
  40.         t.fm_url = nodes[i].attributes.url;
  41.  
  42.         }
  43. }
  44.  
  45. function over()
  46. {
  47.  
  48.             fm_label.text =  this._parent.fm_label; 
  49.             fm_info.text = this._parent.fm_info;   
  50.             fm_url.text = this._parent.fm_url; 
  51.  
  52.             home.tooltip.tipText.text = this._parent.fm_label;
  53.             home.tooltip._x = this._parent._x;
  54.             home.tooltip._y = this._parent._y - this._parent._height/2;
  55.             home.tooltip.onEnterFrame = Delegate.create(this,moveTip);
  56.             home.tooltip._alpha = 100;
  57.            
  58.            
  59. }
  60.  
  61. function out()
  62. {
  63.             fm_label.text = "";
  64.             fm_info.text = "";
  65.             fm_url.text = "";
  66.            
  67.             delete home.tooltip.onEnterFrame;
  68.             home.tooltip._alpha = 0;
  69. }
  70.  
  71. function released()
  72. {
  73.             getURL(this._parent.fm_url);
  74. }
  75.  
  76. function moveTip()
  77. {
  78.     home.tooltip._x = this._parent._x;
  79.     home.tooltip._y = this._parent._y - this._parent._height/2;
  80. }
  81.  
  82. xml.load("icons.xml");
  83.  
  84. function mover()
  85. {
  86.     this._x = Math.cos(this.angle) * radiusX + centerX;
  87.     this._y = Math.sin(this.angle) * radiusY + centerY;
  88.     var s = (this._y - perspective) /(centerY+radiusY-perspective);
  89.     this._xscale = this._yscale = s*100;
  90.     this.angle += this._parent.speed;
  91.     this.swapDepths(Math.round(this._xscale) + 100);
  92. }
  93.  
  94. this.onMouseMove = function()
  95. {
  96.     speed = (this._xmouse-centerX)/15000;
  97. }
  98.  
  99.  
  • Anonymous
  • Bot
  • No Avatar
  • Registrado: 25 Feb 2008
  • Mensajes: ?
  • Loc: Ozzuland
  • Status: Online

Nota Agosto 20th, 2008, 8:01 am

  • graphixboy
  • Control + Z
  • Mastermind
  • Avatar de Usuario
  • Registrado: Jul 11, 2005
  • Mensajes: 1828
  • Loc: In the Great White North
  • Status: Offline

Nota Agosto 20th, 2008, 1:02 pm

Yo no veo ningún código de acción con los botones reales...

Código de un botón se
Código: [ Select ]
buttonInstanceName.onRelease = function(){
// do some action when button is clicked
}

buttonInstanceName.onRollOver= function(){
// do some action when button Hovered
}

buttonInstanceName.onRollOut= function(){
// do some action when mouse leaves button
}
  1. buttonInstanceName.onRelease = function(){
  2. // do some action when button is clicked
  3. }
  5. buttonInstanceName.onRollOver= function(){
  6. // do some action when button Hovered
  7. }
  9. buttonInstanceName.onRollOut= function(){
  10. // do some action when mouse leaves button
  11. }


por lo que se necesita algo como...
Código: [ Select ]
nameOfButton.onRollOver = function(){
     fm_label.text = this._parent.fm_label;
     fm_info.text = this._parent.fm_info; 
     fm_url.text = this._parent.fm_url;

     home.tooltip.tipText.text = this._parent.fm_label;
     home.tooltip._x = this._parent._x;
     home.tooltip._y = this._parent._y - this._parent._height/2;
     home.tooltip.onEnterFrame = Delegate.create(this,moveTip);
     home.tooltip._alpha = 100;
}
  1. nameOfButton.onRollOver = function(){
  2.      fm_label.text = this._parent.fm_label;
  3.      fm_info.text = this._parent.fm_info; 
  4.      fm_url.text = this._parent.fm_url;
  6.      home.tooltip.tipText.text = this._parent.fm_label;
  7.      home.tooltip._x = this._parent._x;
  8.      home.tooltip._y = this._parent._y - this._parent._height/2;
  9.      home.tooltip.onEnterFrame = Delegate.create(this,moveTip);
  10.      home.tooltip._alpha = 100;
  11. }
If at first you don't succeed F1... If that doesn't work try Google!
//// Designer, Developer & Teacher - Interactive, Motion and 3D \\\\
Portfolio at WhenImNotSleeping.com
  • DAVE EVANS
  • Born
  • Born
  • No Avatar
  • Registrado: Ago 20, 2008
  • Mensajes: 3
  • Status: Offline

Nota Agosto 21st, 2008, 1:32 am

Gracias por la rápida respuesta.

¿Necesito un botón? En este momento tengo las funciones para cuando el usuario rollos a través de una imagen, el texto está cargado desde el archivo xml.

El flash es como un carrusel que, con el texto debajo de las imágenes.

Así que, en principio, quiero en la imagen de renovación, se desvanecen en el texto de archivo xml, y en la implantación de imagen, se desvanecen texto.
  • graphixboy
  • Control + Z
  • Mastermind
  • Avatar de Usuario
  • Registrado: Jul 11, 2005
  • Mensajes: 1828
  • Loc: In the Great White North
  • Status: Offline

Nota Agosto 21st, 2008, 9:08 am

así tienes que tener ya sea un botón o un movieclip (flash opiniones de la misma manera) para conectar con el onRollOver / onRollOut código. siempre y cuando sus imágenes se encuentran dentro de movieclips puede adjuntar el código para que movieclip.
If at first you don't succeed F1... If that doesn't work try Google!
//// Designer, Developer & Teacher - Interactive, Motion and 3D \\\\
Portfolio at WhenImNotSleeping.com
  • DAVE EVANS
  • Born
  • Born
  • No Avatar
  • Registrado: Ago 20, 2008
  • Mensajes: 3
  • Status: Offline

Nota Agosto 22nd, 2008, 7:21 am

Sí, a la derecha son clips de película.

Han logrado hacerlo ahora, hizo una nueva capa y poner este código en él:

Código: [ Select ]
MovieClip.prototype.fade = function(newAlpha:Number,speed:Number):Void{
        this.currentAlpha = this._alpha;
        this.onEnterFrame = function():Void{
                if(this.currentAlpha > newAlpha){
                        this._alpha -= speed;
                }
                else if(this.currentAlpha < newAlpha){
                        this._alpha += speed;
                }
                if (Math.abs(Math.round(newAlpha-this._alpha))<=speed){
                        this._alpha = newAlpha;
                        delete this.onEnterFrame;
                }
        };
};
  1. MovieClip.prototype.fade = function(newAlpha:Number,speed:Number):Void{
  2.         this.currentAlpha = this._alpha;
  3.         this.onEnterFrame = function():Void{
  4.                 if(this.currentAlpha > newAlpha){
  5.                         this._alpha -= speed;
  6.                 }
  7.                 else if(this.currentAlpha < newAlpha){
  8.                         this._alpha += speed;
  9.                 }
  10.                 if (Math.abs(Math.round(newAlpha-this._alpha))<=speed){
  11.                         this._alpha = newAlpha;
  12.                         delete this.onEnterFrame;
  13.                 }
  14.         };
  15. };


Luego, en mi función de vuelco he utilizado este código para llamar es el siguiente:

Código: [ Select ]
obj_mc.fade(100, 8);


Probablemente no es la mejor manera de hacerlo pero bueno, su trabajo!

Gracias por la ayuda!
  • graphixboy
  • Control + Z
  • Mastermind
  • Avatar de Usuario
  • Registrado: Jul 11, 2005
  • Mensajes: 1828
  • Loc: In the Great White North
  • Status: Offline

Nota Agosto 22nd, 2008, 11:04 am

alegra que tengo de pruebas.
If at first you don't succeed F1... If that doesn't work try Google!
//// Designer, Developer & Teacher - Interactive, Motion and 3D \\\\
Portfolio at WhenImNotSleeping.com

Página 1 de 1

Publicar Información

  • Total de mensajes en este tema: 6 mensajes
  • Usuarios navegando por este Foro: No hay usuarios registrados visitando el Foro y 45 invitados
  • No puede abrir nuevos temas en este Foro
  • No puede responder a temas en este Foro
  • No puede editar sus mensajes en este Foro
  • No puede borrar sus mensajes en este Foro
  • No puede enviar adjuntos en este Foro
 
 

© 2011 Unmelted, LLC. Ozzu® es una marca registrada de Unmelted, LLC