/ Animation

A feature rich declarative component for animation

A feature rich declarative component for animation

The React Native Animated Sprite

react-native-animated-sprite (RNAS) package is a feature rich declarative component for animation, tweening, and dragging sprites. Animation is achieved using frame-by-frame animation, tweening uses the React Native Animated class, and dragging uses React Native PanResponder.

RNAS is ideal for use in general applications or games. Development has been driven by Curious Learning's work in cognitive assessment and literacy.


$ npm install --save react-native-animated-sprite


There are three key features to RNAS: AnimatedSprite, sprites, and tweens. Together these three features provide the full capabilities of RNAS.


AnimatedSprite is the primary component interface which would be included in a React Native application.


Sprites are objects that are required by AnimatedSprite. A sprite object contains references to the images used for frame-by-frame animation and other related information. See "example/sprites/monster/monsterSprite.js"


Tweens ("src/Tweens/Tweens.js") operate on AnimatedSprites to enable tweening.