Setting styles on individual Flex Accordion headers

Well, I played around with it briefly this evening and it seems that you can get individual accordion headings using the Accordion class’s <code>getHeaderAt()</code> method, then it is just a matter of saving that reference in a variable, or applying a style directly to the returned Button reference.

The example itself is pretty simple, but I’m sure the same principles apply to other styles as well

&lt;?xml version="1.0" encoding="utf-8"?&gt;

&lt;!-- http://blog.flexexamples.com/2007/10/30/setting-styles-on-individual-flex-accordion-headers/ --&gt;

&lt;mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"

        layout="vertical"

        verticalAlign="middle"

        backgroundColor="white"&gt;

    &lt;mx:Style&gt;

        AccordionHeader {

            fillColors: black, black;

            fillAlphas: 1, 1;

            textRollOverColor: white;

            textSelectedColor: white;

            themeColor: black;

        }

    &lt;/mx:Style&gt;

    &lt;mx:Script&gt;

        &lt;![CDATA[

            private function init():void {

                accordion.getHeaderAt(0).setStyle("color", "red");

                accordion.getHeaderAt(1).setStyle("color", "haloOrange");

                accordion.getHeaderAt(2).setStyle("color", "yellow");

                accordion.getHeaderAt(3).setStyle("color", "haloGreen");

                accordion.getHeaderAt(4).setStyle("color", "haloBlue");

            }

        ]]&gt;

    &lt;/mx:Script&gt;

    &lt;mx:Accordion id="accordion"

            width="300"

            height="200"

            creationComplete="init();"&gt;

        &lt;mx:VBox label="Red" /&gt;

        &lt;mx:VBox label="Orange" /&gt;

        &lt;mx:VBox label="Yellow" /&gt;

        &lt;mx:VBox label="Green" /&gt;

        &lt;mx:VBox label="Blue" /&gt;

    &lt;/mx:Accordion&gt;

&lt;/mx:Application&gt;

    本文转自 OldHawk  博客园博客，原文链接：http://www.cnblogs.com/taobataoma/archive/2008/01/13/1037071.html，如需转载请自行联系原作者