Results 1 to 3 of 3

Thread: Carousel listen for and intercept swipe event?

  1. #1
    Sencha User
    Join Date
    Jul 2012
    Location
    New Jersey
    Posts
    116
    Answers
    6
    Vote Rating
    5
      0  

    Default Answered: Carousel listen for and intercept swipe event?

    In certain cases, I want to prevent a user from swiping my carousel in a certain direction . Is there a way to listen for swipe events on the carousel and intercept and prevent the default behavior?

  2. You can override the carousel class

    The "swipe" is given by the drag start event:

    Code:
     onDragStart: function(e) {
            var direction = this.getDirection(),
                absDeltaX = e.absDeltaX,
                absDeltaY = e.absDeltaY,
                directionLock = this.getDirectionLock();
    
            this.isDragging = true;
    
            if (directionLock) {
                if ((direction === 'horizontal' && absDeltaX > absDeltaY)
                    || (direction === 'vertical' && absDeltaY > absDeltaX)) {
                    e.stopPropagation();
                }
                else {
                    this.isDragging = false;
                    return;
                }
            }
    
            if (this.isAnimating) {
                this.getActiveCarouselItem().getTranslatable().stopAnimation();
            }
    
            this.dragStartOffset = this.offset;
            this.dragDirection = 0;
        },

    Check source here and implement your logic in a subclass
    http://docs.sencha.com/touch/2-0/sou...ousel-Carousel

  3. #2
    Sencha User bluehipy's Avatar
    Join Date
    Mar 2010
    Location
    Romania
    Posts
    623
    Answers
    67
    Vote Rating
    29
      0  

    Default

    You can override the carousel class

    The "swipe" is given by the drag start event:

    Code:
     onDragStart: function(e) {
            var direction = this.getDirection(),
                absDeltaX = e.absDeltaX,
                absDeltaY = e.absDeltaY,
                directionLock = this.getDirectionLock();
    
            this.isDragging = true;
    
            if (directionLock) {
                if ((direction === 'horizontal' && absDeltaX > absDeltaY)
                    || (direction === 'vertical' && absDeltaY > absDeltaX)) {
                    e.stopPropagation();
                }
                else {
                    this.isDragging = false;
                    return;
                }
            }
    
            if (this.isAnimating) {
                this.getActiveCarouselItem().getTranslatable().stopAnimation();
            }
    
            this.dragStartOffset = this.offset;
            this.dragDirection = 0;
        },

    Check source here and implement your logic in a subclass
    http://docs.sencha.com/touch/2-0/sou...ousel-Carousel

  4. #3
    Sencha User
    Join Date
    Jul 2012
    Location
    New Jersey
    Posts
    116
    Answers
    6
    Vote Rating
    5
      0  

    Default

    Thanks exactly what I needed.

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •