No sé si habrá un tip igual a éste, (y cualquier usuario de Cristalab puede aportar tips). Estuve buscando pero sólo había funciones para aparecer texto letra por letra (y en AS2). Hace muy poco necesité este efecto y me propuse escribir una clase yo mismo, de paso que aprendo AS3. Si alguien puede mejorarlo, bienvenido sea. En el mismo código explico todo en los comentarios.
Ah! por si acaso uso aquí TweenMax de GreenSock.
Espero que a alguien le sea útil!
Código :
package { //importamos las clases necesarias import gs.*; import flash.display.Sprite; import flash.text.*; public class TextAppearByLine extends Sprite { private var _txt:String; private var _refTextField:TextField; private var _txtWidth:Number; //este es un font de la biblioteca del archivo .fla exportado para actionscript private var _font:MyHelvetica=new MyHelvetica(); private var _txtFmt:TextFormat; private var _fadeDuration:Number=0.5; private var _fadeDelay:Number=0.25; private var _clipDelay:Number; public function TextAppearByLine(txt:String,clipDelay:Number,txtWidth:Number) { //los parametros necesarios _txt=txt;//el texto en si _clipDelay=clipDelay;//este parametro es opcional, yo lo puse porque necesitaba varios campos de //texto que aparezcan uno despues de otro. _txtWidth=txtWidth;//el ancho de la caja de texto _txtFmt=new TextFormat();//text format necesario para el texto. _txtFmt.font=_font.fontName; _txtFmt.color=0x000000; _txtFmt.size=20; //este campo de texto lo uso como referencia para sacar los textos linea por linea,por eso nunca lo //agrego a la display list _refTextField=new TextField(); _refTextField.width=_txtWidth; _refTextField.multiline=true; _refTextField.wordWrap=true; _refTextField.autoSize=TextFieldAutoSize.LEFT; _refTextField.text=_txt; _refTextField.defaultTextFormat=_txtFmt; makeTextFields(); } //con esta funcion creamos los textos en si private function makeTextFields():void { //usamos la propiedad numLines de la clase TextField para hacer el loop for(var i:uint=0;i<_refTextField.numLines;i++) { var txtLine:TextField=new TextField(); txtLine.defaultTextFormat=_txtFmt; txtLine.width=_txtWidth; txtLine.selectable=false; txtLine.autoSize=TextFieldAutoSize.LEFT; txtLine.embedFonts=true; //este metodo getLineText es el q hace todo el trabajo!! txtLine.text=_refTextField.getLineText(i); txtLine.x=0; txtLine.y=txtLine.height*i; //alpha en 0 para luego animar su aparicion txtLine.alpha=0; //aqui el tween para el efecto de fade "inverso", jeje.la propiedad delay de TweenMax me evita //tener q hacer una funcion muy compleja con Timers para luego llamar a los tweens. TweenMax.to(txtLine,_fadeDuration,{alpha:1,delay:_clipDelay+_fadeDelay*i}); //y bueno, finalmente añadimos el texto a la display list. addChild(txtLine); } } } }
Entonces en el archivo fla escribimos algo asi:
Código :
var myString="escribir aqui tooooooooooooooooodo el texto que quieran"; var t:TextAppearByLine=new TextappearByLine(myString,0,200); t.x=t.y=50; addChild(t);
Por último, he de mencionar que, al ser ésta una clase, debería ser lo más reutilizable posible, por lo tanto hubiera sido mejor añadir muchas opciones en los parámetros (tipo de letra, tamaño de la letra, color del texto, etc) pero no lo hice porque me desagrada escribir muchos parámetros al llamar a mis clases y porque fue una ocasión muy específica en que la necesité. Ustedes por supuesto pueden hacer las modificaciones que necesiten.
Saludos!
¿Sabes SQL? ¿No-SQL? Aprende MySQL, PostgreSQL, MongoDB, Redis y más con el Curso Profesional de Bases de Datos que empieza el martes, en vivo.
Por Freddie el 22 de Julio de 2009
Por Mónica el 17 de Agosto de 2010
Saludos
Por pintorxx el 22 de Marzo de 2011
Por Albeiro el 08 de Febrero de 2014