Æliens

    <mx:Style>
      .myHeaderStyle
      {
        upSkin: Embed("mashup-rmx-05-AccordionExample-images-upskin.jpg");
        downSkin: Embed("mashup-rmx-05-AccordionExample-images-downskin.jpg");
        overSkin: Embed("mashup-rmx-05-AccordionExample-images-overskin.jpg");
        selectedUpSkin: Embed("mashup-rmx-05-AccordionExample-images-selectedupskin.jpg");
        selectedDownSkin: Embed("mashup-rmx-05-AccordionExample-images-selecteddownskin.jpg");
        selectedOverSkin: Embed("mashup-rmx-05-AccordionExample-images-selectedoverskin.jpg");
      }
    </mx:Style>
  

    <mx:Script>
      <![CDATA[
              import mx.controls.Button;
      
        private function init():void
        {
          var totalPanes:Array = this.myAccordion.getChildren();
          for (var i:uint; i < totalPanes.length; i++)
          {
            var header:Button = this.myAccordion.getHeaderAt(i) as Button;
            header.buttonMode = true;
          }
        }
      ]]>
    </mx:Script>
  

    <mx:Accordion 
      id="myAccordion"
      width="100%" height="100%"
      headerStyleName="myHeaderStyle">
      
      <mx:Canvas label="My First Pane">
        <mx:Text text="Hello world!" fontSize="16"/>
      </mx:Canvas>
      <mx:Canvas label="My Second Pane">
        <mx:Text text="Hello world!" fontSize="16"/>
      </mx:Canvas>
    
    </mx:Accordion>
  </mx:Application>