Thanks Alex and Tracy. I've followed your suggestions and re-wrote the code and it now works.
Cheers, /Jan On 25/02/2008, Alex Harui <[EMAIL PROTECTED]> wrote: > > Renderers are recycled so they must be completely data-driven. Once > you set the selected property and change the styleName, the List might > repaint and use a different renderer for that line item. Usually, all > visual aspects of a renderer are driven from the data object and things like > owner.isSelected and owner.isHighlighted > > > ------------------------------ > > *From:* [email protected] [mailto:[EMAIL PROTECTED] *On > Behalf Of *Jan Huzelius > *Sent:* Monday, February 25, 2008 6:22 AM > *To:* [email protected] > *Subject:* [flexcoders] Set selected button on a custom ItemRenderer for a > List > > > > Hi, > > I have a List component that uses a custom renderer. > This renderer contains a button component. The button is skinned using > styles sheets. > > I want to be able to show a selected state on the button that is selected > but having no luck. > > I'm using Flex 3 and the skin for the button is done in Flash using the > new Flash CS3 component Kit and then imported into FlexBuilder using the new > artWork wizard. > > Please see the code below. Thanks for any pointers: > > /* skin for the button */ > > <mx:Style> > > .leftTabItemSkin{ > skin: Embed(skinClass="Button_skin"); > } > > </mx:Style>} > > /* List */ > > <comps:VList top="6" > id="vList" > dataProvider="{_sectionCollection.array}" > itemRenderer="{setRenderer()}" > backgroundAlpha="0" > width="100%" > change="{selectionChanged(event)}" > useRollOver="false" > rowHeight="65" > horizontalScrollPolicy="off" > verticalScrollPolicy="off" > borderStyle="none" > creationComplete="{this.selectedIndex = _selectedIndex}" > /> > > /* ItemRenderer, other code ommited */ > > > > public override function get data( ): Object > { > return _dataProvider; > } > public override function set data( data:Object ) : void > { > _dataProvider = Section ( data ); > } > > public function set selected(value:Boolean):void > { > _selected = value; > if (value) > { > mainCanvas.styleName = 'tabSelectedSkin'; > } > else > { > mainCanvas.styleName = 'tabUpSkin'; > } > } > > public function get selected():Boolean > { > return _selected; > } > > ]]> > </mx:Script> > > > <mx:Canvas id="mainCanvas" width="61" height="57" right="0" > verticalScrollPolicy="off" > horizontalScrollPolicy="off" mouseChildren="true"> > > <mx:Button styleName="leftTabItemSkin" id="itemButton" width="61" > height="57" /> > > <mx:Image autoLoad="true" source="{_dataProvider.thumb}" > scaleContent="false" verticalCenter="0" horizontalCenter="-2.5" /> > > </mx:Canvas> > > >
