2、 ss.mxml
2、 SimpleItemRenderer.mxml
3、CircularLayout.as
<?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/halo"
xmlns:local="*"
creationComplete="init();">
<fx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
private var dataSource:ArrayCollection = new ArrayCollection();
public function init():void{
for(var i:int = 0; i < 10; i++){
dataSource.addItem(i);
}
dataGroupID.dataProvider = dataSource;
}
]]>
</fx:Script>
<s:DataGroup id="dataGroupID" width="100%" height="100%" itemRenderer="SimpleItemRenderer">
<s:layout>
<local:CircularLayout /> <!--自定义布局类:CircularLayout.其只在DataGroup初始化的时候执行一次-->
</s:layout>
</s:DataGroup>
<mx:Button label="点击添加按钮" click="dataSource.addItem(dataSource.length)" />
</s:Application>
2、 SimpleItemRenderer.mxml
<s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/halo">
<s:layout>
<s:BasicLayout/>
</s:layout>
<s:Button label="{this.data}"/>
</s:ItemRenderer>
3、CircularLayout.as
package{
import mx.core.ILayoutElement;
import spark.layouts.supportClasses.LayoutBase;
public class CircularLayout extends LayoutBase{
override public function updateDisplayList(w:Number, h:Number):void{
super.updateDisplayList(w, h);
var layoutElement:ILayoutElement;
if(!target){
return;
}
var count:uint = target.numElements; //当前dataGroup容器里的所有组件的总数量
var w2:Number = target.width; //当前浏览器的宽度
var h2:Number = target.height; //当前浏览器的高度
for(var i:int = 0; i < count; i++){
layoutElement = target.getElementAt(i);
if (!layoutElement || !layoutElement.includeInLayout){
continue;
}
layoutElement.setLayoutBoundsPosition(i * 100, i + 350); //对每一个组件进行遍历及定位(分别表示x、y轴)(核心啊)
}
}
}
}