StyleSheet

Paquete	flash.text
Clase	public dynamic class StyleSheet
Herencia	StyleSheet EventDispatcher Object

Versión del lenguaje:

ActionScript 3.0

Versiones de motor de ejecución:

AIR 1.0, Flash Player 9, Flash Lite 4

La clase StyleSheet permite crear un objeto StyleSheet que contenga reglas de formato de texto, como tamaño de fuente, color y otros estilos. Posteriormente podrá aplicar estilos definidos mediante una hoja de estilos a un objeto TextField que contenga texto con formato HTML o XML. Se aplicará formato automáticamente al texto del objeto TextField conforme a los estilos de las etiquetas definidas por el objeto StyleSheet. Puede utilizar estilos de texto para definir nuevas etiquetas de formato, redefinir las etiquetas HTML incorporadas o crear clases de estilos para aplicarlas a determinadas etiquetas HTML.

Para aplicar estilos a un objeto TextField, asigne el objeto StyleSheet a la propiedad styleSheet de un objeto TextField.

Nota: los campos de texto con hojas de estilos no son editables. Es decir, un campo de texto con la propiedad type definida como TextFieldType.INPUT aplica el objeto StyleSheet al texto predeterminado del campo de texto, pero el usuario ya no podrá editar el contenido. Utilice la clase TextFormat para asignar estilos a los campos de texto de entrada.

Flash Player admite un subconjunto de propiedades en la especificación CSS1 original (www.w3.org/TR/REC-CSS1). En la tabla siguiente, se muestran las propiedades CSS y los valores admitidos, así como los nombres de propiedad de ActionScript correspondientes. Cada nombre de propiedad de ActionScript se deriva del nombre de propiedad CSS correspondiente; si el nombre contiene un guión, éste se omite y el carácter siguiente irá en mayúscula.

Propiedad CSS	Propiedad de ActionScript	Uso y valores admitidos
`color`	`color`	Sólo se admiten valores de color hexadecimales. No se admiten los nombres de los colores (como `blue`). Los colores se escriben en el siguiente formato: `#FF0000`.
`display`	`display`	Los valores admitidos son `inline`, `block` y `none`.
`font-family`	`fontFamily`	Lista de fuentes que se deben utilizar, separadas por comas, en orden descendente de conveniencia. Se puede utilizar cualquier nombre de familia de fuentes. Si especifica un nombre de fuente genérico, se convertirá a una fuente de dispositivo adecuada. Las siguientes conversiones de fuentes se encuentran disponibles: `mono` se convierte a `_typewriter`, `sans-serif` se convierte a `_sans` y `serif` se convierte a `_serif`.
`font-size`	`fontSize`	Sólo se utiliza la parte numérica del valor. Las unidades (px, pt) no se analizan; los píxeles y los puntos son equivalentes.
`font-style`	`fontStyle`	Los valores reconocidos son `normal` e `italic`.
`font-weight`	`fontWeight`	Los valores reconocidos son `normal` y `bold`.
`kerning`	`kerning`	Los valores reconocidos son `true` y `false`. El kerning sólo se admite en las fuentes incorporadas. Algunas fuentes, como Courier New, no admiten el ajuste entre caracteres. La propiedad kerning sólo puede utilizarse en archivos SWF creados en Windows; no en archivos SWF creados en Macintosh. Sin embargo, estos archivos SWF pueden reproducirse en versiones que no son para Windows de Flash Player y se aplica el ajuste entre caracteres.
`leading`	`leading`	Cantidad de espacio distribuido uniformemente entre líneas. El valor especifica el número de píxeles que se añaden después de cada línea. Un valor negativo condensa el espacio entre líneas. Sólo se utiliza la parte numérica del valor. Las unidades (px, pt) no se analizan; los píxeles y los puntos son equivalentes.
`letter-spacing`	`letterSpacing`	Cantidad de espacio distribuido uniformemente entre caracteres. El valor especifica el número de píxeles que se añaden después de cada carácter. Un valor negativo condensa el espacio entre caracteres. Sólo se utiliza la parte numérica del valor. Las unidades (px, pt) no se analizan; los píxeles y los puntos son equivalentes.
`margin-left`	`marginLeft`	Sólo se utiliza la parte numérica del valor. Las unidades (px, pt) no se analizan; los píxeles y los puntos son equivalentes.
`margin-right`	`marginRight`	Sólo se utiliza la parte numérica del valor. Las unidades (px, pt) no se analizan; los píxeles y los puntos son equivalentes.
`text-align`	`textAlign`	Los valores reconocidos son `left`, `center`, `right` y `justify`.
`text-decoration`	`textDecoration`	Los valores reconocidos son `none` y `underline`.
`text-indent`	`textIndent`	Sólo se utiliza la parte numérica del valor. Las unidades (px, pt) no se analizan; los píxeles y los puntos son equivalentes.

