Ajuste de los colores de DisplayObject

Contenido [Ocultar]
Configuracin de los valores de color a
travs del cdigo
Modificacin de efectos de color y brillo
a travs del cdigo




Se pueden utilizar los mtodos de la clase ColorTransform (flash.geom.ColorTransform) para
ajustar el color de un objeto de visualizacin. Cada objeto de visualizacin tiene una
propiedad transform, que es una instancia de la clase Transform y que contiene
informacin sobre diversas transformaciones que se aplican al objeto de visualizacin (como
la rotacin, los cambios en la escala o posicin, entre otros). Adems de esta informacin
sobre las transformaciones geomtricas, la clase Transform tambin incluye una propiedad
colorTransform, que es una instancia de la clase ColorTransform y que permite realizar
ajustes de color en el objeto de visualizacin. Para acceder a la informacin sobre
transformacin de color de un objeto de visualizacin, se puede utilizar cdigo como el
siguiente:
var colorInfo:ColorTransform = myDisplayObject.transform.colorTransform;
Una vez creada una instancia de ColorTransform, se pueden leer sus valores de propiedades
para saber cules son las transformaciones de color que ya se han aplicado o se pueden definir
dichos valores para realizar cambios de color en el objeto de visualizacin. Para actualizar el
objeto de visualizacin despus de haber realizado cambios, es necesario reasignar la
instancia de ColorTransform a la propiedad transform.colorTransform.
var colorInfo:ColorTransform = my DisplayObject.transform.colorTransform;

// Make some color transformations here.

// Commit the change.
myDisplayObject.transform.colorTransform = colorInfo;
Configuracin de los valores de color a travs del cdigo
La propiedad color de la clase ColorTransform puede utilizarse para asignar un valor
especfico de color rojo, verde, azul (RGB) al objeto de visualizacin. En el ejemplo siguiente
se usa la propiedad color para cambiar a azul el color del objeto de visualizacin
denominado square, cuando el usuario haga clic en un botn denominado blueBtn:
// square is a display object on the Stage.
// blueBtn, redBtn, greenBtn, and blackBtn are buttons on the Stage.

import flash.events.MouseEvent;
import flash.geom.ColorTransform;

// Get access to the ColorTransform instance associated with square.
var colorInfo:ColorTransform = square.transform.colorTransform;

// This function is called when blueBtn is clicked.
function makeBlue(event:MouseEvent):void
{
// Set the color of the ColorTransform object.
colorInfo.color = 0x003399;
// apply the change to the display object
square.transform.colorTransform = colorInfo;
}

blueBtn.addEventListener(MouseEvent.CLICK, makeBlue);
Cuando se cambia el color de un objeto de visualizacin a travs de la propiedad color, se
cambia completamente el color de todo el objeto, independientemente de que el objeto tuviera
varios colores. Por ejemplo, si hay un objeto de visualizacin que contiene un crculo verde
con texto negro encima, al definir como una sombra de rojo la propiedad color de la
instancia de ColorTransform asociada a dicho objeto, todo el objeto, crculo y texto, se
volver rojo (de modo que el texto ya no podr distinguirse del resto del objeto).
Modificacin de efectos de color y brillo a travs del cdigo
Supongamos que tiene un objeto de visualizacin con varios colores (por ejemplo, una foto
digital) y no desea modificar los colores de todo el objeto, sino nicamente ajustar el color de
un objeto de visualizacin basndose en los colores existentes. En esta situacin, la clase
ColorTransform incluye una serie de propiedades de multiplicador y desplazamiento que
pueden utilizarse para realizar este tipo de ajuste. Las propiedades de multiplicador,
denominadas redMultiplier, greenMultiplier, blueMultiplier y
alphaMultiplier, funcionan como filtros fotogrficos de color (o gafas de sol de color),
ya que amplifican o reducen determinados colores en el objeto de visualizacin. Las
propiedades de desplazamiento (redOffset, greenOffset, blueOffset y
alphaOffset) pueden utilizarse para aadir cantidades adicionales de un determinado
color al objeto o para especificar el valor mnimo que puede tener un determinado color.
Estas propiedades de multiplicador y desplazamiento son idnticas a la configuracin
avanzada de color disponible para los smbolos de clip de pelcula en la herramienta de
edicin de Flash que se muestra al elegir Avanzado en el men emergente Color del inspector
de propiedades.
En el cdigo siguiente se carga una imagen JPEG y se aplica una transformacin de color que
modifica los canales rojo y verde a medida que el puntero del ratn se mueve por los ejes x e
y. En este caso, como no se especifica ningn valor de desplazamiento, el valor de cada uno
de los canales de color mostrados en pantalla ser un porcentaje del valor de color original de
la imagen, lo que significa que la mayora de rojo y verde mostrado en cualquier pxel ser la
cantidad original de rojo o verde de dicho pxel.
import flash.display.Loader;
import flash.events.MouseEvent;
import flash.geom.Transform;
import flash.geom.ColorTransform;
import flash.net.URLRequest;

