Skip to content

Commit

Permalink
Merge pull request #2519 from bryan-m-hughes/timob-9908
Browse files Browse the repository at this point in the history
[TIMOB-9908] Added the ability to enable/disable scrollview/scrollableview
  • Loading branch information
cb1kenobi committed Jul 9, 2012
2 parents a8b153d + eb115ad commit 82b62cd
Show file tree
Hide file tree
Showing 2 changed files with 124 additions and 114 deletions.
4 changes: 2 additions & 2 deletions apidoc/Titanium/UI/ScrollableView.yml
Original file line number Diff line number Diff line change
Expand Up @@ -352,8 +352,8 @@ properties:
description: If this property is unset or `true`, scrolling is enabled.
type: Boolean
default: undefined (scrolling enabled)
platforms: [iphone, ipad, android]
since: { android: "2.1", iphone: "2.0", ipad: "2.0" }
platforms: [iphone, ipad, android, mobileweb]
since: { android: "2.1", iphone: "2.0", ipad: "2.0", mobileweb: "2.2" }

- name: views
summary: Sets the pages within this Scrollable View.
Expand Down
234 changes: 122 additions & 112 deletions mobileweb/titanium/Ti/_/UI/KineticScrollView.js
Original file line number Diff line number Diff line change
Expand Up @@ -87,138 +87,144 @@ define(["Ti/_/browser", "Ti/_/declare", "Ti/UI/View", "Ti/_/lang", "Ti/_/dom", "
}
}

// Listen for postlayouts and update the translation
on(self, "postlayout", function() {
minTranslationX = self._minTranslationX = Math.min(0, self._measuredWidth - self._borderLeftWidth - self._borderRightWidth - self._contentContainer._measuredWidth);
minTranslationY = self._minTranslationY = Math.min(0, self._measuredHeight - self._borderTopWidth - self._borderBottomWidth - self._contentContainer._measuredHeight);
});

on(self, "draggingstart", function(e) {
if (this.scrollingEnabled) {

// Initialize the velocity calculations
velocityX = void 0;
velocityY = void 0;
startTranslationX = self._currentTranslationX;
startTranslationY = self._currentTranslationY;
numSamples = 0;
previousTime = (new Date).getTime();

minTranslationX = self._minTranslationX = Math.min(0, self._measuredWidth - self._borderLeftWidth - self._borderRightWidth - self._contentContainer._measuredWidth);
minTranslationY = self._minTranslationY = Math.min(0, self._measuredHeight - self._borderTopWidth - self._borderBottomWidth - self._contentContainer._measuredHeight);

// Start the scroll bars
var width = self._measuredWidth,
height = self._measuredHeight,
contentWidth = contentContainer._measuredWidth,
contentHeight = contentContainer._measuredHeight;
self._startScrollBars({
x: -self._currentTranslationX / (contentWidth - width),
y: -self._currentTranslationY / (contentHeight - height)
},
{
x: width / contentWidth,
y: height / contentHeight
});

// Initialize the velocity calculations
velocityX = void 0;
velocityY = void 0;
startTranslationX = self._currentTranslationX;
startTranslationY = self._currentTranslationY;
numSamples = 0;
previousTime = (new Date).getTime();

// Start the scroll bars
var width = self._measuredWidth,
height = self._measuredHeight,
contentWidth = contentContainer._measuredWidth,
contentHeight = contentContainer._measuredHeight;
self._startScrollBars({
x: -self._currentTranslationX / (contentWidth - width),
y: -self._currentTranslationY / (contentHeight - height)
},
{
x: width / contentWidth,
y: height / contentHeight
});

// Call the callback
self._handleDragStart && self._handleDragStart(e);
// Call the callback
self._handleDragStart && self._handleDragStart(e);
}
});

on(self, "dragging", function(e) {

// Update the velocity calculations
translationX = startTranslationX + e.distanceX;
translationY = startTranslationY + e.distanceY;
calculateVelocity();

// Update the translation
self._setTranslation(previousTranslationX = translationX, previousTranslationY = translationY);

// Update the scroll bars
var width = self._measuredWidth,
height = self._measuredHeight,
contentWidth = contentContainer._measuredWidth,
contentHeight = contentContainer._measuredHeight;
this._updateScrollBars({
x: -self._currentTranslationX / (contentWidth - width),
y: -self._currentTranslationY / (contentHeight - height)
});

self._handleDrag && self._handleDrag(e);
if (this.scrollingEnabled) {
// Update the velocity calculations
translationX = startTranslationX + e.distanceX;
translationY = startTranslationY + e.distanceY;
calculateVelocity();

// Update the translation
self._setTranslation(previousTranslationX = translationX, previousTranslationY = translationY);

// Update the scroll bars
var width = self._measuredWidth,
height = self._measuredHeight,
contentWidth = contentContainer._measuredWidth,
contentHeight = contentContainer._measuredHeight;
this._updateScrollBars({
x: -self._currentTranslationX / (contentWidth - width),
y: -self._currentTranslationY / (contentHeight - height)
});

self._handleDrag && self._handleDrag(e);
}
});

