Package | feathers.controls |
Class | public class SimpleScrollBar |
Inheritance | SimpleScrollBar ![]() ![]() |
Implements | IDirectionalScrollBar |
ScrollBar
component.
The following example updates a list to use simple scroll bars:
list.horizontalScrollBarFactory = function():IScrollBar { var scrollBar:SimpleScrollBar = new SimpleScrollBar(); scrollBar.direction = SimpleScrollBar.DIRECTION_HORIZONTAL; return scrollBar; }; list.verticalScrollBarFactory = function():IScrollBar { var scrollBar:SimpleScrollBar = new SimpleScrollBar(); scrollBar.direction = SimpleScrollBar.DIRECTION_VERTICAL; return scrollBar; };
See also
Property | Defined By | ||
---|---|---|---|
clampToRange : Boolean = false
Determines if the value should be clamped to the range between the
minimum and maximum. | SimpleScrollBar | ||
customThumbName : String
DEPRECATED: Replaced by customThumbStyleName. | SimpleScrollBar | ||
customThumbStyleName : String
A style name to add to the scroll bar's thumb sub-component. | SimpleScrollBar | ||
![]() | defaultTextEditorFactory : Function [static]
A function used by all UI controls that support text editor to
create an ITextEditor instance. | FeathersControl | |
![]() | defaultTextRendererFactory : Function [static]
A function used by all UI controls that support text renderers to
create an ITextRenderer instance. | FeathersControl | |
![]() | depth : int [read-only]
The component's depth in the display list, relative to the stage. | FeathersControl | |
direction : String
Determines if the scroll bar's thumb can be dragged horizontally or
vertically. | SimpleScrollBar | ||
![]() | focusIndicatorSkin : DisplayObject
If this component supports focus, this optional skin will be
displayed above the component when showFocus() is
called. | FeathersControl | |
![]() | focusManager : IFocusManager | FeathersControl | |
![]() | focusOwner : IFocusDisplayObject | FeathersControl | |
![]() | focusPadding : Number
Quickly sets all focus padding properties to the same value. | FeathersControl | |
![]() | focusPaddingBottom : Number
The minimum space, in pixels, between the object's bottom edge and the
bottom edge of the focus indicator skin. | FeathersControl | |
![]() | focusPaddingLeft : Number
The minimum space, in pixels, between the object's left edge and the
left edge of the focus indicator skin. | FeathersControl | |
![]() | focusPaddingRight : Number
The minimum space, in pixels, between the object's right edge and the
right edge of the focus indicator skin. | FeathersControl | |
![]() | focusPaddingTop : Number
The minimum space, in pixels, between the object's top edge and the
top edge of the focus indicator skin. | FeathersControl | |
globalStyleProvider : IStyleProvider [static]
The default IStyleProvider for all SimpleScrollBar
components. | SimpleScrollBar | ||
![]() | height : Number [override]
The height of the component, in pixels. | FeathersControl | |
![]() | includeInLayout : Boolean
Determines if the ILayout should use this object or ignore it. | FeathersControl | |
![]() | isCreated : Boolean [read-only]
Determines if the component has been initialized and validated for
the first time. | FeathersControl | |
![]() | isEnabled : Boolean
Indicates whether the control is interactive or not. | FeathersControl | |
![]() | isFocusEnabled : Boolean | FeathersControl | |
![]() | isInitialized : Boolean [read-only]
Determines if the component has been initialized yet. | FeathersControl | |
![]() | isQuickHitAreaEnabled : Boolean
Similar to mouseChildren on the classic display list. | FeathersControl | |
![]() | layoutData : ILayoutData
Extra parameters associated with this display object that will be
used by the layout algorithm. | FeathersControl | |
liveDragging : Boolean = true
Determines if the scroll bar dispatches the Event.CHANGE
event every time the thumb moves, or only once it stops moving. | SimpleScrollBar | ||
![]() | maxHeight : Number
The maximum recommended height to be used for self-measurement and,
optionally, by any code that is resizing this component. | FeathersControl | |
maximum : Number
The maximum numeric value of the range. | SimpleScrollBar | ||
![]() | maxWidth : Number
The maximum recommended width to be used for self-measurement and,
optionally, by any code that is resizing this component. | FeathersControl | |
![]() | minHeight : Number
The minimum recommended height to be used for self-measurement and,
optionally, by any code that is resizing this component. | FeathersControl | |
minimum : Number
The minimum numeric value of the range. | SimpleScrollBar | ||
![]() | minTouchHeight : Number
If using isQuickHitAreaEnabled, and the hit area's
height is smaller than this value, it will be expanded. | FeathersControl | |
![]() | minTouchWidth : Number
If using isQuickHitAreaEnabled, and the hit area's
width is smaller than this value, it will be expanded. | FeathersControl | |
![]() | minWidth : Number
The minimum recommended width to be used for self-measurement and,
optionally, by any code that is resizing this component. | FeathersControl | |
![]() | nextTabFocus : IFocusDisplayObject | FeathersControl | |
padding : Number
Quickly sets all padding properties to the same value. | SimpleScrollBar | ||
paddingBottom : Number
The minimum space, in pixels, below the thumb. | SimpleScrollBar | ||
paddingLeft : Number
The minimum space, in pixels, to the left of the thumb. | SimpleScrollBar | ||
paddingRight : Number
The minimum space, in pixels, to the right of the thumb. | SimpleScrollBar | ||
paddingTop : Number
The minimum space, in pixels, above the thumb. | SimpleScrollBar | ||
page : Number
The amount the scroll bar value must change to get from one "page" to
the next. | SimpleScrollBar | ||
![]() | previousTabFocus : IFocusDisplayObject | FeathersControl | |
repeatDelay : Number
The time, in seconds, before actions are repeated. | SimpleScrollBar | ||
step : Number
The amount the value must change to increment or decrement. | SimpleScrollBar | ||
![]() | styleName : String
The concatenated styleNameList, with values separated
by spaces. | FeathersControl | |
![]() | styleNameList : TokenList [read-only]
Contains a list of all "styles" assigned to this control. | FeathersControl | |
![]() | styleProvider : IStyleProvider
When a component initializes, a style provider may be used to set
properties that affect the component's visual appearance. | FeathersControl | |
thumbFactory : Function
A function used to generate the scroll bar's thumb sub-component. | SimpleScrollBar | ||
thumbProperties : Object
An object that stores properties for the scroll bar's thumb, and the
properties will be passed down to the thumb when the scroll bar
validates. | SimpleScrollBar | ||
value : Number
The current numeric value. | SimpleScrollBar | ||
![]() | width : Number [override]
The width of the component, in pixels. | FeathersControl |
Property | Defined By | ||
---|---|---|---|
![]() | actualHeight : Number = 0
The final height value that should be used for layout. | FeathersControl | |
![]() | actualWidth : Number = 0
The final width value that should be used for layout. | FeathersControl | |
![]() | defaultStyleProvider : IStyleProvider [read-only]
When the FeathersControl constructor is called, the
globalStyleProvider property is set to this value. | FeathersControl | |
![]() | explicitHeight : Number = NaN
The height value explicitly set by calling the height setter or
setSize(). | FeathersControl | |
![]() | explicitWidth : Number = NaN
The width value explicitly set by calling the width setter or
setSize(). | FeathersControl | |
thumb : Button
The thumb sub-component. | SimpleScrollBar | ||
thumbName : String
DEPRECATED: Replaced by thumbStyleName. | SimpleScrollBar | ||
thumbStyleName : String = feathers-simple-scroll-bar-thumb
The value added to the styleNameList of the thumb. | SimpleScrollBar |
Method | Defined By | ||
---|---|---|---|
Constructor. | SimpleScrollBar | ||
![]() | hideFocus():void
If the visual indicator of focus has been displayed by
showFocus(), call this function to hide it. | FeathersControl | |
![]() | invalidate(flag:String):void
Call this function to tell the UI control that a redraw is pending. | FeathersControl | |
![]() | isInvalid(flag:String = null):Boolean
Indicates whether the control is pending validation or not. | FeathersControl | |
![]() | move(x:Number, y:Number):void
Sets both the x and the y positions of the control in a single
function call. | FeathersControl | |
![]() | setSize(width:Number, height:Number):void
Sets both the width and the height of the control in a single
function call. | FeathersControl | |
![]() | showFocus():void
If the object has focus, an additional visual indicator may
optionally be displayed to highlight the object. | FeathersControl | |
![]() | validate():void
Immediately validates the display object, if it is invalid. | FeathersControl |
Method | Defined By | ||
---|---|---|---|
autoSizeIfNeeded():Boolean
If the component's dimensions have not been set explicitly, it will
measure its content and determine an ideal size for itself. | SimpleScrollBar | ||
![]() | clearInvalidationFlag(flag:String):void
Clears an invalidation flag. | FeathersControl | |
createThumb():void
Creates and adds the thumb sub-component and
removes the old instance, if one exists. | SimpleScrollBar | ||
![]() | draw():void
Override to customize layout and to adjust properties of children. | FeathersControl | |
![]() | focusInHandler(event:Event):void
Default event handler for FeathersEventType.FOCUS_IN
that may be overridden in subclasses to perform additional actions
when the component receives focus. | FeathersControl | |
![]() | focusOutHandler(event:Event):void
Default event handler for FeathersEventType.FOCUS_OUT
that may be overridden in subclasses to perform additional actions
when the component loses focus. | FeathersControl | |
![]() | initialize():void
Called the first time that the UI control is added to the stage, and
you should override this function to customize the initialization
process. | FeathersControl | |
![]() | refreshFocusIndicator():void
Updates the focus indicator skin by showing or hiding it and
adjusting its position and dimensions. | FeathersControl | |
![]() | setInvalidationFlag(flag:String):void
Sets an invalidation flag. | FeathersControl | |
![]() | setSizeInternal(width:Number, height:Number, canInvalidate:Boolean):Boolean
Sets the width and height of the control, with the option of
invalidating or not. | FeathersControl |
Event | Summary | Defined By | ||
---|---|---|---|---|
Dispatched when the user starts dragging the scroll bar's thumb. | SimpleScrollBar | |||
Dispatched when the scroll bar's value changes. | SimpleScrollBar | |||
![]() | Dispatched after the component has validated for the first time. | FeathersControl | ||
Dispatched when the user stops dragging the scroll bar's thumb. | SimpleScrollBar | |||
![]() | Dispatched after initialize() has been called, but before the first time that draw() has been called. | FeathersControl | ||
![]() | Dispatched when the width or height of the control changes. | FeathersControl |
Constant | Defined By | ||
---|---|---|---|
DEFAULT_CHILD_NAME_THUMB : String = feathers-simple-scroll-bar-thumb [static]
DEPRECATED: Replaced by Scroller.DEFAULT_CHILD_STYLE_NAME_THUMB. | SimpleScrollBar | ||
DEFAULT_CHILD_STYLE_NAME_THUMB : String = feathers-simple-scroll-bar-thumb [static]
The default value added to the styleNameList of the thumb. | SimpleScrollBar | ||
DIRECTION_HORIZONTAL : String = horizontal [static]
The scroll bar's thumb may be dragged horizontally (on the x-axis). | SimpleScrollBar | ||
DIRECTION_VERTICAL : String = vertical [static]
The scroll bar's thumb may be dragged vertically (on the y-axis). | SimpleScrollBar | ||
![]() | INVALIDATION_FLAG_ALL : String = all [static]
Flag to indicate that everything is invalid and should be redrawn. | FeathersControl | |
![]() | INVALIDATION_FLAG_DATA : String = data [static]
Invalidation flag to indicate that the primary data displayed by the
UI control has changed. | FeathersControl | |
![]() | INVALIDATION_FLAG_FOCUS : String = focus [static]
Invalidation flag to indicate that the focus of the UI control has
changed. | FeathersControl | |
![]() | INVALIDATION_FLAG_LAYOUT : String = layout [static]
Invalidation flag to indicate that the layout of the UI control has
changed. | FeathersControl | |
![]() | INVALIDATION_FLAG_SCROLL : String = scroll [static]
Invalidation flag to indicate that the scroll position of the UI
control has changed. | FeathersControl | |
![]() | INVALIDATION_FLAG_SELECTED : String = selected [static]
Invalidation flag to indicate that the selection of the UI control
has changed. | FeathersControl | |
![]() | INVALIDATION_FLAG_SIZE : String = size [static]
Invalidation flag to indicate that the dimensions of the UI control
have changed. | FeathersControl | |
![]() | INVALIDATION_FLAG_SKIN : String = skin [static]
Invalidation flag to indicate that the skin of the UI control has changed. | FeathersControl | |
![]() | INVALIDATION_FLAG_STATE : String = state [static]
Invalidation flag to indicate that the state has changed. | FeathersControl | |
![]() | INVALIDATION_FLAG_STYLES : String = styles [static]
Invalidation flag to indicate that the styles or visual appearance of
the UI control has changed. | FeathersControl |
clampToRange | property |
public var clampToRange:Boolean = false
Determines if the value should be clamped to the range between the
minimum and maximum. If false
and the value is outside of the range,
the thumb will shrink as if the range were increasing.
In the following example, the clamping behavior is updated:
scrollBar.clampToRange = true;
The default value is false
.
customThumbName | property |
customThumbName:String
DEPRECATED: Replaced by customThumbStyleName
.
DEPRECATION WARNING: This property is deprecated starting with Feathers 2.1. It will be removed in a future version of Feathers according to the standard Feathers deprecation policy.
public function get customThumbName():String
public function set customThumbName(value:String):void
See also
customThumbStyleName | property |
customThumbStyleName:String
A style name to add to the scroll bar's thumb sub-component. Typically used by a theme to provide different styles to different scroll bars.
In the following example, a custom thumb style name is passed to the scroll bar:
scrollBar.customThumbStyleName = "my-custom-thumb";
In your theme, you can target this sub-component style name to provide different styles than the default:
getStyleProviderForClass( Button ).setFunctionForStyleName( "my-custom-thumb", setCustomThumbStyles );
The default value is null
.
public function get customThumbStyleName():String
public function set customThumbStyleName(value:String):void
See also
direction | property |
direction:String
Determines if the scroll bar's thumb can be dragged horizontally or vertically. When this value changes, the scroll bar's width and height values do not change automatically.
In the following example, the direction is changed to vertical:
scrollBar.direction = SimpleScrollBar.DIRECTION_VERTICAL;
The default value is SimpleScrollBar.DIRECTION_HORIZONTAL
.
public function get direction():String
public function set direction(value:String):void
See also
globalStyleProvider | property |
public static var globalStyleProvider:IStyleProvider
The default IStyleProvider
for all SimpleScrollBar
components.
The default value is null
.
See also
liveDragging | property |
public var liveDragging:Boolean = true
Determines if the scroll bar dispatches the Event.CHANGE
event every time the thumb moves, or only once it stops moving.
In the following example, live dragging is disabled:
scrollBar.liveDragging = false;
The default value is true
.
maximum | property |
maximum:Number
The maximum numeric value of the range.
In the following example, the maximum is changed to 100:
component.minimum = 0; component.maximum = 100; component.step = 1; component.page = 10 component.value = 12;
The default value is 0
.
public function get maximum():Number
public function set maximum(value:Number):void
See also
minimum | property |
minimum:Number
The minimum numeric value of the range.
In the following example, the minimum is changed to 0:
component.minimum = 0; component.maximum = 100; component.step = 1; component.page = 10 component.value = 12;
The default value is 0
.
public function get minimum():Number
public function set minimum(value:Number):void
See also
padding | property |
padding:Number
Quickly sets all padding properties to the same value. The
padding
getter always returns the value of
paddingTop
, but the other padding values may be
different.
In the following example, the padding is changed to 20 pixels:
scrollBar.padding = 20;
The default value is 0
.
public function get padding():Number
public function set padding(value:Number):void
See also
paddingBottom | property |
paddingBottom:Number
The minimum space, in pixels, below the thumb.
In the following example, the bottom padding is changed to 20 pixels:
scrollBar.paddingBottom = 20;
The default value is 0
.
public function get paddingBottom():Number
public function set paddingBottom(value:Number):void
paddingLeft | property |
paddingLeft:Number
The minimum space, in pixels, to the left of the thumb.
In the following example, the left padding is changed to 20 pixels:
scrollBar.paddingLeft = 20;
The default value is 0
.
public function get paddingLeft():Number
public function set paddingLeft(value:Number):void
paddingRight | property |
paddingRight:Number
The minimum space, in pixels, to the right of the thumb.
In the following example, the right padding is changed to 20 pixels:
scrollBar.paddingRight = 20;
The default value is 0
.
public function get paddingRight():Number
public function set paddingRight(value:Number):void
paddingTop | property |
paddingTop:Number
The minimum space, in pixels, above the thumb.
In the following example, the top padding is changed to 20 pixels:
scrollBar.paddingTop = 20;
The default value is 0
.
public function get paddingTop():Number
public function set paddingTop(value:Number):void
page | property |
page:Number
The amount the scroll bar value must change to get from one "page" to the next.
In the following example, the page is changed to 10:
scrollBar.minimum = 0; scrollBar.maximum = 100; scrollBar.step = 1; scrollBar.page = 10 scrollBar.value = 12;
The default value is 0
.
public function get page():Number
public function set page(value:Number):void
See also
repeatDelay | property |
repeatDelay:Number
The time, in seconds, before actions are repeated. The first repeat happens after a delay that is five times longer than the following repeats.
In the following example, the repeat delay is changed to 500 milliseconds:
scrollBar.repeatDelay = 0.5;
The default value is 0.05
.
public function get repeatDelay():Number
public function set repeatDelay(value:Number):void
step | property |
step:Number
The amount the value must change to increment or decrement.
In the following example, the step is changed to 1:
component.minimum = 0; component.maximum = 100; component.step = 1; component.page = 10 component.value = 12;
The default value is 0
.
public function get step():Number
public function set step(value:Number):void
See also
thumb | property |
thumbFactory | property |
thumbFactory:Function
A function used to generate the scroll bar's thumb sub-component.
The thumb must be an instance of Button
. This factory
can be used to change properties on the thumb when it is first
created. For instance, if you are skinning Feathers components
without a theme, you might use this factory to set skins and other
styles on the thumb.
The function should have the following signature:
function():Button
In the following example, a custom thumb factory is passed to the scroll bar:
scrollBar.thumbFactory = function():Button { var thumb:Button = new Button(); thumb.defaultSkin = new Image( upTexture ); thumb.downSkin = new Image( downTexture ); return thumb; };
The default value is null
.
public function get thumbFactory():Function
public function set thumbFactory(value:Function):void
See also
thumbName | property |
thumbName:String
DEPRECATED: Replaced by thumbStyleName
.
DEPRECATION WARNING: This property is deprecated starting with Feathers 2.1. It will be removed in a future version of Feathers according to the standard Feathers deprecation policy.
protected function get thumbName():String
protected function set thumbName(value:String):void
See also
thumbProperties | property |
thumbProperties:Object
An object that stores properties for the scroll bar's thumb, and the
properties will be passed down to the thumb when the scroll bar
validates. For a list of available properties, refer to
feathers.controls.Button
.
If the subcomponent has its own subcomponents, their properties
can be set too, using attribute @
notation. For example,
to set the skin on the thumb which is in a SimpleScrollBar
,
which is in a List
, you can use the following syntax:
list.verticalScrollBarProperties.@thumbProperties.defaultSkin = new Image(texture);
Setting properties in a thumbFactory
function instead
of using thumbProperties
will result in better
performance.
In the following example, the scroll bar's thumb properties are updated:
scrollBar.thumbProperties.defaultSkin = new Image( upTexture ); scrollBar.thumbProperties.downSkin = new Image( downTexture );
The default value is null
.
public function get thumbProperties():Object
public function set thumbProperties(value:Object):void
See also
thumbStyleName | property |
protected var thumbStyleName:String = feathers-simple-scroll-bar-thumb
The value added to the styleNameList
of the thumb. This
variable is protected
so that sub-classes can customize
the thumb style name in their constructors instead of using the
default style name defined by DEFAULT_CHILD_STYLE_NAME_THUMB
.
To customize the thumb style name without subclassing, see
customThumbStyleName
.
See also
value | property |
value:Number
The current numeric value.
In the following example, the value is changed to 12:
component.minimum = 0; component.maximum = 100; component.step = 1; component.page = 10 component.value = 12;
The default value is 0
.
public function get value():Number
public function set value(value:Number):void
See also
SimpleScrollBar | () | Constructor |
public function SimpleScrollBar()
Constructor.
autoSizeIfNeeded | () | method |
protected function autoSizeIfNeeded():Boolean
If the component's dimensions have not been set explicitly, it will
measure its content and determine an ideal size for itself. If the
explicitWidth
or explicitHeight
member
variables are set, those value will be used without additional
measurement. If one is set, but not the other, the dimension with the
explicit value will not be measured, but the other non-explicit
dimension will still need measurement.
Calls setSizeInternal()
to set up the
actualWidth
and actualHeight
member
variables used for layout.
Meant for internal use, and subclasses may override this function with a custom implementation.
ReturnsBoolean |
createThumb | () | method |
protected function createThumb():void
Creates and adds the thumb
sub-component and
removes the old instance, if one exists.
Meant for internal use, and subclasses may override this function with a custom implementation.
See also
beginInteraction | Event |
starling.events.Event
feathers.events.FeathersEventType.BEGIN_INTERACTION
Dispatched when the user starts dragging the scroll bar's thumb.
The properties of the event object have the following values:
Property | Value |
---|---|
bubbles | false |
currentTarget | The Object that defines the
event listener that handles the event. For example, if you use
myButton.addEventListener() to register an event listener,
myButton is the value of the currentTarget . |
data | null |
target | The Object that dispatched the event;
it is not always the Object listening for the event. Use the
currentTarget property to always access the Object
listening for the event. |
FeathersEventType.BEGIN_INTERACTION
event type is
used by many UI controls where a drag or other interaction happens
over time. An example is a Slider
control where the
user touches the thumb to begin dragging.
change | Event |
starling.events.Event
starling.events.Event.CHANGE
Dispatched when the scroll bar's value changes.
The properties of the event object have the following values:
Property | Value |
---|---|
bubbles | false |
currentTarget | The Object that defines the
event listener that handles the event. For example, if you use
myButton.addEventListener() to register an event listener,
myButton is the value of the currentTarget . |
data | null |
target | The Object that dispatched the event;
it is not always the Object listening for the event. Use the
currentTarget property to always access the Object
listening for the event. |
endInteraction | Event |
starling.events.Event
feathers.events.FeathersEventType.END_INTERACTION
Dispatched when the user stops dragging the scroll bar's thumb.
The properties of the event object have the following values:
Property | Value |
---|---|
bubbles | false |
currentTarget | The Object that defines the
event listener that handles the event. For example, if you use
myButton.addEventListener() to register an event listener,
myButton is the value of the currentTarget . |
data | null |
target | The Object that dispatched the event;
it is not always the Object listening for the event. Use the
currentTarget property to always access the Object
listening for the event. |
FeathersEventType.END_INTERACTION
event type is
used by many UI controls where a drag or other interaction happens
over time. An example is a Slider
control where the
user stops touching the thumb after dragging.
Depending on the control, the result of the interaction may
continue after the interaction ends. For instance, a Scroller
may be "thrown", and the scrolling will continue animating after the
user has finished interacting with it.
DEFAULT_CHILD_NAME_THUMB | Constant |
public static const DEFAULT_CHILD_NAME_THUMB:String = feathers-simple-scroll-bar-thumb
DEPRECATED: Replaced by Scroller.DEFAULT_CHILD_STYLE_NAME_THUMB
.
DEPRECATION WARNING: This property is deprecated starting with Feathers 2.1. It will be removed in a future version of Feathers according to the standard Feathers deprecation policy.
See also
DEFAULT_CHILD_STYLE_NAME_THUMB | Constant |
public static const DEFAULT_CHILD_STYLE_NAME_THUMB:String = feathers-simple-scroll-bar-thumb
The default value added to the styleNameList
of the thumb.
See also
DIRECTION_HORIZONTAL | Constant |
public static const DIRECTION_HORIZONTAL:String = horizontal
The scroll bar's thumb may be dragged horizontally (on the x-axis).
See also
DIRECTION_VERTICAL | Constant |
public static const DIRECTION_VERTICAL:String = vertical
The scroll bar's thumb may be dragged vertically (on the y-axis).
See also