// Load an image onto the Stage.
var loader:Loader = new Loader();
var url:URLRequest = new
URLRequest("http://www.helpexamples.com/flash/images/image1.jpg");
loader.load(url);
this.addChild(loader);

// This function is called when the mouse moves over the loaded image.
function adjustColor(event:MouseEvent):void
{
// Access the ColorTransform object for the Loader (containing the
image)
var colorTransformer:ColorTransform = loader.transform.colorTransform;

// Set the red and green multipliers according to the mouse position.
// The red value ranges from 0% (no red) when the cursor is at the left
// to 100% red (normal image appearance) when the cursor is at the
right.
// The same applies to the green channel, except it's controlled by the
// position of the mouse in the y axis.
colorTransformer.redMultiplier = (loader.mouseX / loader.width) * 1;
colorTransformer.greenMultiplier = (loader.mouseY / loader.height) * 1;

// Apply the changes to the display object.
loader.transform.colorTransform = colorTransformer;
}

loader.addEventListener(MouseEvent.MOUSE_MOVE, adjustColor);


Lo primeros que tenemos que hacer antes de programar es crear un clip de pelicula llamado
cuadro. En el dibujaremos un cuadro cualquiera con algn relleno. Luego crearemos un boton
cualquiera, lo llamaremos boton como nombre de instancia.

En la primera parte del cdigo lo que hacemos es crear una funcin llamada coloraleatorio.
En esta funcin lo que hacemos es crear un color aleatorio que despus asignaremos al objeto
cuadro.

La ultima parte del cdigo, hace que cada vez que se presiona el boton se ejecuta la funcin
coloraleatorio cambiando de color.
Cdigo :
coloraleatorio = function (){
micolor = Math.round( Math.random()*0xFFFFFF );
miobjeto = new Color (_root.cuadro);
miobjeto.setRGB(micolor);
}
coloraleatorio();
boton.onRelease=function(){
coloraleatorio();
}


La clase ColorTransform permite ajustar el color de los objetos de visualizacin. Este ejemplo
muestra como cambiar el color de un MovieClip utilizando el componente ColorPicker de
Flash.

1.

package{
2.


3.

import flash.display.MovieClip;
4.


5.

public class CambiarColor extends MovieClip{
6.


7.

//Importo las clases necesarias para trabajar con
el ColorPicker y la clase colorTransform
8.

import fl.controls.ColorPicker;
9.

import fl.events.ColorPickerEvent;
10.

import flash.geom.*;
11.


12.

public function CambiarColor(){
13.

//Aado un listener al Componente de
ColorPicker que tengo en el escenario con el
14.

//nombre de "Selector_cp"
15.


Selector_cp.addEventListener(ColorPickerEvent.CHANGE,
cambioColor);
16.

}
17.


18.

function
cambioColor(e:ColorPickerEvent):void {
19.

//Cuando se reproduce el evento
CHANGE, se ejecuta esta funcin.
20.

//Creo una instancia de
ColorTransform
21.

var newColorTransform:ColorTransform
= Cuadrado_mc.transform.colorTransform;
22.

//Le pongo el color que viene en el
evento (el que se ha seleccioando en el colorPicker)
23.

newColorTransform.color = e.color;
24.

//Aplico el colorTransform al objeto
que quiero cambiar de color
25.

Cuadrado_mc.transform.colorTransform
= newColorTransform;
26.

}
27.


28.

}
29.


30.

}


