Scroll to a Specific Child in a Container : Layout « Container « Flex
- Flex
- Container
- Layout
Scroll to a Specific Child in a Container
<mx:Application
xmlns:mx="http://www.adobe.com/2006/mxml"
layout="absolute">
<mx:Canvas width="800" height="600">
<mx:Script>
private function changeScrollToShowChild():void
{
vbox.verticalScrollPosition = (getChildrenHeight((comboBox.selectedItem as Number)+1)) - vbox.height + 40;
}
private function getChildrenHeight(index:int):Number
{
var i:int = 0;
var sumHeight:Number = 0;
while(i<index){
sumHeight += vbox.getChildAt(i).height;
i = i +1;
}
return sumHeight;
}
</mx:Script>
<mx:ComboBox id="comboBox" change="changeScrollToShowChild()">
<mx:dataProvider>
<mx:Array>
<mx:Number>1</mx:Number>
<mx:Number>2</mx:Number>
<mx:Number>3</mx:Number>
</mx:Array>
</mx:dataProvider>
</mx:ComboBox>
<mx:VBox width="650" height="300" id="vbox" backgroundColor="#0000ff" y="50"
verticalScrollPolicy="off" paddingLeft="50">
<mx:Panel height="150" width="550">
<mx:LinkButton label="First"/>
</mx:Panel>
<mx:Panel height="160" width="550">
<mx:LinkButton label="Second"/>
</mx:Panel>
<mx:Panel height="110" width="550">
<mx:LinkButton label="Third"/>
</mx:Panel>
</mx:VBox>
</mx:Canvas>
</mx:Application>
Related examples in the same category