Ver los ejemplos

Elementos de API relacionados

flash.text.TextField

Propiedades públicas

Ocultar propiedades públicas heredadas

Mostrar propiedades públicas heredadas

	Propiedad		Definido por
		constructor : Object Una referencia a la clase de objeto o función constructora para una instancia de objeto determinada.	Object
		styleNames : Array [solo lectura] Un conjunto que contiene los nombres (cadenas) de todos los estilos registrados en esta hoja de estilos.	StyleSheet

Métodos públicos

Ocultar métodos públicos heredados

Mostrar métodos públicos heredados

	Método		Definido por
		StyleSheet() Crea un nuevo objeto StyleSheet.	StyleSheet
		addEventListener(type:String, listener:Function, useCapture:Boolean = false, priority:int = 0, useWeakReference:Boolean = false):void Registra un objeto de detector de eventos con un objeto EventDispatcher, de modo que el detector reciba la notificación de un evento.	EventDispatcher
		clear():void Elimina todos los estilos del objeto de hoja de estilos.	StyleSheet
		dispatchEvent(event:Event):Boolean Distribuye un evento en el flujo del evento.	EventDispatcher
		getStyle(styleName:String):Object Devuelve una copia del objeto de estilo asociado al estilo llamado	StyleSheet
		hasEventListener(type:String):Boolean Comprueba si el objeto EventDispatcher tiene detectores registrados para un tipo concreto de evento.	EventDispatcher
		hasOwnProperty(name:String):Boolean Indica si un objeto tiene definida una propiedad especificada.	Object
		isPrototypeOf(theClass:Object):Boolean Indica si hay una instancia de la clase Object en la cadena de prototipo del objeto especificado como parámetro.	Object
		parseCSS(CSSText:String):void Analiza la CSS de CSSText y carga junto a ésta la hoja de estilos.	StyleSheet
		propertyIsEnumerable(name:String):Boolean Indica si existe la propiedad especificada y si es enumerable.	Object
		removeEventListener(type:String, listener:Function, useCapture:Boolean = false):void Elimina un detector del objeto EventDispatcher.	EventDispatcher
		setPropertyIsEnumerable(name:String, isEnum:Boolean = true):void Establece la disponibilidad de una propiedad dinámica para operaciones de bucle.	Object
		setStyle(styleName:String, styleObject:Object):void Añade un nuevo estilo con el nombre especificado en el objeto de hoja de estilos.	StyleSheet
		toLocaleString():String Devuelve la representación de cadena de este objeto, con formato según las convenciones específicas de configuración regional.	Object
		toString():String Devuelve la representación de cadena del objeto especificado.	Object
		transform(formatObject:Object):flash.text:TextFormat Amplía la capacidad de análisis de la CSS.	StyleSheet
		valueOf():Object Devuelve el valor simple del objeto especificado.	Object
		willTrigger(type:String):Boolean Comprueba si hay registrado un detector de eventos con este objeto EventDispatcher o con cualquiera de sus ascendientes para el tipo de evento concreto.	EventDispatcher

Eventos

Haga clic para obtener más información sobre los eventos

Ocultar eventos heredados

Mostrar eventos heredados

	Evento		Resumen	Definido por
		activate	[evento broadcast] Se distribuye cuando Flash Player o AIR pasan a estar activos.	EventDispatcher
		deactivate	[evento broadcast] Se distribuye cuando Flash Player o de AIR pasan a estar inactivos.	EventDispatcher