Modificar valores de una imagen con la
clase AdjustColor
14
Etiquetas: AdjustColor

Las clase AdjustColor permite crear un filtro para modificar las propiedades brillo, contraste,
matiz y saturacin de cualquier elemento de visualizacin. Esto nos permite, por ejemplo,
pasar una imagen a blanco y negro (poniendo la saturacin al mnimo(-100)) o ajustar los
colores de una foto.
La clase AdjustColor est disponible para Flash Player 9 o superior.
El cdigo comentado y los fuentes a continuacin:

setClipboard: como copiar un texto al
portapapeles desde Flash
5
Etiquetas: System setClipboard
Con esta linea podemos copiar un texto al portapapeles del usuario desde Flash. La sintaxis es
igual para Actionscript 2.0 y Actionscript 3.0:
1.


2.

System.setClipboard("El texto que queremos copiar");
3.


Es muy til por ejemplo si tenemos una web que genera cdigos o urls personalizadas y
queremos dar al usuario la oportunidad de copiarlas copn un botn.

Actionscript 3: Formatear nmeros en
tiempo real
2
Etiquetas: Event.CHANGE TextEvent.INPUT focus setSelection

Lo primero que tenemos que hacer para ir formateando el texto mientras el usuario escribe es
aadir un listener para el evento change al campo de texto:
1.


2.

Texto_txt.addEventListener(Event.CHANGE,textoDentro);
3.


Es importante que utilicemos el evento Event.CHANGE en lugar del TextEvent.INPUT, ya
que el segundo se distribuye antes de que el campo se haya actualizado. Es decir, que si
escribimos una "a" en el campo, flash lanza el evento TextEvent.INPUT, actualiza el valor
.text del campo y lanza el eveno Event.CHANGE.
Despus creamos la funcin que recoja el evento:
1.


2.
function textoDentro(e:Event):void {
3.

e.target.text =
formatear(e.target.text.split(".").join(""));
4.

e.target.setSelection(e.target.text.length,
e.target.text.length);
5.

}
6.


En esta funcin hacemos dos cosas. Primero cogemos el texto del campo, le quitamos los
puntos y lo mandamos a la funcin que lo va a formatear:
1.


2.

e.target.text =
formatear(e.target.text.split(".").join(""));
3.


Despus ponemos el cursor al final del campo para que el usuario pueda seguir escribiendo al
final del nmero:
1.


2.

e.target.setSelection(e.target.text.length,
e.target.text.length);
3.


La funcin que evala el nmero y le pone los puntos es esta:
1.


2.
function formatear(strNumber:String):String {
3.

while (strNumber.substr(0, 1) == "0") {
4.

strNumber = strNumber.substr(1);
5.

}
6.

var dollar_array:Array = new Array();
7.

var start:Number;
8.

var end:Number = strNumber.length;
9.

while (end > 0) {
10.

start = Math.max(end - 3, 0);
11.

dollar_array.unshift(strNumber.slice(start,
end));
12.

end = start;
13.

}
14.

return dollar_array.join(".");
15.

}
16.



Habilitar suavizado en el componente
FLVPlayback
Etiquetas: FLVPlayback
Esta linea sirve para habilitar el suavizado (smoothing) en un componente FLVPlayback.
Aunque el rendimiento se resiente bastante, puede ser til si tenemos que reescalar el vdeo o
este es de muy poca calidad
1.


2.
//Suponiendo que el FLVPlayback se llama "player"
3.

player.getVideoPlayer(player.activeVideoPlayerIndex).smoo
thing = true;
4.



Envio de email con adjuntos en AS3 y PHP
Etiquetas: FileReference FileFilter URLRequest
Este ejemplo muestra como hacer un formulario en Flash (Actionscript 3.0) con envio de
adjuntos.
El esquema bsico es que hacemos una subida normal con FileReference, y en el
URLRequest de la subida incluimos las variables que queramos adjuntar en el formulario:
1.


2.
var request:URLRequest = new URLRequest(url);
3.

request.method = URLRequestMethod.POST;
4.

request.data = new URLVariables();
5.

request.data.nombre = Nombre_txt.text;
6.

