Flex中如何通过设定headerStyleName样式在Accordion控件中使用嵌入字体的例子

Accordion控件可以说是一个非常不错的东西，在很多场合可以为我们节省应用程序的空间。Accordion中使用自定义字体的话可以使我们的应用更加个性化。接下来的例子演示了Flex中如何通过设定headerStyleName样式，在Accordion控件中使用嵌入字体。

我们先来看一下Demo（

可以右键View Source或点击这里察看源代码

）

：

下面是完整代码(或点击这里查看)：
Download: main.mxml

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical"
verticalAlign="middle"
backgroundColor="white">

<mx:Style>
@font-face {
src: local("Base 02");
fontFamily: EmbeddedBase02;
}

Accordion {
headerStyleName: accordionHeaderStyleName;
}

.accordionHeaderStyleName {
fontFamily: EmbeddedBase02;
fontWeight: normal;
}
</mx:Style>

<mx:Accordion id="accordion"
creationPolicy="all"
width="100%"
height="100%">
<mx:VBox label="Red"
backgroundColor="red"
width="100%"
height="100%">
</mx:VBox>
<mx:VBox label="Orange"
backgroundColor="haloOrange"
width="100%"
height="100%">
</mx:VBox>
<mx:VBox label="Yellow"
backgroundColor="yellow"
width="100%"
height="100%">
</mx:VBox>
<mx:VBox label="Green"
backgroundColor="haloGreen"
width="100%"
height="100%">
</mx:VBox>
<mx:VBox label="Blue"
backgroundColor="haloBlue"
width="100%"
height="100%">
</mx:VBox>
</mx:Accordion>

</mx:Application>