The Scroller control is the Spark component. It have scrollbars and a viewport. A viewport displays a rectangular area for displaying the
component. The tag of scroller is <s:Scroller>...</s:Scroller>. The scrollbars
control's the viewport's horizontal and vertical scroll position. You can use the
Scroller control as a container that implements the Viewport interface, such as
Group, scrollable. You can set the size of Scroller control like width, height
with in a tag. You can set vertical and horizontal position using verticalScrollPolicy and horizontalScrollPolicy properties in the Scroller
class.
|
<?xml version="1.0" encoding="utf-8"?> <s:Application 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:Panel title="Scroller component Example" height="218" color="#990000" width="366"> <s:VGroup paddingLeft="10" paddingTop="10" height="166"> <s:Scroller width="328" height="156"> <s:Group id="myGroup" height="154" width="324"> <mx:Form id="from1" x="39" y="0" width="258" height="151"> <mx:FormHeading label="Personal Information" color="Blue"/> <mx:FormItem label="First name:" color="#051992"> <s:TextInput id="txtinput"/> </mx:FormItem> <mx:FormItem label="Last name:" color="#051992"> <s:TextInput id="txtinput1"/> </mx:FormItem> <mx:FormItem label="College Name:" color="#051992"> <s:TextInput id="txtinput2"/> </mx:FormItem> <mx:FormItem label="Roll No:" color="#051992"> <s:TextInput id="txtinput3"/> </mx:FormItem> <mx:FormItem> <mx:HRule width="130" height="1"/> <s:Button id="btn" label="Submit"/> </mx:FormItem> <mx:FormItem> <s:Button id="btn1" label="Reset"/> </mx:FormItem> </mx:Form> </s:Group> </s:Scroller> </s:VGroup> </s:Panel> </s:Application> |
In this example you can see how we can use a Scroller control in Flex4.
To view this page ensure that Adobe Flash Player version 10.0.0 or greater is installed.
If you are facing any programming issue, such as compilation errors or not able to find the code you are looking for.
Ask your questions, our development team will try to give answers to your questions.