request.data.destinatario = Destinatario_txt.text;
7.

subidor.upload(request);
8.


Estas variables las recogemos despus en el PHP con el nombre que les hayamos puesto con:
1.


2.

$_REQUEST[nombre]
3.


En el php tenemos el cdigo tpico de una subida, y una vez terminada pasamos a montar el
correo electrnico.
Dejo los fuentes con el fla, la clase Formulario, y el php para la subida.
El cdigo php es una versin adaptada del que podis encontrar en esta pgina

Comprobacin de email con expresiones
regulares
1
Etiquetas: RegExp
Esta funcin utiliza una expresin regular para comprobar si una cadena es un email vlido.
La expresin regular no la he construido yo, pero no puedo citar la fuente porque la he visto
en muchos foros de actionscript, en castellano e ingls. La funcin en cuestin es esta:
1.


2.
function emailValido(email:String):Boolean{
3.

var emailExpression:RegExp = /^[a-z][\w.-]+@\w[\w.-
]+\.[\w.-]*[a-z][a-z]$/i;
4.

return emailExpression.test(email);
5.

}
6.


Y estos seran algunos resultados:
@hotmail.com: false
pepe@hotmail.: false
paco@hotmail.hola.com: true
www.hotmail.com: false
paco@hola@hotmail.com: false
carmen@hotmail.com: true

Actionscript 3.0: memoria utilizada
1
Etiquetas: System totalMemory
Podemos comprobar cantidad de memoria utilizada por Flash Player mediante la propiedad
System.totalMemory, que devuelve el valor en bytes.
Por ejemplo, si queremos ver el valor en KBs de la memoria utilizada por nuestra aplicacin,
pondramos:
1.


2.

import flash.system.System;
3.


4.

trace(System.totalMemory / 1024 + " KBs")

Efecto lupa en Actionscript 3.0
4
Etiquetas: BitmapData Bitmap smoothing mask drawCircle

En este ejemplo voy a tratar de explicar como se hace el "Efecto lupa" en Flash, con
Actionscript 3.0.
Para simplificar voy a explicar la teoria basndome en una imagen que tengo en un
MovieClip el escenario. Por supuesto esto se puede modificar para cargar imgenes
externamente o como se necesite.
Los pasos que tenemos que seguir para crear el "efecto lupa" son estos:
-Crear una copia del MovieClip en BitmapData, y ponerla por encima a una escala mayor
que el original:
1.


2.
//Creo un pantallazo del clip, lo pongo con una escala ==
zoom
3.
var myBitmapData:BitmapData = new BitmapData(clip.width,
clip.height);
4.

myBitmapData.draw(clip);
5.

var bmp:Bitmap = new Bitmap(myBitmapData);
6.

bmp.smoothing = true;
7.

contenedor.addChild(bmp);
8.

contenedor.scaleX = contenedor.scaleY = zoom;
9.

addChild(contenedor);
-Poner a la copia una mscara circular, de manera que solo se vea el trozo de imgen tapado
por la mscara:
1.


2.
//Le pongo una mascara del tamao t al contenedor
3.

mascara.graphics.beginFill(0x000000, 1);
4.

mascara.graphics.drawCircle(0, 0, t);
5.

contenedor.mask = mascara;
6.

addChild(mascara);
7.


-Aadimos un evento enterframe. Dentro de la funcin del evento vamos a mover la mscara
siguiendo al ratn, y a recolocar la "copia grande":
1.


2.

addEventListener(Event.ENTER_FRAME,renderizar)
3.


En la funcin del evento tenemos que mover la mscara para que siga al ratn, y recolocar la
imagen grande para que el trozo que se v sea el que corresponde a la imagen pequea. La
funcin es cuestin es esta:
1.


2.

private function renderizar(e:Event):void {
3.

//Calculo el porcentaje que tengo que mover el
pantallazo
4.

var porcentajeX = clip.mouseX / clip.width;
5.

var porcentajeY = clip.mouseY / clip.height;
6.

//Recoloco el contenedor
7.

contenedor.x = -(contenedor.width - clip.width) *
porcentajeX
8.

contenedor.y = -(contenedor.height - clip.height) *
porcentajeY
9.

//Muevo la mascara
10.

mascara.x = escenario.mouseX;
11.

mascara.y = escenario.mouseY;
12.

}
13.


