Search code examples
cssactionscript-3apache-flexstylesstylesheet

Flex CSS does not support align manipulation?


I am using Flex 4.9. I thought that with the newest SDK, they finally made Flex and CSS components tags to work. But they did not.

I tried to set horisontalAlign and verticalAlign of spark HGroup vie CSS style, so I could manage it smoothly and save some code typing. HGroups didnt respond to CSS style I applied, ok, I thought that at least I will set their width. It also did not work! Nor pixel width or percent value.

Does Flex CSS styling is really so limited or am I missing something?


Solution

  • horizontalAlign, verticalAlign, width and height are all properties of the HGroup class, not styles. Hence you cannot set these properties through stylesheets.

    What you seem to be missing is that Flex is not HTML and that the same semantics do not apply. In Flex 4 we separate the content from the way it is presented mainly through a process called skinning: we declare components and their logic in one class (usually in ActionScript) and we define its visual representation in another (usually written in MXML).
    With this separation already in place there is hardly any need for stylesheets. In fact, if you would put a CSS on top of that, you would kind of artificially try to separate the layout into two separate entities which doesn't make much sense. Not to mention it would make the code much harder to read.

    There is a case where CSS comes in handy though, that is when you want to apply a certain visual style throughout your application. A Button could have five different skins, but through CSS you could set the font color of all five to a specific color without repeating that in each skin.