How to use scroller containing two forms in adobe flex?

Question

I have layout with two forms. I'm using scroller but scrollbars don't align to window but appear somewhere in the middle of the application screen.

<s:WindowedApplication 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:Scroller width="601" height="539">

<s:Group >

<s:Form  x="5" y="10" >
    <s:FormItem width="265" label="Name:" textAlign="right">
        <s:TextInput width="150"/>
    </s:FormItem>
            ...
</s:Form>
<s:Form x="300" y="10">
    <s:FormItem width="265" label="Color:" textAlign="right">
        <s:TextInput width="150"/>
    </s:FormItem>
            ...
</s:Form>

</s:Group>
</s:Scroller>
</s:WindowedApplication>

Below You can see screen-shot of my app. There is no scrollbars at the borders.

Here is the screen-shot with scroller set to width and height to 300 pixels. As You can see the scrollbar is not attached to window.

Answer 1

If you want the scroll bar on the right, to be on the right of the window, then set the width to 100%. Same for the height.

if you want the whole WindowedApplication to scroll, enable scrolling on the WindowedApplication in the properties tab, or add a canvas that is full width and height.