React Native Animated List

High order component to animate and provide animation interfacing for react native ListView. Includes animation presets and is highly customizable.

Example

Demo is under examples folder

To build and run a example app:

git clone https://github.com/franciscofsales/react-native-animated-list

cd react-native-animated-list/examples/simple

npm install

To run on iOS:

react-native run-ios

To run on Android:

react-native run-android

Installation

Using npm:

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

Usage

import React, { Component } from 'react';

import AnimatedList from 'react-native-animated-list';

render() {
  return (
    <AnimatedList
        animation="scale"
        items={Data}
        duration={300}
        renderRow={this._renderRow}  
        onRemove={(item) => this._removeItem(item)}
    />
  );
}

Props

Prop	Type	Description
`animation`	`string<opacity\|scale\|slideLeft\|slideRight>`	Animation preset.
`duration`	`number`	Length of animation in milliseconds. Default 300.
`animationFunc`	`() => Animated animation object`	Function to define a custom animation.
`renderRow`	`() => ReactElement<any>`	Function to render a row.
`onRemove`	`() => ReactElement<any>`	Function to delete a row.