Flex 4中的List组件自动滚动

下面的例子中的scrollToIndex()方法向您展示了如何将滚动条滚动至特定的区域。

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2009/05/30/setting-the-vertical-scroll-position-on-a-spark-list-control-in-flex-4/ -->
<s:Application name="Spark_List_layout_VerticalLayout_verticalScrollPosition_test"
			   xmlns:fx="http://ns.adobe.com/mxml/2009"
			   xmlns:s="library://ns.adobe.com/flex/spark"
			   xmlns:mx="library://ns.adobe.com/flex/mx">
	<s:controlBarContent>
		<mx:Form styleName="plain">
			<mx:FormItem label="verticalScrollPosition:">
				<s:HSlider id="slider" />
			</mx:FormItem>
		</mx:Form>
	</s:controlBarContent>
	
	<fx:Script>
		<![CDATA[
			import mx.events.FlexEvent;
			
			protected function list_creationCompleteHandler(evt:FlexEvent):void {
				slider.maximum = list.dataGroup.contentHeight - list.height;
			}
		]]>
	</fx:Script>
	
	<s:List id="list"
			horizontalCenter="0"
			verticalCenter="0"
			creationComplete="list_creationCompleteHandler(event);">
		<s:layout>
			<s:VerticalLayout horizontalAlign="justify" 
							  requestedRowCount="4"
							  verticalScrollPosition="{slider.value}" />
		</s:layout>
		<s:dataProvider>
			<s:ArrayList>
				<fx:String>The</fx:String>
				<fx:String>Quick</fx:String>
				<fx:String>Brown</fx:String>
				<fx:String>Fox</fx:String>
				<fx:String>Jumps</fx:String>
				<fx:String>Over</fx:String>
				<fx:String>The</fx:String>
				<fx:String>Lazy</fx:String>
				<fx:String>Dog</fx:String>
			</s:ArrayList>
		</s:dataProvider>
	</s:List>
	
</s:Application>

下面的这个是自动滚动到List内容最下方：

<?xml version="1.0" encoding="utf-8"?>
<!-- shlei.iteye.com -->
<s:Application name="Spark_List_layout_VerticalLayout_verticalScrollPosition_test"
			   xmlns:fx="http://ns.adobe.com/mxml/2009"
			   xmlns:s="library://ns.adobe.com/flex/spark"
			   xmlns:mx="library://ns.adobe.com/flex/mx">
	<fx:Script>
		<![CDATA[
			import flash.utils.clearTimeout;
			import flash.utils.setTimeout;
			
			import mx.collections.ArrayCollection;
			import mx.events.FlexEvent;
			
			[Bindable]
			private var ac:ArrayCollection=new ArrayCollection();
			private var i:int=0;
			[Bindable]
			private var j:int;
			
			protected function list_creationCompleteHandler(evt:FlexEvent):void {
				add();
			}
			
			private function add():void{
				var k:uint = setTimeout(add,1000);
				i++;
				ac.addItem(i);
				/** 最主要的是下面这句，延迟获取List组件的内容高度最大值，否则拿不到内容高度最大值 **/
				if(-5<one())callLater(one);
				if(20==i)
					clearTimeout(k);
			}
			
			private function one():int{
				return j=list.dataGroup.contentHeight - list.height;
			}

		]]>
	</fx:Script>
	
	<s:List id="list"
			horizontalCenter="0"
			verticalCenter="0"
			dataProvider="{ac}"
			creationComplete="list_creationCompleteHandler(event);">
		<s:layout>
			<s:VerticalLayout horizontalAlign="justify" 
							  requestedRowCount="4"
							  verticalScrollPosition="{j}" />
		</s:layout>
	</s:List>
	
</s:Application>

参考 http://blog.flexexamples.com/2007/11/08/scrolling-to-a-specific-index-in-a-flex-list-control/
by  Peter Dehaan and others