on(self, "draggingcancel", function(e) {
self._animateToPosition(startTranslationX, startTranslationY, 400 + 0.3 * calculateDistance(
startTranslationX, startTranslationY, self._currentTranslationX, self._currentTranslationY),
"ease-in-out", function(){
self._handleDragCancel && self._handleDragCancel(e);
});
self._endScrollBars();
self._handleDragCancel && self._handleDragCancel(e);
if (this.scrollingEnabled) {
self._animateToPosition(startTranslationX, startTranslationY, 400 + 0.3 * calculateDistance(
startTranslationX, startTranslationY, self._currentTranslationX, self._currentTranslationY),
"ease-in-out", function(){
self._handleDragCancel && self._handleDragCancel(e);
});
self._endScrollBars();
self._handleDragCancel && self._handleDragCancel(e);
}
});

on(self, "draggingend", function(e) {
translationX = startTranslationX + e.distanceX;
translationY = startTranslationY + e.distanceY;
calculateVelocity();
var x = self._currentTranslationX,
y = self._currentTranslationY,
springBack;

// Spring back if need be
if (x > 0) {
x = 0;
springBack = 1;
} else if(x < minTranslationX) {
x = minTranslationX;
springBack = 1;
}
if (y > 0) {
y = 0;
springBack = 1;
} else if(y < minTranslationY) {
y = minTranslationY;
springBack = 1;
}
if (this.scrollingEnabled) {
translationX = startTranslationX + e.distanceX;
translationY = startTranslationY + e.distanceY;
calculateVelocity();
var x = self._currentTranslationX,
y = self._currentTranslationY,
springBack;

// Spring back if need be
if (x > 0) {
x = 0;
springBack = 1;
} else if(x < minTranslationX) {
x = minTranslationX;
springBack = 1;
}
if (y > 0) {
y = 0;
springBack = 1;
} else if(y < minTranslationY) {
y = minTranslationY;
springBack = 1;
}

if (springBack) {
self._animateToPosition(x, y, 200, "ease-out", function(){
self._handleDragEnd && self._handleDragEnd(e);
});
} else {
self._handleDragEnd && self._handleDragEnd(e, velocityX, velocityY);
if (springBack) {
self._animateToPosition(x, y, 200, "ease-out", function(){
self._handleDragEnd && self._handleDragEnd(e);
});
} else {
self._handleDragEnd && self._handleDragEnd(e, velocityX, velocityY);
}
}
});

// Handle mouse wheel scrolling
enableMouseWheel && (this._disconnectMouseWheelEvent = on(self.domNode, "mousewheel",function(e) {
var distanceX = contentContainer._measuredWidth - self._measuredWidth,
distanceY = contentContainer._measuredHeight - self._measuredHeight,
currentPositionX = -self._currentTranslationX,
currentPositionY = -self._currentTranslationY;

// Start the scrollbar
self._startScrollBars({
x: currentPositionX / distanceX,
y: currentPositionY / distanceY
},
{
x: self._measuredWidth / contentContainer._measuredWidth,
y: self._measuredHeight / contentContainer._measuredHeight
});
if (this.scrollingEnabled) {
var distanceX = contentContainer._measuredWidth - self._measuredWidth,
distanceY = contentContainer._measuredHeight - self._measuredHeight,
currentPositionX = -self._currentTranslationX,
currentPositionY = -self._currentTranslationY;

// Start the scrollbar
self._startScrollBars({
x: currentPositionX / distanceX,
y: currentPositionY / distanceY
},
{
x: self._measuredWidth / contentContainer._measuredWidth,
y: self._measuredHeight / contentContainer._measuredHeight
});

// Set the scroll position
self._setTranslation(Math.min(0, Math.max(self._minTranslationX,-currentPositionX + e.wheelDeltaX)),
Math.min(0, Math.max(self._minTranslationY,-currentPositionY + e.wheelDeltaY)));
// Set the scroll position
self._setTranslation(Math.min(0, Math.max(self._minTranslationX,-currentPositionX + e.wheelDeltaX)),
Math.min(0, Math.max(self._minTranslationY,-currentPositionY + e.wheelDeltaY)));

// Create the scroll event and immediately update the position
self._updateScrollBars({
x: currentPositionX / distanceX,
y: currentPositionY / distanceY
});
clearTimeout(scrollbarTimeout);
scrollbarTimeout = setTimeout(function(){
self._endScrollBars();
},500);
// Create the scroll event and immediately update the position
self._updateScrollBars({
x: currentPositionX / distanceX,
y: currentPositionY / distanceY
});
clearTimeout(scrollbarTimeout);
scrollbarTimeout = setTimeout(function(){
self._endScrollBars();
},500);

self._handleMouseWheel && self._handleMouseWheel();
self._handleMouseWheel && self._handleMouseWheel();
}
}));
},

Expand Down Expand Up @@ -428,6 +434,10 @@ define(["Ti/_/browser", "Ti/_/declare", "Ti/UI/View", "Ti/_/lang", "Ti/_/dom", "
}
}
}, 10);
},

properties: {
scrollingEnabled: true
}
});
});

0 comments on commit 82b62cd

Please sign in to comment.