/react-native-animated-list

React Native HOC to animate the ListView

Primary LanguageJavaScriptMIT LicenseMIT

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
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.

Contributing

All contributions are very appreciated <3.

License

MIT