hi, i have a resizable datagroup (vertical layout) and i want to have a itemrenderer with a rectangle that fits the with of the datagroup. i have tried itemrenderer width="100%" or left=0 right=0 but does not work when it is resized by the states. am i doing something wrong here or is it a gumbo bug?
>>>>>>> <s:List id="meetingsList" skinClass="ui.components.MeetingsList" right="0" left="0" top="0" bottom="40"> <s:ArrayCollection> <fx:Object hour="xxx" date="xxx" info="asdkjha sdlkajsd lakjds" status="xxx"/> </s:ArrayCollection </s:List> >>>>>>> <?xml version="1.0" encoding="utf-8"?> <s:Skin xmlns:s="library://ns.adobe.com/flex/spark" xmlns:fx="http://ns.adobe.com/mxml/2009"> <s:states> <s:State name="normal"/> <s:State name="disabled"/> </s:states> <fx:Metadata>[HostComponent("spark.components.List")]</fx:Metadata> <s:DataGroup itemRenderer="ui.components.MeetingsListRenderer" left="0" right="16" top="0" bottom="0" clipAndEnableScrolling="true" id="dataGroup" > <s:layout> <s:VerticalLayout gap="10" /> </s:layout> </s:DataGroup> <s:VScrollBar right="0" top="0" bottom="0" skinClass="ui.components.VScrollBar" fixedThumbSize="false" id="vscrollbar" viewport="{dataGroup}"/> </s:Skin> >>>>>>>>>> <?xml version="1.0" encoding="utf-8"?> <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" width="100%"> <fx:Script> <![CDATA[ import events.MeetingsEvent; import spark.skins.default.ButtonSkin; override public function set data( value:Object ):void { super.data = value; if (value) { closedRect.visible = false; closedRect.includeInLayout = false; availableRect.visible = false; availableRect.includeInLayout = false; alertRect.visible = false; alertRect.includeInLayout = false; switch (data.status) { case "alert": alertRect.visible = true; alertRect.includeInLayout = true; break; case "closed": closedRect.visible = true; closedRect.includeInLayout = true; break; case "available": availableRect.visible = true; availableRect.includeInLayout = true; break; } } } ]]> </fx:Script> <s:transitions> <s:Transition toState="selected" autoReverse="true"> <s:Parallel> <s:Fade target="{expandGroup}" duration="300" /> <s:Resize target="{this}" duration="300" /> </s:Parallel> </s:Transition> <s:Transition toState="normal" autoReverse="true"> <s:Parallel> <s:Fade target="{expandGroup}" duration="300" /> <s:Resize target="{this}" duration="300" /> </s:Parallel> </s:Transition> </s:transitions> <s:states> <s:State name="normal"/> <s:State name="hovered"/> <s:State name="selected"/> </s:states> <s:Group height="60" left="0" right="0" top="0"> <s:Rect id="closedRect" left="0" right="0" top="0" bottom="0"> <s:fill> <s:LinearGradient x="0" scaleX="60" rotation="90"> <s:GradientEntry color="0xf1f1f1" ratio="0"/> <s:GradientEntry color="0xe6e6e6" ratio="1"/> </s:LinearGradient> </s:fill> </s:Rect> <s:Rect id="availableRect" left="0" right="0" top="0" bottom="0"> <s:fill> <s:LinearGradient x="0" scaleX="60" rotation="90"> <s:GradientEntry color="0xa7e9a4" ratio="0"/> <s:GradientEntry color="0x88e284" ratio="1"/> </s:LinearGradient> </s:fill> </s:Rect> <s:Rect id="alertRect" left="0" right="0" top="0" bottom="0"> <s:fill> <s:LinearGradient x="0" scaleX="60" rotation="90"> <s:GradientEntry color="0xfdf799" ratio="0"/> <s:GradientEntry color="0xfcee21" ratio="1"/> </s:LinearGradient> </s:fill> </s:Rect> <s:Rect id="highlight" left="0" right="0" top="0" bottom="0" alpha.normal="0" alpha.hovered="0.1" alpha.selected="0.2" > <s:fill> <s:SolidColor color="0xFFFFFF"/> </s:fill> </s:Rect> <s:SimpleText left="12" top="32" right="12" fontFamily="Lucida Grande" fontSize="18" fontWeight="bold" lineHeight="120%" color="0x1a1a1a" kerning="on" text="{data.hour}" /> <s:SimpleText left="12" top="12" right="12" fontFamily="Lucida Grande" fontSize="14" fontWeight="bold" lineHeight="120%" color="0x1a1a1a" kerning="on" text="{data.date}" /> </s:Group> </s:ItemRenderer>