¿Quieres registrarte?

Clase de ActionScript 2 para crear una marquesina animada

Por: elchininet
2 de Diciembre del 2008

Hace un tiempo creé un prototype para escribir un texto en forma aleatoria con actionscript, el cual fue mejorado por penHolder al crear una clase para lograr el mismo objetivo, entonces para seguir el trabajo con cadenas de texto e inspirado en el post de un usuario del foro, decidí crear esta clase con la cual se puede lograr un efecto de marquesina usando para ello Actionscript 2. Al igual que el anterior prototype, está sujeta a arreglos y optimizaciones, así que todos los que aporten algo para mejorarla serán bien recibidos.

Para usarla se debe tener copiada la siguiente clase dentro de un fichero "marquee.as" junto a nuestro fichero flash:

Código :

class marquee{

private var _campo:TextField;
private var _texto:String;
private var _speed:Number;
private var _intervalo:Number;

private var _inc:Number;
private var _pos:Number;
private var _chars:Number;
private var _str:String;
private var _swap:Boolean;

private var _formatoL:TextFormat;
private var _formatoR:TextFormat;

//---Función constructora
public function marquee(campo:TextField, texto:String, speed:Number){

_texto = texto;
_speed = speed;
_campo = campo;
_campo.multiline = false;
_campo.wordWrap = false;

//---Formatos
_formatoL = new TextFormat();
_formatoR = new TextFormat();
_formatoL.align = "left";
_formatoR.align = "right";

//---Comprobar si el texto es mayor que el campo
_campo.text = _texto;
var sc:Boolean = (_campo.maxhscroll > 0) ? true : false;
_campo.text = "";

//---Scrollear o dejar intacto
if(sc){

//---Poner la alineación en la derecha al inicio
_campo.setNewTextFormat(_formatoR);

_inc = 0;
_pos = 1;
_chars = _texto.length;
_swap = false;

//---Ejecutar la función por tiempo
start();

}else{

//---Situar el texto fijo
_campo.text = _texto;

}

}

//---Función de scrollear la marquesina
private function scrollMarquee():Void{

_str = _texto.slice(_inc, _pos);

//---Si el último caracter es un espacio
if(!_swap && _str.slice(_str.length - 1, _str.length) == " "){

_pos++;
_str = _texto.slice(_inc, _pos);

}

//---Asignar el string al campo de texto
_campo.text = _str;

//---Incrementar los indexs
if(_pos < _chars){ _pos++; }

if(_swap){ _inc++; }

//---De acabarse el campo de texto, volver a empezar
if(_inc >= _chars){

_inc = 0;
_pos = 1;
_swap = false;
_campo.setNewTextFormat(_formatoR);

}

//---Cambiar de derecha a izquierda
if(_campo.maxhscroll > 0 && !_swap){

_campo.text = _texto.slice(_inc + 1, _pos);
_campo.setNewTextFormat(_formatoL);
_swap = true;

}

}

//---Función para detener la marquesina
public function stop():Void{

clearInterval(_intervalo);

}

//---Función para comenzar la marquesina
public function start():Void{

_intervalo = setInterval(this, "scrollMarquee", _speed);

}

}


Su construcción y métodos es bastante sencilla:

Función Constructora


Código :

public marquesina(campo:TextField, frase:String, velocidad:Number);


Métodos


start() Comienza a hacer funcionar la marquesina (la función constructora llama a este método automáticamente)
stop() Detiene la marquesina

Veamos un ejemplo concreto, creemos un documento de 30fps, situar junto al FLA el fichero "marquee.as", crear un textfield dinámico con nombre de instancia "myText", después situar en el mismo frame donde se encuentra el textfield lo siguiente:

Código :

var marquesina:marquee = new marquee(myText, "Clase para simular una marquesina en ActionScript 2", 80);


Si quisiéramos detener la marquesina pondríamos:

Código :

marquesina.stop();

Si quisiéramos hecharla a andar nuevamente pondríamos:

