<p>Here is the sample code for my accordion:</p>

<pre><code>&lt;mx:Accordion x="15" y="15" width="230" height="599" styleName="myAccordion"&gt;
    &lt;mx:Canvas id="pnlSpotlight" label="SPOTLIGHT" height="100%" width="100%" horizontalScrollPolicy="off"&gt;
        &lt;mx:VBox width="100%" height="80%" paddingTop="2" paddingBottom="1"  verticalGap="1"&gt;
            &lt;mx:Repeater id="rptrSpotlight" dataProvider="{aSpotlight}"&gt;            
                &lt;sm:SmallCourseListItem 
                    viewClick="PlayFile(event.currentTarget.getRepeaterItem().fileID);"
                    Description="{rptrSpotlight.currentItem.fileDescription}"
                    FileID = "{rptrSpotlight.currentItem.fileID}"   
                    detailsClick="{detailsView.SetFile(event.currentTarget.getRepeaterItem().fileID,this)}" 
                    Title="{rptrSpotlight.currentItem.fileTitle}"
                    FileIcon="{iconLibrary.getIcon(rptrSpotlight.currentItem.fileExtension)}" /&gt;
            &lt;/mx:Repeater&gt;
        &lt;/mx:VBox&gt;
    &lt;/mx:Canvas&gt;
&lt;/mx:Accordion&gt;
</code></pre>

<p>I would like to include a button in each header like so:</p>

<p><img src="https://i.stack.imgur.com/EN3kP.jpg" alt="wishful&quot; onclick=&quot;alert(&#39;xss&#39;)"></p>

[{'answer_id': 12266, 'author': 'Theo', 'author_id': 1109, 'author_profile': 'https://Stackoverflow.com/users/1109', 'pm_score': 1, 'selected': False, 'text': '<p>You will have to create a custom header renderer, add a button to it and position it manually. Try something like this:</p>\n\n<pre><code>&lt;mx:Accordion&gt;\n    &lt;mx:headerRenderer&gt;\n        &lt;mx:Component&gt;\n            &lt;AccordionHeader xmlns="mx.containers.accordionClasses.*"&gt;\n                &lt;mx:Script&gt;\n                &lt;![CDATA[\n\n                import mx.controls.Button;\n\n\n                private var extraButton : Button;\n\n\n                override protected function createChildren( ) : void {\n                    super.createChildren();\n\n                    if ( extraButton == null ) {\n                        extraButton = new Button();\n\n                        addChild(extraButton);\n                    }\n                }\n\n                override protected function updateDisplayList( unscaledWidth : Number, unscaledHeight : Number ) : void {\n                    super.updateDisplayList(unscaledWidth, unscaledHeight);\n\n                    extraButton.setActualSize(unscaledHeight - 6, unscaledHeight - 6);\n                    extraButton.move(unscaledWidth - extraButton.width - 3, (unscaledHeight - extraButton.height)/2);\n                }\n\n                ]]&gt;\n                &lt;/mx:Script&gt;\n            &lt;/AccordionHeader&gt;\n        &lt;/mx:Component&gt;\n    &lt;/mx:headerRenderer&gt;\n\n    &lt;mx:HBox label="1"&gt;&lt;Label text="Text 1"/&gt;&lt;/HBox&gt;\n    &lt;mx:HBox label="1"&gt;&lt;Label text="Text 2"/&gt;&lt;/HBox&gt;\n    &lt;mx:HBox label="1"&gt;&lt;Label text="Text 3"/&gt;&lt;/HBox&gt;\n&lt;/mx:Accordion&gt;\n</code></pre>\n'}, {'answer_id': 12310, 'author': 'Shawn', 'author_id': 26, 'author_profile': 'https://Stackoverflow.com/users/26', 'pm_score': 3, 'selected': True, 'text': '<p>Thanks, I got it working using <a href="http://code.google.com/p/flexlib/" rel="nofollow noreferrer">FlexLib</a>\'s CanvasButtonAccordionHeader.</p>\n'}]
['https://Stackoverflow.com/questions/11665', 'https://Stackoverflow.com', 'https://Stackoverflow.com/users/26/']