LinkBar not resizing

programming flash
1

I’m using a Viewstack alongwith a LinkBar in my app. I add tabs dynamically to Viewstack (tabs are canvas objects) and the LinkBar dtaprovider is the viewstack itself. Now the tabs get added fine but the problem is that the linkbar does not expand itself to show all tabs. i mean it will show as many tabs as it can fit in the current size. It does not resize. See the code

Can someone tell me how can I make the linkbar resize with the growing tabs?


<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" backgroundColor="white">

    <mx:Script>
        <![CDATA[            
            import mx.controls.Button;            
            
            var i:int;

            private function btnClick():void
            {
                var can:Canvas = new Canvas();
                i++;
                can.label = String(i); 
                can.height = 300;
                can.width = 200;
                vs1.addChild(can);
            }
                    
        ]]>        
    </mx:Script>
        
    <mx:ViewStack x="50" y="60" id="vs1" width="278" height="203">
        <mx:Canvas id="cnv1" label="View 1" width="100%" height="100%">
            <mx:Label x="10" y="10" text="hi"/>
        </mx:Canvas>
        <mx:Canvas label="View 2" width="100%" height="100%">
            <mx:Button x="36" y="55" label="hello"/>
        </mx:Canvas>
        <mx:Canvas label="View 3" width="100%" height="100%">
            <mx:CheckBox x="27" y="21" label="chk1"/>
            <mx:CheckBox x="27" y="51" label="Checkbox"/>
            <mx:CheckBox x="27" y="81" label="Checkbox"/>
        </mx:Canvas>
    </mx:ViewStack>
    
    <mx:LinkBar x="50" y="43" width="277" dataProvider="vs1">
    </mx:LinkBar>
    <mx:Button x="50" y="288" label="Add new tabs" id="btnAdd" click="btnClick()"/>
    
</mx:Application>