pixi-gesture-hooks

A library that provides hooks that add various gestures to pixi.js display objects, as well as providing utility functions to build your own.

NOTE: Not recommended for production environments at this time. Watch this space for v1.0.0.

Install

npm install pixi-gesture-hooks

Usage

Add click-and-drag functionality to a DisplayObject (with touch support!)

const area = { width: 100, height: 100 };
const movableArea = new Graphics()
  .beginFill("black")
  .drawRect(0, 0, area.width, area.height);

const lowBound = new Point(app.view.width - area.width, app.view.height - area.height);
const highBound = new Point(0, 0)
useDrag(movableArea, { 
  // makes it so objects will smoothly slide to a stop instead of stopping immediately!
  enableAcceleration: true, 
  // constrains the area that the object can be dragged around in
  bounds: [lowBound, highBound]
});

Make a DisplayObject zoomable (with pinch support!)

const area = { width: 100, height: 100 };
const movableArea = new Graphics()
  .beginFill("black")
  .drawRect(0, 0, area.width, area.height);

useZoom(movableArea, { minScale: 0.01, maxScale: 2, scaleFactor: 0.001, enablePinch: true });

Docs

Full Documentation

⚔ A Falchion Studios Project ⚔