目前据我观察Accordion的标题样式无法直接更改,需要通过Accordion的headerStyleName引用CSS样式中的Skin,并创建一个Skin来设置其样式。
Application:
<s:Panel title="灾后恢复重建" skinClass="skins.rebuild.RebuildList_Skin">
<mx:Accordion width="219" headerHeight="36" headerStyleName="AccordionHeader">
<s:NavigatorContent label=" 制度建设与规划编制" height="32">
<s:VGroup>
<s:Button label=" 过渡安置与生活重建中需关注的问题"
skinClass="skins.rebuild.RebuildButton_Skin"
click="button1_clickHandler(event)"/>
</s:VGroup>
</s:NavigatorContent>
</mx:Accordion>
CSS:
.AccordionHeader
{
skin:ClassReference("skins.rebuild.Accordion_Skin");
}
Skin::
<?xml version="1.0" encoding="utf-8"?>
<s:SparkSkin xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx">
<s:states>
<s:State name="up" />
<s:State name="over" />
<s:State name="down" />
<s:State name="disabled" />
<s:State name="selectedUp" />
<s:State name="selectedOver" />
<s:State name="selectedDown" />
<s:State name="selectedDisabled" />
</s:states>
<s:BorderContainer width="219" height="36"
backgroundImage.up="@Embed('images/content/rebuild/button_common.jpg')"
backgroundImage.over="@Embed('images/content/rebuild/button_over.jpg')"
backgroundImage.down="@Embed('images/content/rebuild/button_click.jpg')"
backgroundImage.selectedUp="@Embed('images/content/rebuild/button_after.jpg')"/>
</s:SparkSkin>