Hi I have tilelist which have checkboxs as itemrenderer. The tilelist has four columns and three rows. All the months are displayed in tilelist.Each month is represented by the check box.The problem i am facing is that checkboxs are not aligned properly.If you run the code below then months ( Mar,Jul,Nov are not in the single column ). Same is the case with (Jan,May and Sept) but Apr,Aug and Dec are displayed properly.
I have put lot of time but i cannot find the solution. Any pointers ........ I am kind of stuck..... Thanks ilikelfex <?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"; layout="absolute" creationComplete="onCreationComplete()"> <mx:Script> <![CDATA[ import com.ms.sow.crt.messages.util.MessagesConstants; import mx.collections.ArrayCollection; public function onCreationComplete():void { monthsTileList.dataProvider = getMonthListCollection(); monthsTileList.setStyle("useRollOver",false); monthsTileList.setStyle("selectionColor","#FFFFFF"); } private function getMonthListCollection():ArrayCollection { var monthsCollection:ArrayCollection = new ArrayCollection(getAllMonths()); return monthsCollection; } public static function getAllMonths():Array { var listArray:Array=[ {label: "Jan", value: "isJanuary"},{label: "Feb", value: "isFebruary"}, {label: "Mar", value: "isMarch"},{label: "Apr", value: "isApril"}, {label: "May", value: "isMay"},{label: "Jun", value: "isJune"}, {label: "Jul", value: "isJuly"},{label: "Aug", value: "isAugust"}, {label: "Sep", value: "isSeptember"},{label: "Oct", value: "isOctober"}, {label: "Nov", value: "isNovember"},{label: "Dec", value: "isDecember"}]; return listArray; } ]]> </mx:Script> <mx:VBox width="30%" height="50%"> <mx:TileList id="monthsTileList" rowCount="3" width="100%" minWidth="200" columnCount="4" itemRenderer="com.ms.sow.crt.messages.view.MonthsCheckBox" direction="horizontal"/> </mx:VBox> </mx:Application> ---------------------------------------------------------------------- ItemRenderer package com.ms.sow.crt.messages.view { import flash.events.Event; import mx.controls.CheckBox; [Event(name="monthChange", type="flash.events.Event")] public class MonthsCheckBox extends CheckBox { public function MonthsCheckBox() { super(); addEventListener(Event.CHANGE,onChange); } override public function set data(item:Object):void { if ( item ) { super.data = item; this.selected = item.selected; } } private function onChange(event:Event):void { dispatchEvent(new Event("monthChange",true)); } } }
