Scroller control in Flex4
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
Scroller component in Flex4:
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.
Example:
|
<?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.
Output:
Running Application:
To view this page ensure that Adobe Flash Player version 10.0.0 or greater is installed.
