class
VScrollBar
extends mx.controls.scrollClasses.ScrollBar
The VScrollBar (vertical ScrollBar) control lets you control the portion of data that is displayed when there is too much data to fit in the display area. This control wraps the base ScrollBar control.
Although you can use the VScrollBar control as stand-alone control, you usually combined it with other components as part of a new component to provide scrolling functionality.
ScrollBar controls include four parts: two arrow buttons, a track, and a thumb. The position of the thumb and display of the buttons depend on the current state of the ScrollBar control. The ScrollBar control uses four parameters to calculate its display state:
Minimum range value.
Maximum range value.
Current position; must be within the minimum and maximum range values.
Viewport size; represents the number of items in the range that you can display at one time and must be less than or equal to the range.
MXML Syntax
The <mx:VScrollBar> tag inherits all the properties of its parent classes, and the following properties:
Handler for scroll events, which are broadcast when the ScrollBar control state changes. The target property of the event object contains a reference to the component that triggered the event. The type property contains the name of the event, scroll.
Type:
Number
Format:
Time
CSS Inheritance:
no Number of milliseconds to wait after the first buttonDown event before repeating buttonDown events at the value specified by repeatInterval. The default value is 500.
repeatInterval
Type:
Number
CSS Inheritance:
no Number of milliseconds between buttonDown events if the user presses and holds on a button. The default value is 35.
<?xml version="1.0" encoding="utf-8"?>
<!-- Simple example to demonstrate the VScrollBar control -->
<mx:Application xmlns:mx="http://www.macromedia.com/2003/mxml" backgroundColor="#FFFFFF">
<mx:Script>
<![CDATA[
function myScroll(event)
{
showPosition.text = "VScrollBar properties summary:" + '\n' +
"------------------------------------" + '\n' +
"A number that represents the current scroll position: " + event.scrollPosition + '\n' +
"Amount to scroll when an arrow button is pressed: " + event.lineScrollSize + '\n' +
"Amount to move the scroll when the scroll bar track is pressed: " + event.pageScrollSize + '\n' +
"A number which represents the maximum scroll position: " + event.maxPos + '\n' +
"A number which represents the minimum scroll position: " + event.minPos ;
}
]]>
</mx:Script>
<mx:Panel id="panel" title="Vertical Scrollbar Panel" hScrollPolicy="off" vScrollPolicy="off" height="85%" width="80%">
<mx:HBox height="100%" width="100%">
<mx:VScrollBar id="bar" minPos="0" lineScrollSize="50" pageScrollSize="100" height="100%" maxPos="{panel.height - 20}"
scroll="myScroll(event.target);" repeatDelay="1000" repeatInterval="500" />
<mx:Label id="showPosition" text="click on scroll bar to view its properties." color="#0000FF" />
</mx:HBox>
</mx:Panel>
</mx:Application>
