Version 3.17.2

APIs

  • Begin typing in the search box above to see results.
Show:

Plugin.Flick Class

A plugin class which can be used to animate the motion of a node, in response to a flick gesture.

Methods

_anim

(
  • x
  • y
  • duration
  • easing
)
private

Internal utility method to perform the transition step

Parameters:

  • x Number

    The X offset position

  • y Number

    The Y offset position

  • duration Number

    The duration to use for the transition animation

  • easing String

    The easing to use for the transition animation.

_bounce

(
  • x
  • max
)
private

Internal utility method to constrain the offset value based on the bounce criteria.

Parameters:

  • x Number

    The offset value to constrain.

  • max Number

    The max offset value.

_flickFrame

() protected

Executes a single frame in the flick animation

_killTimer

() private

Stop the animation timer

_move

(
  • x
  • y
  • duration
  • easing
)
private

Internal utility method to move the node to a given XY position, using transitions, if specified.

Parameters:

  • x Number

    The X offset position

  • y Number

    The Y offset position

  • duration Number

    The duration to use for the transition animation

  • easing String

    The easing to use for the transition animation.

_onFlick

(
  • e
)
protected

The flick event listener. Kicks off the flick animation.

Parameters:

  • e EventFacade

    The flick event facade, containing e.flick.distance, e.flick.velocity etc.

_renderClasses

() protected

Adds the CSS classes, necessary to set up overflow/position properties on the node and boundingBox.

_setX

(
  • val
)
private

Internal utility method to set the X offset position

Parameters:

_setY

(
  • val
)
private

Internal utility method to set the Y offset position

Parameters:

initializer

(
  • config
)

The initializer lifecycle implementation.

Parameters:

  • config Object

    The user configuration for the plugin

setBounds

()

Sets the min/max boundaries for the flick animation, based on the boundingBox dimensions.

Properties

CLASS_NAMES

Object static

The default CSS class names used by the plugin

EASING

String static

The default easing to use for the main flick movement transition

Default: 'cubic-bezier(0, 0.1, 0, 1.0)'

NAME

String static

The NAME of the Flick class. Used to prefix events generated by the plugin.

Default: "pluginFlick"

NS

String static

The namespace for the plugin. This will be the property on the node, which will reference the plugin instance, when it's plugged in.

Default: "flick"

SNAP_DURATION

Number static

The duration to use for the bounce snap-back transition

Default: 400

SNAP_EASING

String static

The default easing to use for the bounce snap-back transition

Default: 'ease-out'

VELOCITY_THRESHOLD

Number static

The threshold used to determine when the decelerated velocity of the node is practically 0.

Default: 0.015

Attributes

bounce

Number

Drag coefficient for intertial scrolling at the upper and lower boundaries of the scrollview. Set to 0 to disable "rubber-banding".

Default: 0.7

Fires event bounceChange

Fires when the value for the configuration attribute bounce is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.

Parameters:

  • e EventFacade
    An Event Facade object with the following attribute-specific properties added:
    • prevVal Any
      The value of the attribute, prior to it being set.
    • newVal Any
      The value the attribute is to be set to.
    • attrName String
      The name of the attribute being set.
    • subAttrName String
      If setting a property within the attribute's value, the name of the sub-attribute property being set.

bounceDistance

Number

The bounce distance in pixels

Default: 150

Fires event bounceDistanceChange

Fires when the value for the configuration attribute bounceDistance is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.

Parameters:

  • e EventFacade
    An Event Facade object with the following attribute-specific properties added:
    • prevVal Any
      The value of the attribute, prior to it being set.
    • newVal Any
      The value the attribute is to be set to.
    • attrName String
      The name of the attribute being set.
    • subAttrName String
      If setting a property within the attribute's value, the name of the sub-attribute property being set.

boundingBox

Node

The constraining box relative to which the flick animation and bounds should be calculated.

Default: parentNode

Fires event boundingBoxChange

Fires when the value for the configuration attribute boundingBox is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.

Parameters:

  • e EventFacade
    An Event Facade object with the following attribute-specific properties added:
    • prevVal Any
      The value of the attribute, prior to it being set.
    • newVal Any
      The value the attribute is to be set to.
    • attrName String
      The name of the attribute being set.
    • subAttrName String
      If setting a property within the attribute's value, the name of the sub-attribute property being set.

deceleration

Drag coefficent for inertial scrolling. The closer to 1 this value is, the less friction during scrolling.

Default: 0.98

Fires event decelerationChange

Fires when the value for the configuration attribute deceleration is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.

Parameters:

  • e EventFacade
    An Event Facade object with the following attribute-specific properties added:
    • prevVal Any
      The value of the attribute, prior to it being set.
    • newVal Any
      The value the attribute is to be set to.
    • attrName String
      The name of the attribute being set.
    • subAttrName String
      If setting a property within the attribute's value, the name of the sub-attribute property being set.

duration

Number

The custom duration to apply to the flick animation. By default, the animation duration is controlled by the deceleration factor.

Default: null

Fires event durationChange

Fires when the value for the configuration attribute duration is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.

Parameters:

  • e EventFacade
    An Event Facade object with the following attribute-specific properties added:
    • prevVal Any
      The value of the attribute, prior to it being set.
    • newVal Any
      The value the attribute is to be set to.
    • attrName String
      The name of the attribute being set.
    • subAttrName String
      If setting a property within the attribute's value, the name of the sub-attribute property being set.

easing

String

The custom transition easing to use for the flick animation. If not provided defaults to internally to Flick.EASING, or Flick.SNAP_EASING based on whether or not we're animating the flick or bounce step.

Default: null

Fires event easingChange

Fires when the value for the configuration attribute easing is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.

Parameters:

  • e EventFacade
    An Event Facade object with the following attribute-specific properties added:
    • prevVal Any
      The value of the attribute, prior to it being set.
    • newVal Any
      The value the attribute is to be set to.
    • attrName String
      The name of the attribute being set.
    • subAttrName String
      If setting a property within the attribute's value, the name of the sub-attribute property being set.

minVelocity

Number

The minimum flick gesture velocity (px/ms) at which to trigger the flick response

Default: 0

Fires event minVelocityChange

Fires when the value for the configuration attribute minVelocity is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.

Parameters:

  • e EventFacade
    An Event Facade object with the following attribute-specific properties added:
    • prevVal Any
      The value of the attribute, prior to it being set.
    • newVal Any
      The value the attribute is to be set to.
    • attrName String
      The name of the attribute being set.
    • subAttrName String
      If setting a property within the attribute's value, the name of the sub-attribute property being set.

minVelocity

Number

The minimum flick gesture distance (px) for which to trigger the flick response

Default: 10

Fires event minVelocityChange

Fires when the value for the configuration attribute minVelocity is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.

Parameters:

  • e EventFacade
    An Event Facade object with the following attribute-specific properties added:
    • prevVal Any
      The value of the attribute, prior to it being set.
    • newVal Any
      The value the attribute is to be set to.
    • attrName String
      The name of the attribute being set.
    • subAttrName String
      If setting a property within the attribute's value, the name of the sub-attribute property being set.

step

Number

Time between flick animation frames.

Default: 10

Fires event stepChange

Fires when the value for the configuration attribute step is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.

Parameters:

  • e EventFacade
    An Event Facade object with the following attribute-specific properties added:
    • prevVal Any
      The value of the attribute, prior to it being set.
    • newVal Any
      The value the attribute is to be set to.
    • attrName String
      The name of the attribute being set.
    • subAttrName String
      If setting a property within the attribute's value, the name of the sub-attribute property being set.

AltStyle によって変換されたページ (->オリジナル) /