Skip to content

Files

Latest commit

9db425a · Jul 24, 2016

History

History
50 lines (37 loc) · 1.74 KB

README.md

File metadata and controls

50 lines (37 loc) · 1.74 KB

Hammer Native

Hammer.JS for React Native. HammerJS is a javascript library for multi-touch gestures.

Build Status npm hammer.js

Installation

npm install --save react-native-hammerjs

Usage

import { Hammer, injectHammer } from 'react-native-hammerjs';

class YourComponent extends React.Component {
  componentDidMount() {
    const mc = this.props.hammer;
    mc.add( new Hammer.Pan({ direction: Hammer.DIRECTION_ALL, threshold: 0 }) );

    mc.on('pan', e => {
      console.log('pan', e);
    });
  }

  render() {
    const connectEventHandlers = this.props.connectEventHandlers;
    return connectEventHandlers(
      <View>
        <Content />
      </View>
    );
  }
}

export default injectHammer(YourComponent);

For more examples, check out examples folder

This module exposes:

  1. Hammer: Hammer class as in HammerJS
  2. injectHammer: A function that creates a Higher Order Component that wraps YourComponent and injects 2 props:
  • hammer: a Hammer.Manager object.
  • connectEventHandlers: a function connects native gesture responders with Hammer.Manager object.

Contributing

PRs are welcome!