没有渐变的Flex按钮

时间:2011-06-20 12:29:41

标签: flex button gradient

如何在Flex(SDK 3.3)中创建一个没有任何渐变或边框颜色的简单按钮?我的CSS如下所示。我仍然得到渐变和不同的边框颜色,我只想要一个普通的方形纯色按钮。

谢谢!

Button {
    fontWeight:normal;
    color:white;
    fillAlphas: 1, 1, 1, 1;
    fillColors: "0x0087B8", "0x0087B8","0x4A1870", "0x4A1870";
    cornerRadius: 0;
    focusAlpha: 1;
    borderColor:"0x0087B8";
    borderAlpha:1;
    textRollOverColor: white;

}

1 个答案:

答案 0 :(得分:1)

感谢您的投入,我必须创建一个这样的程序化皮肤:

    public class TIMPButtonSkin extends ProgrammaticSkin
{
    public var backgroundFillColor:Number;
    public var lineThickness:Number;

    public function TIMPButtonSkin()
    {
        super();

    }

    override protected function updateDisplayList(w:Number, h:Number):void {

        var btn:Button = parent as Button;
        btn.buttonMode = true;

        switch (name) {
            case "upSkin":
                backgroundFillColor = 0x0087B8;
                break;
            case "overSkin":
                backgroundFillColor = 0x4A1870;
                break;
            case "downSkin":
                backgroundFillColor = 0x4A1870;
                break;
            case "disabledSkin":
                break;
        }

        // Draw the box using the new values.
        var g:Graphics = graphics;
        g.clear();
        g.beginFill(backgroundFillColor,1.0);
        g.lineStyle(lineThickness, 0xFF0000);
        g.drawRect(0, 0, w, h);
        g.endFill();
    }
}

CSS看起来像这样:

Button {
fontWeight:normal;
color:white;
cornerRadius: 0;
textRollOverColor: white;
textSelectedColor:white;
skin: ClassReference("TIMP.TIMPButtonSkin");  

}