Información sobre propiedades

styleNames

propiedad

styleNames:Array [solo lectura]

Versión del lenguaje:

ActionScript 3.0

Versiones de motor de ejecución:

AIR 1.0, Flash Player 9, Flash Lite 4

Un conjunto que contiene los nombres (cadenas) de todos los estilos registrados en esta hoja de estilos.

Implementación
public function get styleNames():Array

Información sobre constructores

()

Información sobre

public function StyleSheet()

Versión del lenguaje:

ActionScript 3.0

Versiones de motor de ejecución:

AIR 1.0, Flash Player 9, Flash Lite 4

Crea un nuevo objeto StyleSheet.

Elementos de API relacionados

flash.text.StyleSheet.getStyle()

Información sobre métodos

clear

()

método

public function clear():void

Versión del lenguaje:

ActionScript 3.0

Versiones de motor de ejecución:

AIR 1.0, Flash Player 9, Flash Lite 4

Elimina todos los estilos del objeto de hoja de estilos.

getStyle

()

método

public function getStyle(styleName:String):Object

Versión del lenguaje:

ActionScript 3.0

Versiones de motor de ejecución:

AIR 1.0, Flash Player 9, Flash Lite 4

Devuelve una copia del objeto de estilo asociado al estilo denominado styleName. Si no hay ningún objeto de estilo asociado a styleName, se devuelve null.

Parámetros

styleName:String — Una cadena que especifica el nombre del estilo que se va a recuperar.

Valor devuelto

Object — Un objeto.

Elementos de API relacionados

flash.text.StyleSheet.setStyle()

Ejemplo
Cómo utilizar este ejemplo
Consulte el ejemplo de los métodos parseCSS() o transform() para ver ilustraciones sobre cómo utilizar el método getStyle().

parseCSS

()

método

public function parseCSS(CSSText:String):void

Versión del lenguaje:

ActionScript 3.0

Versiones de motor de ejecución:

AIR 1.0, Flash Player 9, Flash Lite 4

Analiza la CSS de CSSText y carga junto a ésta la hoja de estilos. Si un estilo de CSSText ya se encuentra en styleSheet, se conservarán las propiedades de styleSheet y sólo se añadirán o modificarán las de CSSText en styleSheet.

Para ampliar la capacidad de análisis de CSS, puede sustituir este método creando una subclase de la clase StyleSheet.

Parámetros

CSSText:String — El texto CSS que se va a analizar (una cadena).

Ejemplo ( Cómo utilizar este ejemplo )

En el ejemplo siguiente, cuando un usuario hace clic en el archivo de texto, los estilos CSS, cargado desde un archivo, se aplican al contenido.

En el constructor, se crea un campo de texto multilínea y su contenido se establece en una cadena con formato HTML. (El encabezado HTML y las etiquetas span no se procesan antes de que se aplique el estilo CSS.) Se crea un objeto URLRequest para identificar la ubicación del archivo CSS; para este ejemplo, el archivo CSS se encuentra en el mismo directorio que el archivo SWF. El archivo se carga con un objeto URLLoader. Hay dos detectores de eventos añadidos para el objeto URLLoader loader. Si se produce un error de entrada o salida, se invoca el método errorHandler(), que muestra un mensaje de error en el campo de texto. Una vez recibidos todos los datos y colocados en la propiedad data del objeto URLLoader loader, se invoca el método loaderCompleteHandler(). Este método analiza los estilos CSS de los datos cargados del archivo y rellena el objeto StyleSheet sheet con las definiciones de estilos.

Cuando el usuario hace clic en el campo de texto, se llama al método clickHandler(). La sentencia if del método clickHandler() realiza la comprobación para asegurarse de que la carga del archivo haya finalizado antes de aplicar la hoja de estilos al campo de texto. Para que surta efecto la hoja de estilos, la propiedad htmlText se debe reasignar con el contenido después de que se asigne la hoja de estilos al campo de texto. Los valores de propiedad font-family y color CSS para la etiqueta de encabezado también se añaden al contenido del campo de texto. (Los valores de estas propiedades serán "undefined" si los valores de la hoja de estilo no están aplicadas.)