Código :

marquesina.start();


Aquí tienen un ejemplo:



Saludos y espero que les sea de ayuda.

Enviar a twitter Enviar a facebook


También te interesa


Etiquetas flash actionscript animacion poo

Comentarios | Enviar un comentario
Olvidé mencionar en el texto la clase creada para este mismo propósito en AS3 creada por Rafeo.
Por: elchininet
mirá vos... las veces que habre hecho esto jaja, muy bueno che, mas facil asi
Por: danyrik
comos e hace pero con imagenes?
Por: musika-blog
Buenas tardes, vereis probando este ejemplo en mi .fla, me carga el actionscrip, pero no se ejecuta el movimiento de la marquesina...

He probado a colocarlo en distintas capas, por si hay incompativilidad con las funciones que ya tengo en el fotograma, os las facilito a continuación por si veis algo raro...


var marquesina:marquee = new marquee(myText, "Clase para simular una marquesina en ActionScript 2", 80);
loadMovieNum("boton.swf",200);
mc = _root.createEmptyMovieClip("inicial",200);
mc.nivel=200;
mc.onEnterFrame = function()
{
cargados= eval("_level"+this.nivel).getBytesLoaded();
totales = eval("_level"+this.nivel).getBytesTotal();
if (cargados == totales && totales>0)
{
eval("_level"+this.nivel)._x=20;
eval("_level"+this.nivel)._y=120;
this.removeMovieClip();
}
}


loadMovieNum("inicio.swf",99);
mc = _root.createEmptyMovieClip("inicial",99);
mc.nivel=99;
mc.onEnterFrame = function()
{
cargados= eval("_level"+this.nivel).getBytesLoaded();
totales = eval("_level"+this.nivel).getBytesTotal();
if (cargados == totales && totales>0)
{
eval("_level"+this.nivel)._x=20;
eval("_level"+this.nivel)._y=0;
this.removeMovieClip();
}
}

Gracias previamente! Un saludo
Por: Sergio Paños-blog
Hola, ¿Cómo puedo hacer que el texto de la marquesina cambie cuando pulse diferentes botones?

Por ejemplo, que de principio muestre "canción 1", que al pulsar un boton muestre "canción 2"y así según vaya pulsando diferentes botones vaya cambiando el texto.
Por: wataroo
@wataroo, Añadiendo una propiedad pública para cambiar el texto de la case lo puedes lograr, aquí tienes el código actualizado:

Código :

class marquee {

   private var _campo:TextField;
   private var _texto:String;
   private var _speed:Number;
   private var _intervalo:Number;

   private var _inc:Number;
   private var _pos:Number;
   private var _chars:Number;
   private var _str:String;
   private var _swap:Boolean;

   private var _formatoL:TextFormat;
   private var _formatoR:TextFormat;

   //---Función constructora 
   public function marquee(campo:TextField, texto:String, speed:Number) {

      _texto = texto;
      _speed = speed;
      _campo = campo;
      _campo.multiline = false;
      _campo.wordWrap = false;

      //---Formatos 
      _formatoL = new TextFormat();
      _formatoR = new TextFormat();
      _formatoL.align = "left";
      _formatoR.align = "right";

      //---Comprobar si el texto es mayor que el campo 
      _campo.text = _texto;
      var sc:Boolean = (_campo.maxhscroll>0) ? true : false;
      _campo.text = "";

      //---Scrollear o dejar intacto 
      if (sc) {

         //---Poner la alineación en la derecha al inicio 
         _campo.setNewTextFormat(_formatoR);

         _inc = 0;
         _pos = 1;
         _chars = _texto.length;
         _swap = false;

         //---Ejecutar la función por tiempo 
         start();

      } else {

         //---Situar el texto fijo 
         _campo.text = _texto;

      }

   }

