0 Replies Latest reply on Mar 9, 2011 10:47 AM by Handycam

    How to use different icons for different Accordion States?

    Handycam Level 1

      I have an accordion with several navigator content components.  I know how to set the icon, but how can I use a DIFFERENT icon for selectedStates?


      <mx:Accordion id="sections" width="225" height="100%" borderColor="#e1e5ca">
           <s:NavigatorContent label="Benchtop Machines" width="100%" height="100%" icon="@Embed('assets/triangle_closed.png')">


      I have a custom AccordionHeaderSkin, of type "The Spark skin class for the header of the Halo Accordion container. "


      I can easily set all my other parameters there, and then I am applying the skinClass in CSS:


      mx|Accordion {
           borderStyle: none;
           openDuration: 300;
           headerHeight: 32;
           selectedFillColors: #a3b2e2, #4557a2;
           backgroundColor: #ffffff;
           textRollOverColor: #000000;
           textSelectedColor: #35241a;
           headerStyleName: "myaccordionHeader";
      .myaccordionHeader {
           color: #35241a;
           fontSize: 14;
           fontFamily: sansBoldMX;
           skin: ClassReference("skins.AccordionHeaderSkin");