So like this (just in case someone is looking for a solution to the same problem):
<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"; layout="absolute"> <mx:Style> TabNavigator{ tabStyleName: "tabs"; horizontalGap:0; } .tabs{ borderColor:#ffffff; fillColors: #7bd3f7, #7bd3f7; fillAlphas: 1,1; highlightAlphas: .5,0; } </mx:Style> <mx:TabNavigator horizontalCenter="0" verticalCenter="0" resizeToContent="true" cornerRadius="10" paddingTop="0" paddingRight="10" paddingBottom="10" borderColor="#ffffff" borderStyle="solid" borderThickness="0" creationPolicy="all"> <mx:Canvas label="Tab 1" width="300" height="300" backgroundColor="#ffffff" borderStyle="solid" borderColor="#ffffff"/> <mx:Canvas label="Tab 2" width="300" height="200" backgroundColor="#ffffff"/> <mx:Canvas label="Tab 3" width="300" height="100" backgroundColor="#ffffff"/> <mx:Canvas label="Tab 4" width="300" height="50" backgroundColor="#ffffff"/> </mx:TabNavigator> </mx:Application> --- In [email protected], "iko_knyphausen" <[EMAIL PROTECTED]> wrote: > > > Thanks this was very helpful. I got rid of the tiny gap, by setting the > tab navigators bordercolor and the tabDetails bordercolor to the same as > the background color of the container... looks perfect. Thanks again - > Iko > > > --- In [email protected], "scalenine" <juan@> wrote: > > > > Try this: > > > > <?xml version="1.0" encoding="utf-8"?> > > <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"; > > layout="absolute"> > > <mx:TabNavigator horizontalCenter="0" verticalCenter="0" > > resizeToContent="true" cornerRadius="10" paddingTop="0" > > paddingRight="10" paddingBottom="10"> > > <mx:Canvas label="Tab 1" width="300" height="300" > > backgroundColor="#ffffff"/> > > <mx:Canvas label="Tab 2" width="300" height="200" > > backgroundColor="#ffffff"/> > > <mx:Canvas label="Tab 3" width="300" height="100" > > backgroundColor="#ffffff"/> > > <mx:Canvas label="Tab 4" width="300" height="50" > > backgroundColor="#ffffff"/> > > </mx:TabNavigator> > > </mx:Application> > > > > I just added a white fill color and some padding to the bottom and top > > of the tab navigator. The only thing is a small gap in the border on > > the left where the TabNav corner curves. > > > > The other thing you could do is create an image to use as the > > background with some 9-slice proerties on it that has 3 rounded > > corners and one not. > > > > Or check out some custom border components out there that might help > > you get the effect your looking for. > > > > Juan > > scalenine.com > > > > --- In [email protected], "iko_knyphausen" iko@ wrote: > > > > > > > > > Hello, > > > > > > I am trying to use rounded corners (cornerRadius) on a tab > navigator. > > > Unfortunately it also rounds the upper left corner of the first > canvas > > > which makes it unsightly. One could use paddingLeft to move the tabs > a > > > little to the right, but that doesn't look to great either. One > could > > > "underlay" the tab navigator at the upper left corner with a > > > mini-canvas, but that only works, if you have no border. I need a > solid > > > border... > > > > > > Has anyone come up with a good solution for this? > > > > > > Thanks a mill.. > > > > > >
