CheckBox - no border

[angie]

Hi,

Does anyone know how to style a checkbox so that it has no border? Changing the border colour doesn't work as checkboxes have a gradient so they are the specified colour at the top but then go darker towards the bottom. I've tried extending CheckBoxIcon skin and settind the skin to be my new class, and also tried creating a new class and copying the code from CheckBoxIcon and removing all references to drawingthe border, but it doesn't seem to work. Any ideas? Also, when it's disabled I'd also like to extend it to show a X when the value is false. Any ideas how I can do this without creating a composite component that shows either a checkbox when endabled or an image when disabled? Thanks.

[josnajoseph2007]

CheckBox {
textIndent: 0;
letterSpacing: 0;
highlightAlphas: 0, 0;
fillAlphas: 1, 1, 1, 1;
fillColors: #ffffff, #ffffff, #ffffff, #ffffff;
borderColor: #ffffff;
iconColor: #ffffff;
disabledIconColor: #333333;
color: #000000;
themeColor: #ffffff;
}

Try these styles for checkBox

[angie]

Thanks, but I still see the border. The top is white, so blends in with the background, but as it gets towards the bottom the border becomes grey.

[Ghost3313]

Try creating your own images and then replacing them. That way you can make it the way you want. Then just exchange the Unselected verion with the selected version. Hope this helps.

Ghost3313


<mx:Style>
CheckBox {
/* Unselected */
upIcon: Embed(source="images/001.png");
overIcon: Embed(source="image/001.png");
downIcon: Embed(source="image/002.png");
/* Selected */
selectedUpIcon: Embed(source="image/003.png");
selectedOverIcon: Embed(source="image/003.png");
selectedDownIcon: Embed(source="image/002.png");
}
</mx:Style>

[angie]

Brilliant. Thanks, this was exactly what I needed.