Question

I’ve been stuck on this problem for a few days. The solution seems simple, but I haven’t found one yet.

I’m working with Flex 3, and I’m trying to change the color of a ComboBox when it is disabled into something lighter. The current CSS is this:

ComboBox {
color:#000000;
fillAphas: 1, .5, .55, .35;
fillColors: #ffffff, #cccccc, #999999, #666666;
fontWeight: normal;
backgroundAlpha: 1;
fontSize:11;
}

The problem is that when i use the backgroundDisabledColor property, the enabled as well as the disabled combo boxes are all altered with the new color. Is there a way to set a disabled fill color property, or somehow turn off the fill colors when the combo box is disabled? Thanks.

**
Seeing as I could not change the fill Colors for a disabled combobox directly with a css property, and flex 3 does not like css attribute selectors, I added a property to link to a skin when disabled and simply made a ComboBox skin with lighter colors. This seemed to be the best option. Thank you for all the help.

Answer 1

Did you try setting the disabledColor style?

I was pretty sure a component is disabled, visually, by drawing a semi transparent graphic on top of it. I’m not sure I’d recommend trying to change the background color in order to visually communicate “Disabled”.

Changing the universal “ComboBox” style will change all ComboBoxes. But, you could create a named style:

.disabledComboStyle {
color:#000000;
fillAphas: 1, .5, .55, .35;
fillColors: #ffffff, #cccccc, #999999, #666666;
fontWeight: normal;
backgroundAlpha: 1;
fontSize:11;
}

And specify it on your disabled component using the styleName style:

<mx:ComboBox styleName = "disabledComboStyle" />

However, style computations are known to be a performance heavy operation, so I’m not sure I’d recommend switching styles like this a lot.