Adjunto fuentes con todos los materiales, por si queda alguna duda.

ActionScript 3.0: La propiedad
mouseChildren
2
Etiquetas: mouseChildren
Una de las trampas que me encontr cunado empec con Actionscript 3.0 era esta:
-Creaba un MovieClip con un campo de texto dinmico dentro (por ejemplo para el botn de
un men).
-Le aada un evento de ratn y ponia su propiedad buttonMode como true.
Resultado: no se vea el handCursor (la mano tpica al hacer over sobre un botn) cuando
pona el ratn encima.
En aquel momento, para solucionar el inconveniente (estaba haciendo unos cambios delante
del cliente), puse un botn transparente dentro del MovieClip, por encima del resto de
elementos, de tal manera que al hacer over sobre el clip se hacia over sobre el botn y se
mostraba el handCursor. Mas tarde, pude investigar un poco, y descubr que lo que pasaba era
que el campo de texto dentro del clip "interfera" con los eventos de ratn, y por eso no se
mostraba "la mano".
Para solucionarlo, podemos utilizar la propiedad mouseChildren de los
DisplayObjectContainer, que determina si los elementos secundarios de un objeto estn
habilitados para ratn. Su valor predeterminado es true.

Comprobacion de tipos en Actionscript 3.0
con as e is
Etiquetas: as is
En Actionscript 3.0 disponemos de dos operadores para verificar tipos: "as" e "is". Es decir,
con estos operadores podemos comprobar, por ejemplo, si un elemento del escenario es de
tipo Sprite, o si una variable es de tipo Number.
Para ver como funcionan estos dos operadores voy a utilizar un escenario sobre el que tengo 3
MovieClips de la clase "Cuadrado", que extiende de MovieClip, y 3 MovieClips de la clase
"Circulo", que tambin extiende de MovieClip.
El operador is
Permite comprobar si una variable o expresin forma parte de un tipo de datos. No solo
verifica si un objeto es una instancia de la clase especificada, sino tambin si es una subclase
de ella o implementa la misma interfaz.
Por ejemplo, si en el escenario que hemos propuesto ponemos:
1.


2.

for(var i:uint = 0; i < numChildren; i++){
3.

if (getChildAt(i) is DisplayObject) {
4.

getChildAt(i).alpha = .1
5.

}
6.

}
7.


Obtenemos:
Como vemos, "parpadean" crculos y cuadrados, ya que todos son instancias de clases que
heredan de DisplayObject. Sin embargo, si ponemos:
1.


2.

for(var i:uint = 0; i < numChildren; i++){
3.

if (getChildAt(i) is Cuadrado) {
4.

getChildAt(i).alpha = .1
5.

}
6.

}
7.


vemos que solamente parpadean los cuadrados, ya que los circulos no pertenecen a la misma
clase ni heredan de "Cuadrado".
El operador as
Tambin permite comprobar si un elemento es miembro de un tipo de datos. Sin embargo, en
lugar de devolver true o false, devuelve el valor de la expresin en lugar de true, y null en
lugar de false. Por ejemplo:
1.


2.

trace(miCirculo as Circulo) //Devuelve: [object Circulo]
3.

trace(miCirculo as Sprite) //Devuelve: [object Circulo]
4.

trace(miCirculo as Cuadrado) //Devuelve: null
5.



Actionscript 3.0: Colisiones a nivel de pixel
1
Etiquetas: complexIntersectionRectangle hitTestObject
La funcin hitTestObject(obj:DisplayObject) evala un objeto para comprobar si choca con
el objeto obj. Por ejemplo, si tenemos dos objetos "Item1_mc" e "Item2_mc", podemos
comprobar si chocan con:
1.


2.

Item1_mc.hitTestObject(Item2_mc)
3.


Esta funcin, tiene el inconveniente de que comprueba los choques entre los contenedores
rectangulares de los objetos. Por ejemplo:

