Titanium JIRA Archive
Titanium SDK/CLI (TIMOB)

[TIMOB-7893] iOS: UI.ScrollView - canCancelEvents property does not work

GitHub Issuen/a
TypeBug
PriorityHigh
StatusClosed
ResolutionFixed
Resolution Date2012-06-13T15:49:15.000+0000
Affected Version/sRelease 1.8.2
Fix Version/sRelease 2.1.0, Sprint 2012-12 Core
ComponentsiOS
Labelscore, module_scrollview, qe-testadded
ReporterPaul Dowsett
AssigneeStephen Tramer
Created2012-03-06T08:13:35.000+0000
Updated2012-08-03T15:06:40.000+0000

Description

Problem

According to stramer in [this comment](https://github.com/appcelerator/titanium_mobile/pull/1515/files#r492538), the [Titanium.UI.ScrollView](http://developer.appcelerator.com/apidoc/mobile/latest/Titanium.UI.ScrollView-object) [canCancelEvents](http://developer.appcelerator.com/apidoc/mobile/latest/Titanium.UI.ScrollView.canCancelEvents-property.html) property does not work due to an invalid setter. Once fixed, add the following back to the documentation:
  - name: canCancelEvents
    summary: |
        Determines whether this scroll view can cancel subview touches in order to scroll instead.
    description: Set to false to ensure that subview touches always take effect.
    type: Boolean
    default: true
    platforms: [iphone, ipad]

Comments

  1. Allen Yeung 2012-06-05

    Test case:
       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) {
           	// Ti.API.info('Event Fired On: ' + eventName);
               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;
               }
           }
       }
       
    1. Launch app 2. Drag one of the boxes up and down, then left and right. Expected behavior: The view should not scroll up and down, and you should be able to drag the box left/right. Actual behavior: The view will scroll up/down when you try to drag the box vertically. Afterwards you can no longer drag it left and right.
  2. Allen Yeung 2012-06-05

    PR: https://github.com/appcelerator/titanium_mobile/pull/2325
  3. Michael Pettiford 2012-06-11

    Re-opening issue Tested with Ti Studio build 2.1.0.201206081630 Ti Mobile SDK 2.1.0.v20120608174150 hash r08baf035 OSX Lion 10.7.3 iPhone 4S OS 5.0.1 When I scroll the box horizontally, erratic behavior is shown (e.g. the box starts moving left and right and I can still scroll vertically)
  4. Allen Yeung 2012-06-12

    The erratic behavior is probably a bug with the test case. We are really testing whether we get the cancel event or not. With "canCancelEvents" enabled, we should get the cancel event when you select a label, and move down. With "canCancelEvents" disabled, we should not get the cancel event when you select a label, and move down. Could you retest and make sure this passes?
  5. Stephen Tramer 2012-06-13

    The test provided by Allen works correctly. Note that while the label is being dragged ('touchmove' event) the scroll view will NOT scroll. However, as soon as the label reaches the edge of the content view and cannot be moved further, the 'touchend' event is fired (meaning the label is no longer being tracked) and this is when the scroll view can scroll.
  6. Mukesh Gadiya 2012-06-23

    Verified the following: when canCancelEvents is set to FALSE 1. Scroll horizontally within the label(subview) and scrollview does not scroll 2. Scroll vertically within the label and scrollview DOES NOT scroll when canCancelEvents is set to TRUE 1. Scroll horizontally within the label(subview) and scrollview does not scroll 2. Scroll vertically within the label and scrollview DOES scroll vertically Iphone 4S verizon 5.0.1 SDK: 2.1.0.v20120622174154 OS: Lion 10.7.3

JSON Source