Con este post comenzare una serie de ejemplos básicos para irnos metiendo a lo nuevo de Flex 4 (aka Gumbo), su nuevo modelo de componentes y nuevas características.

En este primer ejemplo mostrare como se puede cambiar el “baseColor” o background del componente Spark Button.

Ejemplo

Hay 3 maneras como podemos cambiar el baseColor, usando MXML, Actionscript o CSS.

MXML

Este es el source del ejemplo anterior.

<?xml version="1.0" encoding="utf-8"?>

<s:Application
    xmlns:fx="http://ns.adobe.com/mxml/2009"
    xmlns:s="library://ns.adobe.com/flex/spark"
    xmlns:mx="library://ns.adobe.com/flex/halo"
    width="100%" height="100%"
>
    <mx:ApplicationControlBar width="100%">
        <s:Label text="baseColor: " />
        <mx:ColorPicker id="colorSelector" selectedColor="#cccccc" />
    </mx:ApplicationControlBar>

    <s:Button
        id="button"
        baseColor="{colorSelector.selectedColor}"
        horizontalCenter="0"
        verticalCenter="0"
        label="baseColor"
    />

</s:Application>