Visualización de texto

Flash Player 9 y posterior, Adobe AIR 1.0 y posterior

Aunque las herramientas de edición como Adobe Flex Builder y Flash Professional proporcionan varias opciones para visualizar texto, como componentes relacionados con texto o herramientas de texto, la principal manera de mostrar texto mediante programación es utilizar un campo de texto.

Tipos de texto

El tipo de texto de un campo de texto se caracteriza por su origen:

  • Texto dinámico

    El texto dinámico incluye contenido que se carga desde un origen externo, como un archivo de texto, un archivo XML o incluso un servicio web remoto.

  • Texto de entrada

    El texto de entrada es cualquier texto introducido por un usuario o texto dinámico que un usuario puede editar. Se puede establecer una hoja de estilos para aplicar formato al texto de entrada o utilizar la clase flash.text.TextFormat para asignar propiedades al campo de texto para el contenido de la entrada. Para obtener más información, consulte Captura de entradas de texto .

  • Texto estático

    El texto estático solo se crea mediante Flash Professional. Con ActionScript 3.0 no se pueden crear instancias de texto estático. Sin embargo, se pueden usar clases de ActionScript como StaticText y TextSnapshot para manipular instancias de texto estático existentes. Para obtener más información, consulte Trabajo con texto estático .

Modificación del contenido de un campo de texto

El usuario puede definir texto dinámico asignando una cadena a la propiedad flash.text.TextField.text . Se puede asignar una cadena directamente a la propiedad de la siguiente manera:

myTextField.text = "Hello World";

También se puede asignar a la propiedad text un valor de una variable definida en el script, tal y como se muestra en el siguiente ejemplo:

package 
{ 
    import flash.display.Sprite; 
    import flash.text.*; 
 
    public class TextWithImage extends Sprite 
    { 
        private var myTextBox:TextField = new TextField(); 
        private var myText:String = "Hello World"; 
 
        public function TextWithImage() 
        { 
            addChild(myTextBox); 
            myTextBox.text = myText; 
        } 
    } 
}

Como alternativa, se puede asignar a la propiedad text un valor de una variable remota. Existen tres opciones para cargar valores de texto desde orí­genes remotos:

  • Las clases flash.net.URLLoader y flash.net.URLRequest cargan variables para el texto desde una ubicación local o remota.

  • El atributo FlashVars está incorporado en la página HTML que aloja el archivo SWF y puede incluir valores para variables de texto.

  • La clase flash.net.SharedObject administra el almacenamiento persistente de valores. Para obtener más información, consulte Almacenamiento de datos locales .

Visualización de texto HTML

La clase flash.text.TextField cuenta con una propiedad htmlText que se puede utilizar para identificar la cadena de texto como cadena que contiene etiquetas HTML para aplicar formato al contenido. Tal y como se muestra en el ejemplo siguiente, se debe asignar el valor de cadena a la propiedad htmlText (no a la propiedad text ) para que Flash Player o AIR representen el texto en formato HTML:

var myText:String = "<p>This is <b>some</b> content to <i>render</i> as <u>HTML</u> text.</p>"; 
myTextBox.htmlText = myText;

Flash Player y AIR admiten un subconjunto de etiquetas y entidades HTML para la propiedad htmlText . La descripción de la propiedad flash.text.TextField.htmlText en Referencia de ActionScript 3.0 proporciona información detallada sobre las etiquetas y entidades HTML admitidas.

Una vez designado el contenido mediante la propiedad htmlText , puede utilizar hojas de estilos o la etiqueta textformat para administrar el formato del contenido. Para obtener más información, consulte Formato de texto .

Uso de imágenes en campos de texto

Otra ventaja de mostrar el contenido como texto HTML es que se pueden incluir imágenes en el campo de texto. Se puede hacer referencia a una imagen, local o remota, mediante la etiqueta img y hacer que aparezca dentro del campo de texto asociado.

En el ejemplo siguiente se crea un campo de texto denominado myTextBox y se incluye una imagen JPG de un ojo, almacenada en el mismo directorio que el archivo SWF, dentro del texto mostrado:

package 
{ 
    import flash.display.Sprite; 
    import flash.text.*; 
 
    public class TextWithImage extends Sprite 
    { 
        private var myTextBox:TextField; 
        private var myText:String = "<p>This is <b>some</b> content to <i>test</i> and <i>see</i></p><p><img src='eye.jpg' width='20' height='20'></p><p>what can be rendered.</p><p>You should see an eye image and some <u>HTML</u> text.</p>"; 
 
        public function TextWithImage() 
        { 
            myTextBox.width = 200; 
            myTextBox.height = 200; 
            myTextBox.multiline = true; 
            myTextBox.wordWrap = true; 
            myTextBox.border = true; 
 
            addChild(myTextBox); 
            myTextBox.htmlText = myText; 
        } 
    } 
}

La etiqueta img es compatible con archivos JPEG, GIF, PNG y SWF.

Desplazamiento de texto en un campo de texto

En muchos casos, el texto puede ser más largo que el campo de texto que lo muestra. O bien, se puede tener un campo de entrada que permita a un usuario introducir más texto que el que se puede mostrar de una sola vez. Se pueden utilizar las propiedades relacionadas con el desplazamiento de la clase flash.text.TextField para administrar contenido extenso, tanto verticalmente como horizontalmente.

Entre las propiedades relacionadas con el desplazamiento se incluyen TextField.scrollV , TextField.scrollH , maxScrollV y maxScrollH . Estas propiedades pueden utilizarse para responder a eventos, como un clic de ratón o una pulsación de tecla.

En el ejemplo siguiente se crea un campo de texto con un tamaño establecido y que contiene más texto que el campo puede mostrar de una sola vez. A medida que el usuario hace clic en el campo de texto, el texto se desplaza verticalmente.

package 
{ 
    import flash.display.Sprite; 
    import flash.text.*; 
    import flash.events.MouseEvent; 
 
    public class TextScrollExample extends Sprite 
    { 
        private var myTextBox:TextField = new TextField(); 
        private var myText:String = "Hello world and welcome to the show. It's really nice to meet you. Take your coat off and stay a while. OK, show is over. Hope you had fun. You can go home now. Don't forget to tip your waiter. There are mints in the bowl by the door. Thank you. Please come again."; 
 
        public function TextScrollExample() 
        { 
            myTextBox.text = myText; 
            myTextBox.width = 200; 
            myTextBox.height = 50; 
            myTextBox.multiline = true; 
            myTextBox.wordWrap = true; 
            myTextBox.background = true; 
            myTextBox.border = true; 
 
            var format:TextFormat = new TextFormat(); 
            format.font = "Verdana"; 
            format.color = 0xFF0000; 
            format.size = 10; 
 
            myTextBox.defaultTextFormat = format; 
            addChild(myTextBox); 
            myTextBox.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownScroll); 
        } 
 
        public function mouseDownScroll(event:MouseEvent):void 
        { 
            myTextBox.scrollV++; 
        } 
    } 
}