How to enable vertical scroll in a flex mobile View?

Question

At runtime when I click the Lire button then the TextArea field under it is populated from a sharedobject data and the display becomes bigger :

Here is code :

<?xml version="1.0" encoding="utf-8"?>
<s:View xmlns:fx="http://ns.adobe.com/mxml/2009" 
        xmlns:mx="library://ns.adobe.com/flex/mx"
        xmlns:s="library://ns.adobe.com/flex/spark" title=""
        creationComplete="creationCompleteHandler(event)" >
...
<s:VGroup width="100%" height="100%" paddingTop="5" verticalAlign="middle" horizontalAlign="center">
            <s:TextInput id="chp1" width="50%"/>
            <s:TextInput id="chp2" width="50%"/>
            <s:Button label="Enregistrer" click="enregistrer(event)" />
            <s:Label/>
            <s:Button label="Lire" click="lire(event)" />
            <s:TextArea id="area"/>
            <s:Label/>
            <s:HGroup> 
                <s:Button label="Envoyer" click="send(event)" />
                <s:Button label="Retour" click="navigator.popView()" />
            </s:HGroup>
            <s:TextArea id="resultHTTP"/>
            <s:TextInput id="h_url" text="{url}" visible="false"/>
</s:VGroup>

How to enable vertical scroll then to view others components at the bottom ?

Answer 1

wrap your VGroup with a scroller. something like this: 's:Scroller width="100%" height="100%" s:VGroup width="100%" height="100%" paddingTop="5" verticalAlign="middle" horizontalAlign="center"'