Hi All, Is it possible to extend the LinkBar and have "close" buttons on each of the LinkButtons of the LinkBar? I don't find an "itemRenderer" property with the LinkBar control so that I can use a custom item renderer to render the LinkButtons on the bar.
Is anyone aware of any such component? Appreciate any help. Thanks Bhaskar --- In flexcoders@yahoogroups.com, "valdhor" <steved...@...> wrote: > > LinkBars have LinkButtons as their underlying components so something > like the following should do it: > > <?xml version="1.0"?> > <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"; > xmlns:local="*" > creationComplete="onCreationComplete()"> > <mx:Script> > <![CDATA[ > import mx.controls.LinkButton; > > private function onCreationComplete():void > { > var linkBarChildren:Array = theLinkBar.getChildren(); > for(var i:int = 0 ; i < linkBarChildren.length ; i++) > { > var curentLinkButton:LinkButton = linkBarChildren[i] > as LinkButton; > > curentLinkButton.addEventListener(MouseEvent.MOUSE_OVER, onMouseOver); > > curentLinkButton.addEventListener(MouseEvent.MOUSE_OUT, onMouseOut); > } > } > > private function onMouseOver(event:MouseEvent):void > { > (event.target as LinkButton).setStyle("textDecoration", > "underline"); > } > > private function onMouseOut(event:MouseEvent):void > { > (event.target as LinkButton).setStyle("textDecoration", > "none"); > } > ]]> > </mx:Script> > <mx:Panel title="LinkBar Control Example" height="75%" width="75%" > horizontalAlign="center" > paddingTop="10" paddingBottom="10" paddingLeft="10" > paddingRight="10"> > <mx:LinkBar id="theLinkBar" color="#0000FF" fontWeight="bold" > dataProvider="{myViewStack}"/> > <!-- Define the ViewStack and the two child containers. --> > <mx:ViewStack id="myViewStack" borderStyle="solid" width="100%" > height="80%"> > <mx:Canvas id="search" backgroundColor="#FFFFCC" > label="Search" width="100%" height="100%"> > <mx:Label text="Search Screen" color="#000000"/> > </mx:Canvas> > <mx:Canvas id="custInfo" backgroundColor="#CCFFFF" > label="Customer Info" width="100%" height="100%"> > <mx:Label text="Customer Info" color="#000000"/> > </mx:Canvas> > <mx:Canvas id="accountInfo" backgroundColor="#FFCCFF" > label="Account Info" width="100%" height="100%"> > <mx:Label text="Account Info" color="#000000"/> > </mx:Canvas> > </mx:ViewStack> > </mx:Panel> > </mx:Application> > > > > --- In flexcoders@yahoogroups.com, "Mark" <markp.shopping_id@> wrote: > > > > I found this great post out there on how to remove the highlight > > from a LinkButton. This post shows how to put the underline under > > the text on rollOver which is what I need. But I'm using a LinkBar, > > can someone help with this on the LinkBar? > > > > Thanks, > > Mark > > > > package > > { > > import flash.events.MouseEvent; > > import mx.controls.LinkButton; > > public class LinkButtonEx extends LinkButton > > { > > public function LinkButtonEx() { > > super(); > > addEventListener(MouseEvent.MOUSE_OVER, onMouseOver); > > addEventListener(MouseEvent.MOUSE_OUT, onMouseOut); > > } > > public function onMouseOver(event:MouseEvent):void { > > this.setStyle("textDecoration", "underline"); > > } > > // > > public function onMouseOut(event:MouseEvent):void { > > this.setStyle("textDecoration", "none"); > > } > > // > > protected override function rollOverHandler > > (event:MouseEvent):void { > > // We don't want the rollOver highlight > > } > > > > protected override function mouseDownHandler > > (event:MouseEvent):void { > > // We don't want the rollOver highlight > > } > > > > } > > } > > >