por tanto, sin queremos comprobar las colisiones entre dos objetos no rectangulares, puede
devolver valores que aparentemente no son correctos. Aqu tenemos un ejemplo en Flash:
Si queremos utilizar colisiones a nivel de pixel, podemos crear un objeto bitmapData,
superponer los dos objetos en el objeto bitmapData con un filtro de color cada uno, y
comprobar si hay pixels que tienen el color de la combinacin de filtros utilizados. En el blog
de tink , podemos descargar una clase que nos ahorra todo este proceso y utilizar directamente
mtodos que nos devuelven true o false como resultado de la colisin. Por ejemplo, si
queremos comprobar la colisin a nivel de pixel entre los dos objetos del ejemplo anterior,
pondramos:
1.


2.

HitTest.complexHitTestObject(Item1_mc,Item2_mc)
3.


Y si queremos recibir el rectngulo de colisin:
1.


2.
var rect:Rectangle =
HitTest.complexIntersectionRectangle(Item1_mc,Item2_mc);
3.


El resultado, sera este:
Los fuentes, y la clase HitTest de tink, tras el salto.

Comparar pixels de imgenes en
Actionscript 3.0 con threshold
Etiquetas: BitmapData clone threshold

La funcin threshold permite hacer comparaciones pixel a pixel en una imagen. Por ejemplo,
podemos separar todos los pixels mayores de un color de una imagen, y obtener otra imagen
con esos pixels. La funcin threshold tiene 5 parmetros obligatorios (y varios opcionales):
threshold(sourceBitmapData:BitmapData, sourceRect:Rectangle, destPoint:Point,
operation:String, threshold:uint)
-sourceBitmapData: la imagen que vamos a utilizar
-sourceRect: rectngulo que define el area de la imagen de origen que vamos a utilizar
-destPoint: punto de la imagen de destino que corresponde a la esquina superior izquierda del
rectngulo
-operation: operacin que vamos a utilizar
-threshold: valor con el que comparamos cada pixel
Por ejemplo, si queremos separar los pixels mayores de 0xFFCCCCCC de los menores en una
imagen, podemos utilizar:
1.


2.

img1.threshold(img1, new Rectangle(0, 0, 350, 242), new
Point(0, 0), ">", 0xFFCCCCCC);
3.

img2.threshold(img2, new Rectangle(0, 0, 350, 242), new
Point(0, 0), "<=", 0xFFCCCCCC);
El cdigo completo y los fuentes:

Actionscript 3.0: Mostrar imagen en blanco
y negro con ColorMatrixFilter
Etiquetas: ColorMatrixFilter filters

La clase ColorMatrixFilter de Actionscript 3.0 permite aplicar una transformacin a los
valores de color y alfa de cada pixel de una imagen. Se puede aplicar sobre cualquier objeto
que herede de la clase DisplayObject (es decir MovieClip, SimpleButton, TextField...).
Los filtros ColorMatrixFilter, se crean a partir de una matriz de transformacin de 4x5, con lo
valores de modificacin que queremos aplicar a cada canal. Por ejemplo, si tenemos la matriz:
1.


2.

private var rLum:Number = 0.2225;
3.

private var gLum:Number = 0.7169;
4.

private var bLum:Number = 0.0606;
5.


6.

private var bwMatrix:Array = [rLum, gLum, bLum, 0, 0,
7.

rLum, gLum, bLum, 0, 0,
8.

rLum, gLum, bLum, 0, 0,
9.

0, 0, 0, 1, 0];
10.


Podemos crear un filtro con ella, asi:
1.


2.
var filtroBW:ColorMatrixFilter
3.

filtroBW = new ColorMatrixFilter(bwMatrix);
4.


y aplicarlo a un MovieClip (que en este caso est en el escenario con el nombre
Imagen2_mc):
1.


2.

Imagen2_mc.filters = [filtroBW]
3.


De esta manera, hacemos que el contenido de Imagen2_mc aparezca en blanco y negro, pero
podemos modificar los valores de bwMatrix para obtener otros efectos.
El cdigo completo y los fuentes, son estos:

Actionscript 3.0: Aplicar estilos CSS a
campos de texto
Etiquetas: StyleSheet parseCSS styleSheet htmlText

