CODEWITHSUNDEEP
cssapache-flexflex3radio-buttonskinning
Mark Ingram
Mark Ingram

Reputation: 73625

How to set the RadioButton icon style to nothing in CSS (in Flex 3)?

You can skin a RadioButton in Flex by setting the following values in CSS:

upSkin: Embed(...); 
overSkin: Embed(...);
ownSkin: Embed(...);
disabledSkin: Embed(...);
selectedUpSkin: Embed(...);
selectedOverSkin: Embed(...);
selectedDownSkin: Embed(...);
selectedDisabledSkin: Embed(...);

But, it will still display the little circle icon inside your skin. You can change the icon by setting the following styles:

upIcon: Embed(...);
overIcon: Embed(...);
etc...

My question is, how can I set these icons to nothing? Rather than a 1x1 pixel transparent image or something? How can I give it an empty style?

Edit:

In actionscript I can do it like:

button.setStyle("icon", null);

In CSS I've tried:

icon: none;
icon: null;

But neither worked.

Accepted Answer:

Suggestions one & two both worked, but I prefer the cleaner solution of:

upIcon: ClassReference(null);

Thanks for both answers (wish I could mark both as the answer!)

Upvotes: 2

Views: 8906

Answers (3)

cliff.meyers
cliff.meyers

Reputation: 17734

Try this:

ClassReference(null);

Upvotes: 6

Josh Tynjala
Josh Tynjala

Reputation: 5242

I don't think it's possible to set the skin as null in Flex CSS. In fact, some Flex component must have something set for the skin, and they will throw runtime errors if you use setStyle("skinName", null). I usually use a declaration like this when I want no skin:

RadioButton
{
    upIcon: ClassReference("mx.skins.ProgrammaticSkin");
}

The ProgrammaticSkin class displays nothing and implements IFlexDisplayObject (which is often a requirement for skins in Flex), so I think it's the best choice for when you want a blank skin.

Upvotes: 3

Soviut
Soviut

Reputation: 91555

If its standard CSS, you can use the following. I'm assuming the styles are classes, if they're IDs replace the . with a #:

.upSkin
{
    background: none;
}

The background property can be used to set color, positioning, and repeating; if you need to specifically target just the background image use:

.upSkin
{
    background-image: none;
}

Upvotes: 1

Related Questions