A continuación se muestra el ejemplo de un contenido del archivo CSS que se puede utilizar con este ejemplo. Antes de ejecutar este ejemplo, cree un archivo de texto, cópiele el siguiente contenido CSS, guárdelo con el nombre de archivo test.css y colóquelo en el mismo directorio que el archivo SWF.

   p {
      font-family: Times New Roman, Times, _serif;
      font-size: 14;
       font-Style: italic;
        margin-left: 10;  
   }
   h1 {
      font-family: Arial, Helvetica, _sans;
      font-size: 20;
      font-weight: bold;
   }
   .bluetext {
      color: #0000CC;
   }

package {
    import flash.display.Sprite;
    import flash.net.URLLoader;
    import flash.net.URLRequest;
    import flash.text.StyleSheet;
    import flash.text.TextField;
    import flash.text.TextFieldAutoSize;
    import flash.events.IOErrorEvent;
    import flash.events.Event;
    import flash.events.MouseEvent;

    public class StyleSheet_parseCSSExample extends Sprite {
        private var loader:URLLoader = new URLLoader();
        private var field:TextField = new TextField();
        private var exampleText:String = "<h1>This is a headline</h1>"
                    + "<p>This is a line of text. <span class='bluetext'>" 
                    + "This line of text is colored blue.</span></p>";
        private var sheet:StyleSheet = new StyleSheet();
        private var cssReady:Boolean = false;

        public function StyleSheet_parseCSSExample() {
            field.x = 10;
            field.y = 10;
            field.background = true;
            field.multiline = true;
            field.autoSize = TextFieldAutoSize.LEFT;
            field.htmlText = exampleText;

            field.addEventListener(MouseEvent.CLICK, clickHandler);
            
            addChild(field);
            
            var req:URLRequest = new URLRequest("test.css");
            loader.load(req);

            loader.addEventListener(IOErrorEvent.IO_ERROR, errorHandler);
            loader.addEventListener(Event.COMPLETE, loaderCompleteHandler);
        }

        public function errorHandler(e:IOErrorEvent):void {
            field.htmlText = "Couldn't load the style sheet file.";
        }

        public function loaderCompleteHandler(event:Event):void {
            sheet.parseCSS(loader.data);
            cssReady = true;
        }

        public function clickHandler(e:MouseEvent):void {

            if (cssReady) {
                field.styleSheet = sheet;
                field.htmlText = exampleText;
                
                var style:Object = sheet.getStyle("h1");
                field.htmlText += "<p>Headline font-family is: " + style.fontFamily + "</p>";
                field.htmlText += "<p>Headline color is: " + style.color + "</p>";  

            } else {
                field.htmlText = "Couldn't apply the CSS styles.";
            }
        }
    }
}

setStyle

()

método

public function setStyle(styleName:String, styleObject:Object):void

Versión del lenguaje:

ActionScript 3.0

Versiones de motor de ejecución:

AIR 1.0, Flash Player 9, Flash Lite 4

Añade un nuevo estilo con el nombre especificado en el objeto de hoja de estilos. Si no hay ningún estilo con dicho nombre en la hoja de estilos, se añadirá. Si ya hay algún estilo con este nombre en la hoja de estilos, se sustituirá. Si el parámetro styleObject tiene el valor null, se eliminará el estilo indicado.

Flash Player crea una copia del objeto de estilo que se pasa a este método.

Para ver una lista de los estilos admitidos, consulte la tabla en la descripción de la clase StyleSheet.

Parámetros

	`styleName:String` — Una cadena que especifica el nombre del estilo que se va añadir a la hoja de estilos.

	`styleObject:Object` — Objeto que describe el estilo o `null`.

transform

()

método

public function transform(formatObject:Object):flash.text:TextFormat

Versión del lenguaje:

ActionScript 3.0

Versiones de motor de ejecución:

AIR 1.0, Flash Player 9, Flash Lite 4

Amplía la capacidad de análisis de la CSS. Los desarrolladores avanzados pueden sustituir este método ampliando la clase StyleSheet.

Parámetros

formatObject:Object — Un objeto que describe el estilo, incluye reglas de estilo como propiedades del objeto o null.

