Yahoo! UI Library

scrollview-base  3.2.0pr1

Yahoo! UI Library > scrollview-base > ScrollView
Search:
 
Filters

Class ScrollView - extends Widget

ScrollView provides a srollable widget, supporting flick gestures, across both touch and mouse based devices.

Constructor

ScrollView ( config )
Parameters:
config <Object> Object literal with initial attribute values

Properties

ScrollView.ATTRS - protected static {Object}

Static property used to define the default attribute configuration of the Widget.

ScrollView.BOUNCE_RANGE - static Number

The default bounce distance in pixels
Default Value: 150

ScrollView.CLASS_NAMES - static Object

List of class names used in the scrollview's DOM

ScrollView.EASING - static String

The default easing used when animating the flick
Default Value: 'cubic-bezier(0, 0.1, 0, 1.0)'

ScrollView.FRAME_STEP - static Number

The step amount used when animating the flick
Default Value: 10

ScrollView.NAME - protected static String

The identity of the widget.
Default Value: 'scrollview'

ScrollView.SNAP_EASING - static String

The default easing to use when animatiing the bounce snap back.
Default Value: 'ease-out'

ScrollView.UI_SRC - static String

Flag used to source property changes initiated from the DOM
Default Value: "ui"

Properties inherited from Attribute:

Properties inherited from Base:

Methods

_afterHeightChange

protected void _afterHeightChange ( e )
after listener for the height attribute
Parameters:
e <Event.Facade> The event

_afterScrollXChange

protected void _afterScrollXChange ( e )
after listener for changes to the scrollX attr
Parameters:
e <Event.Facade> The event

_afterScrollYChange

protected void _afterScrollYChange ( e )
after listener for changes to the scrollY attr
Parameters:
e <Event.Facade> The event

_createEvents

private void _createEvents ( )
Publishes events which occur during the scroll lifecycle

_flick

protected void _flick ( distance , time )
Execute a flick at the end of a scroll action
Parameters:
distance <Number> The distance (in px) the user scrolled before the flick
time <Number> The number of ms the scroll event lasted before the flick

_flickFrame

protected void _flickFrame ( )
Execute a single frame in the flick animation

_killTimer

private void _killTimer ( fireEvent )
Stop the animation timer
Parameters:
fireEvent <Boolean> If true, fire the scrollEnd event

_onGestureMove

private void _onGestureMove ( e )
gesturemove event handler
Parameters:
e <Event.Facade> The gesturemove event facade

_onGestureMoveEnd

private void _onGestureMoveEnd ( e )
gestureend event handler
Parameters:
e <Event.Facade> The gesturemoveend event facade

_onGestureMoveStart

private void _onGestureMoveStart ( e )
gesturemovestart event handler
Parameters:
e <Event.Facade> The gesturemovestart event facade

_setScroll

private void _setScroll ( val , dim )
Parameters:
val <Number>
dim <String>

_setScrollX

protected void _setScrollX ( val )
Setter for the scrollX ATTR
Parameters:
val <Number> The new scrollX value

_setScrollY

protected void _setScrollY ( val )
Setter for the scrollY ATTR
Parameters:
val <Number> The new scrollY value

_transitionEnded

private void _transitionEnded ( )
TranstionEnd event handler

_uiDimensionsChange

protected void _uiDimensionsChange ( )
This method gets invoked whenever the height or width attrs change, allowing us to determine which scrolling axes need to be enabled.

_uiScrollX

protected void _uiScrollX ( val , duration , easing )
Update the UI when the scrollX attr changes
Parameters:
val <Number> The scrollX value
duration <Number> The length (in ms) of the scroll animation
easing <String> An easing equation, if duration is defined

_uiScrollY

protected void _uiScrollY ( val , duration , easing )
Update the UI when the scrollY attr changes
Parameters:
val <Number> The scrollY value
duration <Number> The length (in ms) of the scroll animation
easing <String> An easing equation, if duration is defined

_uiSizeCB

protected void _uiSizeCB ( )
Override the contentBox sizing method, since the contentBox height should not be that of the boundingBox.

bindUI

void bindUI ( )
bindUI implementation Hooks up events for the widget

initializer

void initializer ( )
Designated initializer

scrollTo

void scrollTo ( x , y , duration , easing )
Scroll the element to a given y coordinate
Parameters:
x <Number> The x-position to scroll to
y <Number> The y-position to scroll to
duration <Number> Duration, in ms, of the scroll animation (default is 0)
easing <String> An easing equation if duration is set

Events

bounceChange

bounceChange ( event )
Fires when the value for the configuration attribute 'bounce' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event <Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

decelerationChange

decelerationChange ( event )
Fires when the value for the configuration attribute 'deceleration' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event <Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

flick

flick ( e )
Notification event fired at the end of a flick gesture (the flick animation may still be in progress)
Parameters:
e <EventFacade> The default event facade.

flickChange

flickChange ( event )
Fires when the value for the configuration attribute 'flick' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event <Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

scrollEnd

scrollEnd ( e )
Notification event fired at the end of a scroll transition
Parameters:
e <EventFacade> The default event facade.

scrollXChange

scrollXChange ( event )
Fires when the value for the configuration attribute 'scrollX' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event <Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

scrollYChange

scrollYChange ( event )
Fires when the value for the configuration attribute 'scrollY' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event <Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

Configuration Attributes

bounce - Number

Drag coefficient for intertial scrolling at the upper and lower boundaries of the scrollview. Set to 0 to disable "rubber-banding".
Default Value: 0.7

deceleration - object

Drag coefficent for inertial scrolling. The closer to 1 this value is, the less friction during scrolling.
Default Value: 0.98

flick - Object

The minimum distance and/or velocity which define a flick
Default Value: Object with properties minDistance = 10, minVelocity = 0.

scrollX - Number

The scroll position in the x-axis
Default Value: 0

scrollY - Number

The scroll position in the y-axis
Default Value: 0

Configuration attributes inherited from Base:


Copyright © 2010 Yahoo! Inc. All rights reserved.