Thursday, 17 November 2011

Scroller following Focus

private function scrollToFocus(e:FocusEvent):void
{
                if (!SCROLLER.verticalScrollBar.visible) return;
               
                var focus:DisplayObject = e.currentTarget as DisplayObject;
               
                var focusTop:Number = 0;
                var focusAncester:DisplayObject = focus;
                while(focusAncester != SCROLLER)
                {
                    focusTop += focusAncester.y;
                    focusAncester = focusAncester.parent;
                }
               

                var focusBottom:Number = focusTop + focus.height;

                var windowTop:Number = FIELDS.verticalScrollPosition;
                var windowBottom:Number = windowTop + FIELDS.height;
               
                // No scroll needed
                if (windowTop <= focusTop && focusBottom < windowBottom) return;
               
                // 10 pixels padding
                FIELDS.verticalScrollPosition = focusTop - 10;
}

----------

<s:Scroller id="SCROLLER>
   <s:VGroup id="FIELDS">
      <s:Form id="FORM">
                               
         <s:FormItem width="100%" label="Nachname" required="true">
            <s:TextInput id="NAME" width="50%" focusIn="scrollToFocus(event)"/>
         </s:FormItem>

...