Valor devuelto

flash.text:TextFormat — Objeto TextFormat que contiene el resultado de la asignación de reglas de CSS a las propiedades de formato de texto.

Elementos de API relacionados

flash.text.TextFormat

Ejemplo ( Cómo utilizar este ejemplo )

Este ejemplo utiliza el método transform() para aplicar un estilo de un archivo CSS a un objeto TextFormat para un campo de texto.

Los estilos CSS se utilizan generalmente para dar formato al contenido HTML. Sin embargo, al usar el método transform() de un objeto StyleSheet, se pueden asignar estilos CSS específicos a un objeto TextFormat y aplicarse después al campo de texto.

Los objetos URLRequest y URLLoader se utilizan para cargar el archivo CSS. Se añade un detector de eventos al evento Event.COMPLETE, que tiene lugar una vez que se reciben todos los datos y se colocan en la propiedad de datos del objeto URLLoader loader. El método loaderCompleteHandler() analiza después el CSS de los datos cargados del archivo y rellena el objeto StyleSheet sheet con los estilos. El método getStyle() de la hoja de estilos recupera los estilos de párrafo HTML, que se asignan después al objeto TextFormat cssFormat utilizando el método transform() de la hoja de estilos. Finalmente, el formato de texto predeterminado del campo de texto inputField se establece con el nuevo formato de texto cssFormat.

package {
    import flash.display.Sprite;
    import flash.net.URLLoader;
    import flash.net.URLRequest;
    import flash.text.StyleSheet;
    import flash.text.TextField;
    import flash.text.TextFormat;
    import flash.text.TextFieldType;
    import flash.events.IOErrorEvent;
    import flash.events.Event;

    public class StyleSheet_transformExample extends Sprite {
        private var loader:URLLoader = new URLLoader();
        private var inputField:TextField = new TextField();
        private var sheet:StyleSheet = new StyleSheet();

        public function StyleSheet_transformExample() {
            inputField.x = 10;
            inputField.y = 10;
            inputField.background = true;
            inputField.width = 300;
            inputField.height = 200;
            inputField.wordWrap = true;
            inputField.multiline = true;    
            inputField.type = TextFieldType.INPUT;

            addChild(inputField);
            
            var req:URLRequest = new URLRequest("test.css");
            loader.load(req);

            loader.addEventListener(IOErrorEvent.IO_ERROR, errorHandler);
            loader.addEventListener(Event.COMPLETE, loaderCompleteHandler);
        }

        public function errorHandler(e:IOErrorEvent):void {
            inputField.htmlText = "Couldn't load the style sheet file.";
        }

        public function loaderCompleteHandler(event:Event):void {
            var cssFormat:TextFormat = new TextFormat();
            sheet.parseCSS(loader.data);
            var style:Object = sheet.getStyle("p");
            cssFormat = sheet.transform(style);
            inputField.defaultTextFormat = cssFormat;
        }
    }
}

Ejemplos Cómo utilizar este ejemplo

StyleSheetExample.as

En el ejemplo siguiente, se crea una nueva hoja de estilos y se asignan tratamientos de fuente negrita y de color rojo al estilo del encabezado.

 
package {
    import flash.display.Sprite;
    import flash.text.StyleSheet;
    import flash.text.TextField;
    import flash.text.TextFieldAutoSize;

    public class StyleSheetExample extends Sprite {

        public function StyleSheetExample() {
            var style:StyleSheet = new StyleSheet();

            var heading:Object = new Object();
            heading.fontWeight = "bold";
            heading.color = "#FF0000";

            var body:Object = new Object();
            body.fontStyle = "italic";

            style.setStyle(".heading", heading);
            style.setStyle("body", body);

            var label:TextField = new TextField();
            label.styleSheet = style;
            label.htmlText = "<body><span class='heading'>Hello </span>World...</body>";
            addChild(label);
        }
    }
}

Avisos legales | Política de privacidad en línea

StyleSheet - AS3

Paquetesx

Elementos del lenguaje

Apéndices

Paquete flash.text

styleNames

StyleSheet

clear

getStyle

parseCSS

setStyle

transform