Flex Warning: CSS type selectors are not supported in components: ‘ColumnChart’

If you get the error/warning in Flex “CSS type selectors are not supported in components”, you are probably using Type selectors in your.css style sheet that are being referenced by a custom component (as I was), which throws a warning.
No effect was seen in the AIR app, but apparently it can cause problem is deployed in a browser. Changed the Type selectors to Class selectors, and it resolved, see my code below.

If your exporting as3 as a SWC component library, you have to name your styles.css file defaults.css, see Livedoc article and
Parallaxed.net article for more details of both.


[styles.css]
// Incorrect: using 'Type' selector:
ColumnChart{
  maxColumnWidth: 30;
}
// Correct: uses 'Class' selector
.columnChartStyle{
    maxColumnWidth: 30;
}

[MyColumnChart.mxml]
// dont tag the .css file here
<?xml version="1.0" encoding="utf-8"?>
<mx:ColumnChart xmlns:mx="http://www.adobe.com/2006/mxml"
              showDataTips="true"
              visible="true" height="100%" width="100%">  </mx:ColumnChart>

[MainApp.mxml]
// Call the source style sheet within the mxml
<mx:Style source="APP/assets/styles.css"/>
// Tag the ColumnChart with the 'Class' selector
<mx:ColumnChart
     id="myChart"
     styleName="columnChartStyle">
</mx:ColumnChart>
Advertisements

Tags: ,

5 Responses to “Flex Warning: CSS type selectors are not supported in components: ‘ColumnChart’”

  1. Jess Says:

    This is an annoying problem. It would be best if Flex would allow you to reference the global style sheet as simple html does. I have ignored them, without issue to this point. It does become hard to separate the wheat from the chaff if you have too many of these (false) warnings though.

    • bishoponvsto Says:

      Same here, just ignored them, and have seen no problems (annoying having to ignore 10 warnings though!)

  2. Tgha Says:

    Thanks for your article, I am going to style MenuBar and disable the animation so I have to set the open-duration: 0; for Menu component not MenuBar, I can’t set the Menu style in the component either can’t use styleName because if I set the styleName it is for MenuBar not Menu so it seems the only way is to set it in Application scope which is funny (I mean style a component in Application scope what if I want to move it to other project etc.) is ther any solution for this? Thanks

  3. John Daharsh Says:

    There is a case I have encountered twice that can also cause this, and it is just as annoying.

    I have several applications in my project. I have added the compiler argument “-show-unused-type-selector-warnings=false” and it cleared it up initially – I THOUGHT.

    What the culprit actually turned out to be – for me – was that in one of my classes I was using the following reference to the parentApplication:

    (this.parentApplication as MyApplication)

    If you have more than one application, and you HAVE to reference the parent application from within a class somewhere, just use

    this.parentApplication

    DO NOT CAST IT USING “AS” or you will see this warning. I imagine this is a Flash Builder bug, but I am too lazy and frustrated to log it.

    Hope this helps someone else.

  4. lawn mower repair edmonton Says:

    Hey! I just wanted to ask if you ever have any problems with
    hackers? My last blog (wordpress) was hacked and
    I ended up losing many months of hard work due to no backup.
    Do you have any methods to protect against hackers?

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s


%d bloggers like this: