Personalizar botones de aplicaciones Flex con Actionscript
Este =http://www.cristalab.com/tipstip[/url] es una continuación a tip escrito por Mx en Cristalab sobre como personalizar botones (y componentes en general) de Flex.
En ese tip, se muestra como podemos utilizar gráficos de Photoshop para sustituir los gráficos estándar del componente. Ella mostró la forma de hacerlo desde los menús de Flex Builder y el resultado de ese proceso es la generación de un archivo CSS como, por ejemplo, este:
- Button {
- upSkin: Embed("img/ico1.png");
- overSkin: Embed("img/ico2.png");
- downSkin: Embed("img/ico3.png");
- disableSkin: Embed("img/ico4.png");
- }
Con esto cambiaremos el aspecto de TODOS los componentes botón de nuestra aplicación. Pero.. ¿que pasa si queremos cambiar el aspecto de un botón en concreto? por ejemplo para un botón de “Play” o de “Stop” en un reproductor de vídeo.
Para hacer eso, podemos asignar otro “estilo” a ese botón en concreto a través de actionscritp.
Para ello abriremos un tag
- <mx:Script>
- <![CDATA[
- [Embed("img/ico2_1.png")]
- private var ico1:Class;
- [Embed("img/ico2_2.png")]
- private var ico2:Class;
- [Embed("img/ico2_3.png")]
- private var ico3:Class;
- [Embed("img/ico2_4.png")]
- private var ico4:Class;
- private function ini():void
- {
- boton1.setStyle("upSkin", ico1);
- boton1.setStyle("overSkin", ico2);
- boton1.setStyle("downSkin", ico3);
- boton1.setStyle("disableSkin", ico4);
- }
- ]]>
- </mx:Script>
De esta manera, todos los componentes botón tendrán el estilo definido desde el archivo CSS menos nuestro botón “boton1” que tendrá el estilo definido en el actionscript.
Compártelo:
Visto 10.132 veces
