A module providing swipe gesture services and directives.

  • bind - method

An adaptation of ngTouch.$swipe, it is basically the same despite of:

  • It is based on $touch
  • Swipes are recognized by touch velocity and direction
  • It does not require ngTouch thus is better compatible with fastclick.js
  • Swipe directives are nestable
  • It allows to unbind
  • It has only one difference in interface, and its about how to pass pointerTypes:

      // ngTouch.$swipe
      $swipe.bind(..., ['mouse', ... });
    
      // mobile-angular-ui.gestures.swipe.$swipe
      $swipe.bind(..., pointerTypes: { mouse: { start: 'mousedown', ...} });
    

    This is due to the fact that the second parameter of $swipe.bind is destinated to options for underlying $touch service.

bind
method in $swipe

$swipe.bind(element, eventHandlers, [options]) ⟶ function

Bind swipe gesture handlers for an element.

var unbind = $swipe.bind(elem, {
  end: function(touch) {
    console.log('Swiped:', touch.direction);
    unbind();
  }
});

Swipes Detection

Before consider a touch to be a swipe Mobile Angular UI verifies that:

  1. Movement is quick. Average touch velocity should exceed a VELOCITY_THRESHOLD.
  2. Movement is linear.
  3. Movement has a clear, non-ambiguous direction. So we can assume without error that underlying touch.direction is exactly the swipe direction. For that movement is checked against an ANGLE_THRESHOLD.
ParamTypeDescription
elementElement | $element

The element to observe for swipe gestures.

eventHandlersobject

An object with handlers for specific swipe events.

[eventHandlers.start]function

The callback for swipe start event.

[eventHandlers.end]function

The callback for swipe end event.

[eventHandlers.move]function

The callback for swipe move event.

[eventHandlers.cancel]function

The callback for swipe cancel event.

[options]object

Options to be passed to underlying $touch.bind function.

    Specify custom behavior when an element is swiped to the left on a touchscreen device. A leftward swipe is a quick, right-to-left slide of the finger.

    ParamTypeDescription
    uiSwipeLeftexpression

    An expression to be evaluated on leftward swipe.

      Specify custom behavior when an element is swiped to the right on a touchscreen device. A rightward swipe is a quick, left-to-right slide of the finger.

      ParamTypeDescription
      uiSwipeRightexpression

      An expression to be evaluated on rightward swipe.

        Alias for uiSwipeLeft.

          Alias for uiSwipeRight.


          comments powered by Disqus