Highlighting accordion selected item header in Flex 3
Peter deHaam in his blog presented idea how to highlight selected header in accordion component. Unfortunately his example does not work if you compile source code in Flex 3 Builder. In Flex 3, the accordion header no longer gets its styleName set to the accordion. Instead, it only gets assigned to the headerStyleName style if one is specified. Flex 2 and 3 behaviors differences in you can find it here.
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical"
verticalAlign="middle"
backgroundColor="white"
viewSourceURL="srcview/index.html">
<mx:Style>
.accHeader {
selectedFillColors: haloBlue, haloBlue;
}
</mx:Style>
<mx:Accordion width="400" height="120" headerStyleName="accHeader">
<mx:VBox id="child1" label="Child 1" />
<mx:VBox id="child2" label="Child 2" />
<mx:VBox id="child3" label="Child 3" />
</mx:Accordion>
</mx:Application>
View source is enabled in the following example.