   //---Función de scrollear la marquesina 
   private function scrollMarquee():Void {

      _str = _texto.slice(_inc, _pos);

      //---Si el último caracter es un espacio 
      if (!_swap && _str.slice(_str.length-1, _str.length) == " ") {

         _pos++;
         _str = _texto.slice(_inc, _pos);

      }
      //---Asignar el string al campo de texto  
      _campo.text = _str;

      //---Incrementar los indexs 
      if (_pos<_chars) {
         _pos++;
      }

      if (_swap) {
         _inc++;
      }
      //---De acabarse el campo de texto, volver a empezar  
      if (_inc>=_chars) {

         _inc = 0;
         _pos = 1;
         _swap = false;
         _campo.setNewTextFormat(_formatoR);

      }
      //---Cambiar de derecha a izquierda  
      if (_campo.maxhscroll>0 && !_swap) {

         _campo.text = _texto.slice(_inc+1, _pos);
         _campo.setNewTextFormat(_formatoL);
         _swap = true;

      }

   }

   //---Método para detener la marquesina 
   public function stop():Void {

      clearInterval(_intervalo);

   }

   //---Método para comenzar la marquesina 
   public function start():Void {

      _intervalo = setInterval(this, "scrollMarquee", _speed);

   }
   
   //---Propiedades del texto
   public function get text():String{
      return _texto;
   }
   
   public function set text(str:String):Void{
      _texto = str;
      _chars = _texto.length;
   }

}


Y aquí tienes un ejemplo, en la escena está el campo de texto "myText" y dos MovieClips "boton1" y "botón2", en el primer frame tendrías un código como el siguiente:

Código :

import marquee;

var marquesina:marquee = new marquee(myText, "Clase para simular una marquesina en ActionScript 2", 80); 

boton1.onPress = function():Void{
   
   marquesina.text = "Adición de propiedades de set y get del texto";
   
}

boton2.onPress = function():Void{
   
   marquesina.text = "Automáticamente se remplazará el texto de la marquesina";
   
}


Al presionar los botones el texto de la marquesina cambiará.
Por: elchininet
@wataroo, Añadiendo una propiedad pública para cambiar el texto de la case lo puedes lograr, aquí tienes el código actualizado:

Código :

class marquee {

   private var _campo:TextField;
   private var _texto:String;
   private var _speed:Number;
   private var _intervalo:Number;

   private var _inc:Number;
   private var _pos:Number;
   private var _chars:Number;
   private var _str:String;
   private var _swap:Boolean;

   private var _formatoL:TextFormat;
   private var _formatoR:TextFormat;

   //---Función constructora 
   public function marquee(campo:TextField, texto:String, speed:Number) {

      _texto = texto;
      _speed = speed;
      _campo = campo;
      _campo.multiline = false;
      _campo.wordWrap = false;

      //---Formatos 
      _formatoL = new TextFormat();
      _formatoR = new TextFormat();
      _formatoL.align = "left";
      _formatoR.align = "right";

      //---Comprobar si el texto es mayor que el campo 
      _campo.text = _texto;
      var sc:Boolean = (_campo.maxhscroll>0) ? true : false;
      _campo.text = "";

      //---Scrollear o dejar intacto 
      if (sc) {

         //---Poner la alineación en la derecha al inicio 
         _campo.setNewTextFormat(_formatoR);

         _inc = 0;
         _pos = 1;
         _chars = _texto.length;
         _swap = false;

         //---Ejecutar la función por tiempo 
         start();

      } else {

         //---Situar el texto fijo 
         _campo.text = _texto;

      }

   }

