When I first began playing with Flex 4.5 mobile controls, I noticed something odd with the Spark List control. If the amount of data was bigger than the screen, it would "spring" back when your finger left the control. You could scroll down - sure - but the second you let go of the control it scrolled back to the top. I have no idea why this fixes it, but if you simply add height="100%" to your list, it corrects the issue. It doesn't seem to do anything visually to the output at all, but it corrects it immediately. Here is a simple example. First, my top level file will define a list that two sub views will use:
<?xml version="1.0" encoding="utf-8"?> <s:TabbedViewNavigatorApplication xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark"> <fx:Script> <![CDATA[ import mx.collections.ArrayCollection; [Bindable] public var demo:ArrayCollection = new ArrayCollection([ "Apple", "Banana", "Beer", "Garbage", "Wine", "Ray", "Jeanne", "Zoid", "CFSilence", "Adrok", "dfgrump", "Rinaldi", "Greg", "Phones", "Are", "Little", "Miniature", "Spy", "Camera"]); ]]> </fx:Script> <s:ViewNavigator label="Broken" width="100%" height="100%" firstView="views.BrokenView"/> <s:ViewNavigator label="Fixed" width="100%" height="100%" firstView="views.FixedView"/> <fx:Declarations> <!-- Place non-visual elements (e.g., services, value objects) here --> </fx:Declarations> </s:TabbedViewNavigatorApplication>
Here is the broken view - it will exhibit the behavior I described above:
<fx:Script> <![CDATA[ import mx.core.FlexGlobals; ]]> </fx:Script> <s:List dataProvider="{FlexGlobals.topLevelApplication.demo}" width="100%" /> </s:View><?xml version="1.0" encoding="utf-8"?> <s:View xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" title="Broken">
And here is the good version. The only difference is the addition of the height.
<fx:Script> <![CDATA[ import mx.core.FlexGlobals; ]]> </fx:Script> <s:List dataProvider="{FlexGlobals.topLevelApplication.demo}" width="100%" height="100%" /> </s:View><?xml version="1.0" encoding="utf-8"?> <s:View xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" title="Fixed">
I've attached the FXP if you want to play with this yourself.