Los campos de texto en flash pueden contener texto simple o texto en formato HTML. El
texto en formato HTML se almacena en la propiedad htmlText. Sobre los campos con texto
HTML podemos aplicar hojas de estilo CSS, creadas en el cdigo de la aplicacin o cargadas
en tiempo de ejecucin.
En este ejemplo vamos a ver como cargar un archivo css, y aplicar estos CSS a un TextField
que contiene un teto HTML. La hoja de estilos que vamos a utilizar, es esta:
1.


2.

h1 {
3.


4.

font-family: Times New Roman, Times, _serif;
5.


6.

font-size: 30;
7.


8.

font-weight: bold;
9.


10.

}
11.


12.

h2 {
13.


14.

font-family: Arial, Helvetica, _sans;
15.


16.

font-size: 24;
17.


18.

}
19.


20.

p{
21.


22.

font-size: 15;
23.


24.

}
25.


26.

a{
27.


28.

color: #009900;
29.


30.

}
31.


32.

a:hover{
33.


34.

color: #00ff00;
35.


36.

}
37.


38.


Lo primero que tenemos que hacer, es cargar la hoja de estilos. Para ello, utilizamos una
instancia de Loader:
1.


2.

cargador = new URLLoader();
3.

cargador.addEventListener(Event.COMPLETE,
onCSSFileLoaded);
4.