   //---Función de scrollear la marquesina 
   private function scrollMarquee():Void {

      _str = _texto.slice(_inc, _pos);

      //---Si el último caracter es un espacio 
      if (!_swap && _str.slice(_str.length-1, _str.length) == " ") {

         _pos++;
         _str = _texto.slice(_inc, _pos);

      }
      //---Asignar el string al campo de texto  
      _campo.text = _str;

      //---Incrementar los indexs 
      if (_pos<_chars) {
         _pos++;
      }

      if (_swap) {
         _inc++;
      }
      //---De acabarse el campo de texto, volver a empezar  
      if (_inc>=_chars) {

         _inc = 0;
         _pos = 1;
         _swap = false;
         _campo.setNewTextFormat(_formatoR);

      }
      //---Cambiar de derecha a izquierda  
      if (_campo.maxhscroll>0 && !_swap) {

         _campo.text = _texto.slice(_inc+1, _pos);
         _campo.setNewTextFormat(_formatoL);
         _swap = true;

      }

   }

   //---Método para detener la marquesina 
   public function stop():Void {

      clearInterval(_intervalo);

   }

   //---Método para comenzar la marquesina 
   public function start():Void {

      _intervalo = setInterval(this, "scrollMarquee", _speed);

   }
   
   //---Propiedades del texto
   public function get text():String{
      return _texto;
   }
   
   public function set text(str:String):Void{
      _texto = str;
      _chars = _texto.length;
   }

}


Y aquí tienes un ejemplo, en la escena está el campo de texto "myText" y dos MovieClips "boton1" y "botón2", en el primer frame tendrías un código como el siguiente:

Código :

import marquee;

var marquesina:marquee = new marquee(myText, "Clase para simular una marquesina en ActionScript 2", 80); 

boton1.onPress = function():Void{
   
   marquesina.text = "Adición de propiedades de set y get del texto";
   
}

boton2.onPress = function():Void{
   
   marquesina.text = "Automáticamente se remplazará el texto de la marquesina";
   
}


Al presionar los botones el texto de la marquesina cambiará.
Por: elchininet
Perdón por el doble post un pete del explorador.
Por: elchininet
lo que pasa es que cree un texto dinamico donde debe aparacer lo que escriba en el texto de introduccion y simplemente no m realiza la funcion
quisiera saber como hacerle con action script
Por: marce-blog
kisiera saber que seria un ejemplo de action script???? x favor contesten ami pregunta
Por: widson-blog
quisiera saber un ejemplo de action script??? por favor contesten ami pregunta me urge!!!! muchas grasias!!!!
Por: widson-blog
@widson será muy difícil que alguien te reponda si no reformulas mejor tu pregunta.
Por: elchininet
Hola, tengo una pregunta ¿se puede hacer una marquesina de este estilo pero que el texto se extraiga de una archivo .txt? Espero su respuesta.
Gracias
Por: Klorp
@Klorp, extrae primero el texto del txt por el método tradicional y después crea la marquesina con la variable extraída.
Por: elchininet
Buen tutorial. Gracias.
Por: merlin1989
mirá vos... q bueno.
Por: merlin1989
Por ejemplo, ¿es posible utilizar createTextField dentro de una clase? Esto para evitar el dar una referencia del campo de texto en el Stage y crearlo todo desde el código.
Por: juan pablo-blog
@juan pablo-blog, en AS2 a diferencia de AS3 debes crear el objeto en un contenedor, es decir no puedes crear un TextField o un MovieClip, variar sus propiedades y después añadirlo a la escena como se hace en AS3. Sino que debes de crearlo en algún sitio y después variar sus propiedades. Puedes utilizar createTextField dentro de una clase, pero al menos esta clase debe tener referencia de algún MovieClip donde va a crear el texto y este MovieClip por supuesto debe de encontrarse en la escena o dentro de otro objeto que se encuentre en la misma.
Por: elchininet
Deja un comentario
IMPORTANTE

Recuerda ser respetuoso, no insultes a otras personas, ni uses palabrotas, hay una persona al otro lado de la pantalla.

Habla bien, NO ESCRIBAS EN MAYUSCULA TODO, no escribas como en un SMS, evita cosas como "ke", "x q" y demás abreviaciones.

Aquí funcionan las etiquetas de los foros, puedes usar [b] para negrita, [img] para las imágenes, [url] para los enlaces, etc.

Si tienes preguntas técnicas, envíalas mejor al foro.