Comunidad de diseño web y desarrollo en internet online

Personalización de los componentes de Flash

La personalización de componentes en Flash MX 2004 es bastante fácil gracias al método setStyle(); que nos permite cambiar colores, tipografias, estilos, y demás propiedades configurables de nuestro componente. Cabe decir que algunos componentes no soportan algunos estilos, por ejemplo, no podemos cambiar la barra de desplazamiento a un botón, simple y llanamente, porque no tiene.

Aquí tenéis una lista con todas las propiedades de los componentes:

Estilo

Descripción/Uso

backgroundColor

Color de fondo del componente. Valor predeterminado "transparent".

borderColor

Color de un borde de dos a tres dimensiones. Valor predeterminado 0x000000 (negro).

borderStyle

El borde del componente: puede ser "none", "inset", "outset", o "solid". Valor predeterminado "solid".

buttonColor

Color de la cara y de la sección de un borde de tres dimensiones de un botón. Valor predeterminado 0xEFEEEF (gris claro).

color

Color del texto. Valor predeterminado 0x000000 (negro).

disabledColor

Color del texto desactivado. Valor predeterminado 0x848384 (gris oscuro).

fontFamily

Tipografia del texto. Valor predeterminado _sans.

fontSize

Tamaño de la fuente. Valor predeterminado 10.

fontStyle

Estilo de la fuente: puede ser "normal" o"italic". Valor predeterminado "normal".

fontWeight

Ancho de la fuente: puede ser "normal" o"bold". Valor predeterminado "normal".

highlightColor

Una sección de un borde de tres dimensiones. Valor predeterminado 0xFFFFFF (blanco).

marginLeft

Un valor numérico que indica el margen de la izquierda en pixels. Valor predeterminado 0.

marginRight

Un valor numérico que indica el margen de la derecha en pixels. Valor predeterminado 0.

scrollTrackColor

Color de la barra de desplazamiento. Valor predeterminado 0xEFEEEF (gris claro).

shadowColor

Una sección de un borde de tres dimensiones. Valor predeterminado 0x848384 (gris oscuro).

symbolBackgroundColor

Color de fondo para el CheckBox y el RadioButton. Valor predeterminado 0xFFFFFF (white).

symbolBackgroundDisabledColor

Color de fondo para el CheckBox y el RadioButton cuando estan desactivados. Valor predeterminado 0xEFEEEF (gris claro).

symbolBackgroundPressedColor

Color de fondo para el CheckBox y el RadioButton cuando estan pulsados. Valor predeterminado 0xFFFFFF (blanco).

symbolColor

Color de la marca para el CheckBox y el RadioButton. Valor predeterminado 0x000000 (negro).

symbolDisabledColor

Color de la marca para el CheckBox y el RadioButton cuando estan desactivados. Valor predeterminado 0x848384 (gris oscuro).

textAlign

Alineación del texto: puede ser "left", "right", o"center". Valor predeterminado "left".

textDecoration

Detalles del texto: puede ser "none" o"underline". Valor predeterminado "none".

textIndent

Un número que indica la sangría del texto. Valor predeterminado 0.

Con estas propiedades podréis cambiar todos los componentes de Flash. Ahora vamos a probar cambiando un componente TextArea.

Abrid la paleta de Componentes (Ctrl + F7), y en el desplegable UIComponents, arrastrar un componente TextArea a la escena. Ponedle de nombre de instancia "mi_textarea".

Ahora en el fotograma 1 pegar el siguiente código:

//Propiedades del boton
mi_textarea.text = "La personalización de componentes en Flash MX
2004 es bastante fácil gracias al método setStyle(); que nos permite
cambiar colores, tipografias, estilos, y demás propiedades configurables
de nuestro componente."
;
mi_textarea._x = 0;
mi_textarea._y = 0;
mi_textarea.setSize(200, 50); mi_textarea.setStyle("themeColor","haloBlue");
//mi_textarea.setStyle("backgroundColor", "0xCCBBDD");
//mi_textarea.setStyle("borderColor", "0x00FF00");
//mi_textarea.setStyle("borderStyle", "outset");
//mi_textarea.setStyle("color", "0x0000FF");
//mi_textarea.setStyle("disabledColor", "haloOrange");
//mi_textarea.setStyle("fontFamily", "Arial");
//mi_textarea.setStyle("fontSize", "12");
//mi_textarea.setStyle("fontStyle", "italic");
//mi_textarea.setStyle("fontWeight", "bold");
//mi_textarea.setStyle("highlightColor", "0x0FF000");
//mi_textarea.setStyle("marginLeft", "5");
//mi_textarea.setStyle("marginRight", "5");

Probad descomentando las líneas y así veréis que hace cada línea, y que efecto tiene en vuestro componente.
Usa otros componentes para ver como les afectan los mismos cambios.

En fin, experimenta con los componentes, te llevará un rato ver qué hace exactamente cada uno, pero sin pena no hay gloria, jejeje.

En el siguiente tutorial aprenderemos a usar los eventos de los componentes mediante los llamados Listeners o Escuchadores.

¿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.

Descargar Archivo

Publica tu comentario

El autor de este artículo ha cerrado los comentarios. Si tienes preguntas o comentarios, puedes hacerlos en el foro

Entra al foro y participa en la discusión

o puedes...

¿Estás registrado en Cristalab y quieres
publicar tu URL y avatar?

¿No estás registrado aún pero quieres hacerlo antes de publicar tu comentario?

Registrate