flex grid 畫表，用來做報表

在Flex中 和表格最接近的組件就是Grid了(但是默認的方式只是用來layout,不會顯示錶格的邊框)，
把Grid拖放到容器中，輸入行列數。在文件中加入如下css代碼
就可以看到黑邊框的表格了！

<mx:Style>
    Grid{
        horizontalGap:0;
        verticalGap:0;
        borderThickness:1;
        borderSides:bottom,right;
        borderStyle:solide;
        borderColor:#000000;
    }
    GridItem{
        borderSides:left,top;
        borderThickness:1;
        borderStyle:solid;
        borderColor:#000000;
    }
</mx:Style>

 

可以用<mx:Grid width="100%" height="100%" horizontalGap="0" verticalGap="0">
         <mx:GridRow width="100%" height="20" >
            <mx:GridItem width="15%" borderStyle="solid" borderThickness="1" verticalAlign="middle" horizontalAlign="center">
                <mx:label text="銷售單位"/>
            </mx:GridItem>
            <mx:GridItem colSpan="3" width="85%" borderStyle="solid" borderThickness="1">
                <mx:TextInput borderStyle="none" width="100%"/>
            </mx:GridItem>
         </mx:GridRow>
     </mx:Grid>
就像HTML裏的table一樣，
GridRow 相當於行
GridItem相當於列，
再用colspan或者rowspan進行合併，
達到你想要的效果，