TileGroup组件可以很好的用来行列对齐
-
<?xml version="1.0" encoding="utf-8"?>
-
<!-- Simple example to demonstrate the Spark Group component. -->
-
<s:Application xmlns:fx=""
-
xmlns:s="library://ns.adobe.com/flex/spark"
-
xmlns:mx="library://ns.adobe.com/flex/mx" >
-
-
<s:Panel title="TileGroup Component Example"
-
width="75%" height="75%"
-
horizontalCenter="0" verticalCenter="0">
-
<s:VGroup left="10" right="10" top="10" bottom="10">
-
-
<s:TileGroup horizontalGap="40" verticalGap="4" requestedColumnCount="3">
-
<s:Button label="1" width="50" height="50" />
-
<s:Button label="2" width="50" height="50" />
-
<s:Button label="3" width="50" height="50" />
-
<s:Button label="4" width="50" height="50" />
-
<s:Button label="5" width="50" height="50" />
-
<s:Button label="6" width="50" height="50" />
-
<s:Button label="7" width="50" height="50" />
-
<s:Button label="8" width="50" height="50" />
-
<s:Button label="9" width="50" height="50" />
-
</s:TileGroup>
-
-
<s:TileGroup id="test" horizontalGap="120" verticalGap="20" >
-
<s:VGroup id="vGroup">
-
<s:HGroup id="hGroup1">
-
<s:Button label="1" width="50" height="50" />
-
<s:Button label="2" width="50" height="50" />
-
<s:Button label="3" width="50" height="50" />
-
</s:HGroup>
-
<s:HGroup id="hGroup2">
-
<s:Button label="4" width="50" height="50" />
-
<s:Button label="5" width="50" height="50" />
-
<s:Button label="6" width="50" height="50" />
-
<s:Button label="7" width="50" height="50" />
-
<s:Button label="8" width="50" height="50" />
-
<s:Button label="9" width="50" height="50" />
-
</s:HGroup>
-
</s:VGroup>
-
</s:TileGroup>
-
-
</s:VGroup>
-
</s:Panel>
-
-
</s:Application>
效果图:
注意:第二个TileGroup的horizontalGap设置的值没有用啊
阅读(5167) | 评论(0) | 转发(0) |