Advanceddatagrid implementation of double table Header table
(1) Source code
Advancegrid.mxml
Copy Code code as follows:
<?xml version= "1.0" encoding= "Utf-8"?>
<s:application xmlns:fx= "http://ns.adobe.com/mxml/2009"
Xmlns:s= "Library://ns.adobe.com/flex/spark"
xmlns:mx= "Library://ns.adobe.com/flex/mx"
Width= "100%" height= "100%" >
<s:layout>
<s:horizontallayout verticalalign= "Middle" horizontalalign= "center"/>
</s:layout>
<fx:Declarations>
</fx:Declarations>
<fx:Style>
@namespace S "Library://ns.adobe.com/flex/spark";
@namespace mx "LIBRARY://NS.ADOBE.COM/FLEX/MX";
. adv{
Font-size:12;
Font-weight:bold;
COLOR:FFFFFF;
}
</fx:Style>
<fx:Script>
<! [cdata[
Import mx.collections.ArrayCollection;
[bindable]
private var flatarray:arraycollection = new ArrayCollection ([
{school: "Star Art High School", One: "5645", Two: "4512", Three: "4545", Man: "8656", Woman: "6545", Chinese: "The", Maths: "The", Chinese: "98" },
{School: "Enrichment High School", One: "5665", Two: "4512", Three: "6563", Man: "8565", Woman: "6541", Chinese: "", "Maths:" "," Chinese: "65" },
{school: "theory One", A: "6545", Two: "6562", Three: "5623", Man: "8754", Woman: "6214", Chinese: "Maths", "86" },
{school: "Nurse name High School", One: "5623", Two: "2356", Three: "4512", Man: "8574", Woman: "6354", Chinese: "The", Maths: "The", Chinese: "69" },
{School: "Bamboo Art High School", One: "4545", Two: "7545", Three: "5623", Man: "8547", Woman: "6352", Chinese: "The", Maths: "" "," Chinese: "87" },
{School: "Essence High School", One: "6565", Two: "4512", Three: "4512", Man: "8354", Woman: "6854", Chinese: "The", Maths: "The", Chinese: "97" }
]);
]]>
</fx:Script>
<mx:vbox width= "100%" height= "100%" paddingbottom= "ten" paddingleft= "ten" paddingright= "ten" paddingtop= "ten" >
<mx:advanceddatagrid id= "ADG" dataprovider= "{Flatarray}" designviewdatatype= "flat" width= "100%" height= "100%"
paddingbottom= "paddingleft=" "paddingright=" "paddingtop=" verticalalign= "Middle"
textalign= "center" headerseparatorskin= "Mx.skins.ProgrammaticSkin" headercolors= "[0xb0c4de,0xb0c4de]"
Headerstylename= "ADV" >
<mx:groupedColumns>
<mx:advanceddatagridcolumn headertext= "School" datafield= "school"/>
<mx:advanceddatagridcolumngroup headertext= "Class" >
<mx:advanceddatagridcolumn headertext= "One" datafield= "one"/>
<mx:advanceddatagridcolumn headertext= "sophomore" datafield= "two"/>
<mx:advanceddatagridcolumn headertext= "senior three" datafield= "three"/>
</mx:AdvancedDataGridColumnGroup>
<mx:advanceddatagridcolumngroup headertext= "Gender" >
<mx:advanceddatagridcolumn headertext= "Men" datafield= "man"/>
<mx:advanceddatagridcolumn headertext= "female" datafield= "woman"/>
</mx:AdvancedDataGridColumnGroup>
<mx:advanceddatagridcolumngroup headertext= "Course" >
<mx:advanceddatagridcolumn headertext= "Language" datafield= "Chinese"/>
<mx:advanceddatagridcolumn headertext= "Mathematics" datafield= "maths"/>
<mx:advanceddatagridcolumn headertext= "English" datafield= "中文版"/>
</mx:AdvancedDataGridColumnGroup>
</mx:groupedColumns>
</mx:AdvancedDataGrid>
</mx:VBox>
</s:Application>
(2) Display results