cargador.load(new
URLRequest("http://www.esedeerre.com/ejemplos/as3/css/eje
mplo.css"));
5.


Una vez cargado el archivo, salta el evento COMPLETE, y creamos una instancia de
StyleSheet, parseamos el CSS cargado, y se lo aplicamos al campo de texto. Despus de
aplicar el CSS al campo de texto, podemos rellenar el campo con el texto HTML que
queramos:
1.


2.

public function onCSSFileLoaded(event:Event):void
3.

{
4.

var sheet:StyleSheet = new StyleSheet();
5.

sheet.parseCSS(cargador.data);
6.

campo.styleSheet = sheet;
7.

campo.htmlText = texto;
8.

}
9.


El cdigo completo, y el ejemplo en Flash, tras el salto.

Actionscript 3.0: optimizaciones (II)
Continuacin del artculo de optimizaciones en Actionscript 3.0
Sumar / Concatenar cadenas de texto (Strings)
Mtodo: concat()
1.


2.
var t:Number = getTimer();
3.
var txt1:String = "Esto es";
4.
var txt2:String = "una prueba de rendimiento";
5.

var txt3:String = "de concatenacion de cadenas"
6.
var txt:String;
7.

for(var i:uint = 0;i < 1000000; i++){
8.

txt = txt1.concat(" ", txt2, " ",txt3);
9.

}
10.

trace(getTimer() - t);
11.


Resultado: 2034 ms


Mtodo: operador +
1.


2.
var t:Number = getTimer();
3.
var txt1:String = "Esto es";
4.
var txt2:String = "una prueba de rendimiento";
5.

var txt3:String = "de concatenacion de cadenas"
6.
var txt:String;
7.

for(var i:uint = 0;i < 1000000; i++){
8.

txt = txt1 + " " + txt2 + " " + txt3;
9.

}
10.

trace(getTimer() - t);
11.


Resultado: 894 ms

Conclusin: sumar Strings con + es 2 veces ms rpido que utilizar el mtodo concat() de la
clase String().
Calcular mnimo / mximo de 2 nmeros
Mtodo: Math.min() / Math.max()
1.


2.
var t:Number = getTimer();
3.
var n1:Number = 234;
4.
var n2:Number = 675
5.

var n:Number;
6.

for(var i:uint = 0;i < 1000000; i++){
7.

n = Math.min(n1,n2);
8.

}
9.

trace(getTimer() - t);
10.


Resultado: 149 ms


Mtodo: condicionales
1.


2.
var t:Number = getTimer();
3.
var n1:Number = 234;
4.
var n2:Number = 675
5.

var n:Number;
6.

for(var i:uint = 0;i < 1000000; i++){
7.

n = (n1>n2)?n2:n1;
8.

}
9.

trace(getTimer() - t);
10.


Resultado: 25 ms

Conclusin: una vez ms, hacerlo "a mano" es ms rpido.
Multiplicacin vs Divisin
Mtodo: divisin
1.


2.
var t:Number = getTimer();
3.

for(var i:uint = 0;i < 10000000; i++){
4.

var n:Number = i / 2;
5.

}
6.

trace(getTimer() - t);
7.


Resultado: 226 ms


Mtodo: multiplicacin
1.


2.
var t:Number = getTimer();
3.

for(var i:uint = 0;i < 10000000; i++){
4.

var n:Number = i * .5;
5.

}
6.

trace(getTimer() - t);
7.


Resultado: 225 ms

Conclusin: esta era una de las "leyendas urbanas" que siempre habia oido pero nunca habia
testeado. Por lo que he estado investigando, hasta alguna versin de FP9, era ms rpido
multiplicar que dividir un nmero, pero en las nuevas versiones de Flash Player ya no es as.

Actionscript 3.0: optimizaciones (I)
Etiquetas: Math.floor Math.abs
Este artculo recoge algunos test de rendimiento para diversas operaciones en Actionscript
3.0. Este es un tema que me interesa bastante, asi que espero hacer mas test e ir ampliando
informacin en el futuro.
Los test se han realizado en un Core2 6420 2,13Ghz, con 3GB de RAM y Windows Vista
Home Premium de 32 bits. La versin de Flash Player es la 10,0,2,54.

Recorrer elementos de un Array (de 1 milln de elementos)
1.


2.
var t:Number = getTimer();
3.
var temp:int;
4.

for(var i:Number = 0; i < matriz.length; i++){
5.

temp = matriz[i];
6.

}
7.

trace(getTimer() - t);
8.


Resultado: 130 ms

Si sustituimos el tipo de i de Number a uint:
1.


2.
var t:Number = getTimer();
3.
var temp:int;
4.

for(var i:uint = 0; i < matriz.length; i++){
5.

temp = matriz[i];
6.

}
7.

trace(getTimer() - t);
8.


Resultado: 95 ms

Si almacenamos matriz.length en una variable:
1.


2.
var t:Number = getTimer();
3.
var temp:int;
4.
var l:uint = matriz.length;
5.

for(var i:uint = 0; i < l; i++){
6.

temp = matriz[i];
7.

}
8.

trace(getTimer() - t);
9.


Resultado: 23 ms

En definitiva, solo con poner uint (entero positivo) como tipo de i, y con almacenar la
longitud de la matriz en una variable, hacemos que el bucle se ejecute 5,6 veces ms rpido.

Redondear nmeros (Math.floor)
1.


2.
var t:Number = getTimer();
3.
var temp:Number;
4.

for(var i:uint = 0;i < 1000000; i++){
5.

temp = Math.floor(1.7);
6.

}
7.

trace(getTimer() - t);
8.


Resultado: 163 ms

1.


2.
var t:Number = getTimer();
3.
var temp:Number;
4.

for(var i:uint = 0;i < 1000000; i++){
5.

temp = uint(1.7);
6.

}
7.

trace(getTimer() - t);
8.


Resultado: 29 ms

1.


2.
var t:Number = getTimer();
3.
var temp:Number;
4.

for(var i:uint = 0;i < 1000000; i++){
5.

temp = int(1.7);
6.

}
7.

trace(getTimer() - t);
8.


Resultado: 18 ms

Este test me ha sorprendido mucho. Convertir el nmero a int(entero), es 9 veces ms rpido
que utilizar Math.floor(). Teniendo en cuenta que el resultado es el mismo, y que encima int
tiene menos letras que Math.floor, no veo motivos para no desterrar a Math.floor().

Obtener el valor absoluto de un nmero (Math.abs)
1.


2.
var t:Number = getTimer();
3.
var temp:Number;
4.
var n:Number = -53.44;
5.

for(var i:uint = 0;i < 1000000; i++){
6.

temp = Math.abs(n);
7.

}
8.

trace(getTimer() - t);
9.


Resultado: 145 ms
1.


2.
var t:Number = getTimer();
3.
var temp:Number;
4.
var n:Number = -53.44;
5.

for(var i:uint = 0;i < 1000000; i++){
6.

temp = n < 0 ? n * -1 : n;
7.

}
8.

trace(getTimer() - t);
9.