Flex 4 List remembering verticalScrollPosition

A simple requirement, but ~6 hours of frustration.

All I wanted to do was to remember the scroll position that the user was at after an update of the dataprovider items on a list occurred. I had a solution in flex 3 for the (Advanced)DataGrid control that listened for a scroll event and remembered the last known scroll position that would then be set in commit properties after the dataProvider for the grid dispatched a COLLECTION_CHANGE event.

Naturally, I started with that same solution on the Flex 4 list. It was a little trickier, discovering that no event was fired from the list when a scroll event occurred. It turns out that in the skin class, you have to listen to the vertical scroll bar on the scroller object, but this of course is entirely dependent on where your scroller or viewport container that handles scrolling lives, regardless of skinclass.

So once setup, and listening for the event and remembering the scroll position, I still noticed that the list would scroll to the top of the list before snapping back to where it was – LAME.

After a couple of hours of tinkering and messing around, and a couple of failed attempts at figuring out what was setting the vertical scroll position to 0, I had an “I’VE HAD IT!” moment. I finally decided to watch the Datagroup (the scroller’s viewport) in stead of the scroller itself and low and behold, after setting up the scenario with a breakpoint finally in the right place, the following was discovered:

spark.components::DataGroup::commitProperties()

            // Don't reset the scroll positions until the new ItemRenderers have been
            // created, see bug https://bugs.adobe.com/jira/browse/SDK-23175
            if (dataProviderChanged)
            {
                dataProviderChanged = false;
                verticalScrollPosition = horizontalScrollPosition = 0;
            }

That’s lame. What are the places where dataProviderChanged is set to true? The exact condition I was using to set the scroll position to what I wanted. Guess what, the data provider hadn’t changed like their bug suggests, but only a refresh of the provider in stead.

The fix?

package
{
	import mx.collections.IList;
	import mx.events.CollectionEvent;
	
	import spark.components.DataGroup;
	
	public class DataGroup extends spark.components.DataGroup
	{
		private var _dataProviderChanged:Boolean;
		private var _lastScrollPosition:Number = 0;
		
		public function DataGroup()
		{
			super();
		}
		
		override public function set dataProvider(value:IList):void
		{
			if ( dataProvider != null && value != dataProvider )
			{
				dataProvider.removeEventListener(CollectionEvent.COLLECTION_CHANGE, onDataProviderChanged);
			}
			super.dataProvider = value;
			
			if ( value != null )
			{
				value.addEventListener(CollectionEvent.COLLECTION_CHANGE, onDataProviderChanged);
			}
		}
		
		override protected function commitProperties():void
		{
			var lastScrollPosition:Number = _lastScrollPosition;
			
			super.commitProperties();
			
			if ( _dataProviderChanged )
			{
				verticalScrollPosition = lastScrollPosition;
			}
		}
		
		private function onDataProviderChanged(e:CollectionEvent):void
		{
			_dataProviderChanged = true;
			invalidateProperties();
		}
		
		
		override public function set verticalScrollPosition(value:Number):void
		{
			super.verticalScrollPosition = value;
			_lastScrollPosition = value;
		}
	}
}

I’ve created a bug report for this if anyone is interested.

Advertisement