Feature
iOS supports a "canCancelEvents" property on scroll views to let you control if events are cancelled when a scroll view scrolls.
Expected Behavior
It should behave as iOS does. When "canCancelEvents" is false, touchCancel shouldn't fire when scrolling the scroll view. But if "canCancelEvents" is true, then use the existing behavior of canceling a touch after moving enough in a scrollable direction.
... Note that canCancelEvents is presently broken on iOS: [TIMOB-7893].
Reproduction
Drop the following in an app.js. It adds a vertically scrollable list of draggable rectangles. On iOS, once [TIMOB-7893] gets fixed, you can drag them horizontally. You can also scroll vertically without interrupting the drag. On Android, any vertical movement cancels the scroll.
var win = Ti.UI.createWindow({
backgroundColor: '#fff'
});
var status = Ti.UI.createLabel({
text: ' ', textAlign: 'center',
zIndex: 1,
right: 0, bottom: 0, left: 0,
height: 60,
backgroundColor: 'black',
color: 'white'
});
win.add(status);
var scroll = Ti.UI.createScrollView({
scrollType: 'vertical',
contentHeight: 3010,
canCancelEvents: false,
bottom: 60
});
var width = 150, height = 90;
for (var i = 0; i < 30; i++) {
scroll.add(Ti.UI.createLabel({
draggable: true,
text: 'Drag Me Horizontally ' + (i + 1), textAlign: 'center',
color: '#000',
top: i * 100 + 10,
width: width, height: height,
backgroundColor: '#eee'
}));
}
scroll.addEventListener('touchstart', curry('Touch Start'));
scroll.addEventListener('touchmove', curry('Touch Move'));
scroll.addEventListener('touchcancel', curry('Touch Cancel'));
scroll.addEventListener('touchend', curry('Touch End'));
win.add(scroll);
win.open();
function curry(eventName) {
return function (evt) {
if (evt.source && evt.source.draggable) {
status.text = eventName + ' at { x: ' + (evt.x | 0) + ', y: ' + (evt.y | 0) + ' }';
var global = evt.source.convertPointToView({ x: evt.x, y: evt.y }, scroll);
evt.source.left = global.x - width / 2;
}
}
}
PR ready: https://github.com/appcelerator/titanium_mobile/pull/2334
Closing issue Tested with Ti Studio build 2.1.0.201206081630 Ti Mobile SDK 2.1.0.v20120608174150 hash r08baf035 OSX Lion 10.7.3 Nexus S OS 4.0.4 When scrolling the rectangles the larger scroll view doesn't scroll