Problem
It is often desirable from a UX perspective to reset the position of a List back to where it was if the user has changed views and sees the same List again. For instance when using a List component for navigation between views.
Solution
Store the current scroll position when leaving the view and then reset the scroll position once the List has been built in another view.
Detailed explanation
Suppose you have a <List> and you want to change the scroll position to some specific value when it is created. You might want to do that when you're using a <List> as navigation and you want to return to the scrolled position that the <List> was in when the user clicked on it.
How do you do that? I know this issue kicked my ass for ages. Nothing I tried worked:
List - creationComplete - FAIL
List - updateComplete - FAIL
There are no events for the layout so that's a FAIL
I resorted to a hack where I would start a Timer, wait for about 33 milliseconds and then set the scroll position. While messy it worked flawlessly.
This issue came up recently and @dimitri_k helped me find the correct way to do this that is much less hacky. The trick is setting a listener on the <Lists> scroller. Here's the listener that is added in the creationComplete handler of the:
myList.scroller.addEventListener( FlexEvent.UPDATE_COMPLETE, onScrollerComplete );
And the onScrollerComplete looks like this:
private function onScrollerComplete( e:FlexEvent ):void {
ribbonListLayout.horizontalScrollPosition = TRON.ribbonScrollPosition;
ribbonList.scroller.removeEventListener( FlexEvent.UPDATE_COMPLETE, onScrollerComplete );
}
You'll definitely want to remove the listener after it fires the first time. Otherwise it will be called sporadically and will reposition the scroller as the user tries to scroll.
There is also this similar solution provided at Flexponential by two Adobe Flex sdk engineers: Saving scroll position between views in a mobile Flex Application.
+
This work is licensed under a Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License. Permissions beyond the scope of this license, pertaining to the examples of code included within this work are available at Adobe.
