Mixin for widgets to have a touch scrolling capability.
See the dojox/mobile/_ScrollableMixin reference documentation for more information.
Flag that signals if the user have moved in (one of) the scroll direction(s) since touch start (a move under the threshold is ignored).
Flag to allow scrolling in nested containers, e.g. to allow ScrollableView in a SwapView.
Enables the search for application-specific bars (header or footer).
disable the move handler if scroll starts in the unexpected direction
footer is view-local (as opposed to application-wide)
Parameters for dojox/mobile/scrollable.init().
Parameter | Type | Description |
---|---|---|
from | Object | |
to | Object | |
duration | Number | |
easing | String | |
node | DomNode | |
idx | Number |
Aborts scrolling.
This function stops the scrolling animation that is currently running. It is called when the user touches the screen while scrolling.
Adds the transparent DIV cover.
The cover is to prevent DOM events from affecting the child widgets such as a list widget. Without the cover, for example, child widgets may receive a click event and respond to it unexpectedly when the user flicks the screen to scroll. Note that only the desktop browsers need the cover.
A stub function to be overridden by subclasses.
This function is called from onTouchEnd(). The purpose is to give its subclasses a chance to adjust the destination position. If this function returns false, onTouchEnd() returns immediately without performing scroll.
Parameter | Type | Description |
---|---|---|
to | Object | The destination position. An object with x and y. |
pos | Object | The current position. An object with x and y. |
dim | Object | Dimension information returned by getDim(). |
Calculates the scroll bar position.
Given the scroll destination position, calculates the top and/or the left of the scroll bar(s). Returns an object with x and y.
Parameter | Type | Description |
---|---|---|
to | Object | The scroll destination position. An object with x and y. ex. {x:0, y:-5} |
Calculate the speed given the distance and time.
Parameter | Type | Description |
---|---|---|
distance | Number | |
time | Number |
Checks if the given node is a fixed bar or not.
Parameter | Type | Description |
---|---|---|
node | DomNode | |
local | Boolean |
Creates a mask for a scroll bar edge.
This function creates a mask that hides corners of one scroll bar edge to make it round edge. The other side of the edge is always visible and round shaped with the border-radius style.
Search for application-specific header or footer.
Finds the currently displayed view node from my sibling nodes.
Parameter | Type | Description |
---|---|---|
node | DomNode |
Shows the scroll bar instantly.
This function shows the scroll bar, and then hides it 300ms later. This is used to show the scroll bar to the user for a short period of time when a hidden view is revealed.
Returns various internal dimensional information needed for calculation.
Returns an object that indicates the scrolling speed.
From the position and elapsed time information, calculates the scrolling speed, and returns an object with x and y.
Hides the scroll bar.
If the fadeScrollBar property is true, hides the scroll bar with the fade animation.
Initialize according to the given params.
Mixes in the given params into this instance. At least domNode and containerNode have to be given. Starts listening to the touchstart events. Calls resize(), if this widget is a top level widget.
Parameter | Type | Description |
---|---|---|
params | Object |
Optional
|
Returns true if the given node is a form control.
Parameter | Type | Description |
---|---|---|
node | DOMNode |
Returns true if this is a top-level widget.
Subclass may want to override.
Constructs a string value that is passed to the -webkit-transform property.
Return value example: "translate3d(0px,-8px,0px)"
Parameter | Type | Description |
---|---|---|
to | Object | The destination position. An object with x and/or y. |
Adjusts the height of the widget.
If the height property is 'inherit', the height is inherited from its offset parent. If 'auto', the content height, which could be smaller than the entire screen height, is used. If an explicit height value (ex. "300px"), it is used as the new height. If nothing is specified as the height property, from the current top position of the widget to the bottom of the screen will be the new height.
Parameter | Type | Description |
---|---|---|
e | undefined |
Scrolls the pane until the searching node is in the view.
Just like the scrollIntoView method of DOM elements, this function causes the given node to scroll into view, aligning it either at the top or bottom of the pane.
Parameter | Type | Description |
---|---|---|
node | DOMNode | A DOM node to be searched for view. |
alignWithTop | Boolean |
Optional If true, aligns the node at the top of the pane. If false, aligns the node at the bottom of the pane. |
duration | Number |
Optional Duration of scrolling in seconds. (ex. 0.3) If not specified, scrolls without animation. |
Moves the scroll bar(s) to the given position without animation.
Parameter | Type | Description |
---|---|---|
to | Object | The destination position. An object with x and/or y. ex. {x:2, y:5}, {y:20}, etc. |
Scrolls to the given position immediately without animation.
Parameter | Type | Description |
---|---|---|
to | Object | The destination position. An object with x and y. ex. {x:0, y:-5} |
doNotMoveScrollBar | Boolean |
Optional If true, the scroll bar will not be updated. If not specified, it will be updated. |
node | DomNode |
Optional A DOM node to scroll. If not specified, defaults to this.containerNode. |
Programmatically sets key frames for the scroll animation.
Parameter | Type | Description |
---|---|---|
from | Object | |
to | Object | |
idx | Number |
Sets the given node as selectable or unselectable.
Parameter | Type | Description |
---|---|---|
node | DomNode | |
selectable | Boolean |
Shows the scroll bar.
This function creates the scroll bar instance if it does not exist yet, and calls resetScrollBar() to reset its length and position.
Moves the scroll bar(s) to the given position with the slide animation.
Parameter | Type | Description |
---|---|---|
to | Object | The destination position. An object with x and y. ex. {x:0, y:-5} |
duration | Number | Duration of the animation in seconds. (ex. 0.3) |
easing | String | The name of easing effect which webkit supports. "ease", "linear", "ease-in", "ease-out", etc. |
Scrolls to the given position with the slide animation.
Parameter | Type | Description |
---|---|---|
to | Object | The scroll destination position. An object with x and/or y. ex. {x:0, y:-5}, {y:-29}, etc. |
duration | Number | Duration of scrolling in seconds. (ex. 0.3) |
easing | String | The name of easing effect which webkit supports. "ease", "linear", "ease-in", "ease-out", etc. |
called after a scroll has been performed.
Parameter | Type | Description |
---|---|---|
e | Event | the scroll event, that contains the following attributes: x (x coordinate of the scroll destination), y (y coordinate of the scroll destination), beforeTop (a boolean that is true if the scroll detination is before the top of the scrollable), beforeTopHeight (the number of pixels before the top of the scrollable for the scroll destination), afterBottom (a boolean that is true if the scroll destination is after the bottom of the scrollable), afterBottomHeight (the number of pixels after the bottom of the scrollable for the scroll destination) |
called before a scroll is initiated. If this method returns false, the scroll is canceled.
Parameter | Type | Description |
---|---|---|
e | Event | the scroll event, that contains the following attributes: x (x coordinate of the scroll destination), y (y coordinate of the scroll destination), beforeTop (a boolean that is true if the scroll detination is before the top of the scrollable), beforeTopHeight (the number of pixels before the top of the scrollable for the scroll destination), afterBottom (a boolean that is true if the scroll destination is after the bottom of the scrollable), afterBottomHeight (the number of pixels after the bottom of the scrollable for the scroll destination) |
User-defined function to handle touchEnd events.
Parameter | Type | Description |
---|---|---|
e | Event |
User-defined function to handle touchMove events.
Parameter | Type | Description |
---|---|---|
e | undefined |
User-defined function to handle touchStart events.
Parameter | Type | Description |
---|---|---|
e | undefined |