Question

I want to make a Flex button that has it’s background transparent in order to apply css to the page and affecting the flash.

I tried, but with no luck:

<mx:Button skin="{null}" x="0" y="0" label="Submit"/>

Answer 1

The simplest way is using mx:LinkButton, unfortunately LinkButtonSkin hardcoded alpha=1 for all states but you can override it:

package
{
import flash.geom.Matrix;

import mx.skins.halo.LinkButtonSkin;

public class LinkButtonAlphaSkin extends LinkButtonSkin
{
    public function LinkButtonAlphaSkin()
    {
        super();
    }

    override protected function drawRoundRect(x:Number, y:Number, width:Number, height:Number, cornerRadius:Object=null, color:Object=null, alpha:Object=null, gradientMatrix:Matrix=null, gradientType:String="linear", gradientRatios:Array=null, hole:Object=null):void
    {
        super.drawRoundRect(x, y, width, height, cornerRadius, color, 0, gradientMatrix, gradientType, gradientRatios, hole);
    }
}
}

Usage:

<mx:LinkButton label="lala" skin="LinkButtonAlphaSkin"/>