flex的Accordion组件头部文本居中显示

flex的Accordion组件头部文本默认是居左的，可以通过设置headerStyleName属性使之居中，另外还可以设置字体的样式等

 1 <?xml version="1.0" encoding="utf-8"?>
 2 <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
 3                xmlns:s="library://ns.adobe.com/flex/spark"
 4                xmlns:mx="library://ns.adobe.com/flex/mx"
 5                width="100%" height="100%">
 6
 7     <fx:Script>
 8         <![CDATA[
 9             import mx.collections.ArrayCollection;
10
11             [Bindable]
12             private var sex:ArrayCollection = new ArrayCollection(
13                 [{name:"男", value:1}, {name:"女", value:2}]);
14         ]]>
15     </fx:Script>
16
17     <fx:Style>
18         .accordionHeader{textAlign:center;fontWeight:bold; fontSize:12}
19     </fx:Style>
20
21     <mx:Accordion width="200" height="80%" left="20" top="20"
22                   headerStyleName="accordionHeader">
23         <s:NavigatorContent width="100%" height="100%" label="个人信息" >
24             <s:VGroup width="100%" height="100%" top="10" gap="10">
25                 <s:HGroup width="100%" horizontalAlign="center">
26                     <s:Label text="姓名：" verticalAlign="middle" height="25"/>
27                     <s:TextInput width="100" height="25"/>
28                 </s:HGroup>
29                 <s:HGroup width="100%" horizontalAlign="center">
30                     <s:Label text="性别：" verticalAlign="middle" height="25"/>
31                     <s:DropDownList width="100" height="25" dataProvider="{sex}"
32                                     labelField="name" prompt="保密"/>
33                 </s:HGroup>
34                 <s:HGroup width="100%" horizontalAlign="center">
35                     <s:Label text="年龄：" verticalAlign="middle" height="25"/>
36                     <s:TextInput width="100" height="25" restrict="0-9" maxChars="2"/>
37                 </s:HGroup>
38                 <s:HGroup width="100%" horizontalAlign="center">
39                     <s:Label text="职业：" verticalAlign="middle" height="25"/>
40                     <s:TextInput width="100" height="25"/>
41                 </s:HGroup>
42                 <s:HGroup width="100%" horizontalAlign="center">
43                     <s:Label text="住址：" verticalAlign="middle" height="25"/>
44                     <s:TextInput width="100" height="25"/>
45                 </s:HGroup>
46             </s:VGroup>
47         </s:NavigatorContent>
48         <s:NavigatorContent width="100%" height="100%" label="情况反馈">
49             <s:VGroup width="100%" height="100%" top="10" gap="10"
50                       horizontalAlign="center">
51                 <s:Label text="个人情况反馈" verticalAlign="middle" fontWeight="bold" color="blue"/>
52                 <s:TextArea height="80%" borderColor="black"/>
53             </s:VGroup>
54         </s:NavigatorContent>
55         <s:NavigatorContent width="100%" height="100%" label="提交信息">
56             <s:VGroup width="100%" height="100%" top="10" gap="10"
57                       horizontalAlign="center">
58                 <s:HGroup width="100%" horizontalAlign="center">
59                     <s:Label text="方式：" verticalAlign="middle" height="20"/>
60                     <s:RadioButton label="匿名" groupName="radiogroup1" selected="true"/>
61                     <s:RadioButton label="实名" groupName="radiogroup1"/>
62                 </s:HGroup>
63                 <s:Button width="70%" label="提  交" fontSize="14"/>
64             </s:VGroup>
65         </s:NavigatorContent>
66     </mx:Accordion>
67 </s:Application>

flex的Accordion组件头部文本居中显示