tinder-like loader for your react native app
JavaScript
Switch branches/tags
Nothing to show
Clone or download
Latest commit 6ad51be Aug 14, 2016
Permalink
Failed to load latest commit information.
Pulse.js initial commit Aug 14, 2016
PulseLoader.js initial commit Aug 14, 2016
README.md update readme Aug 14, 2016
package.json 1.0.2 Aug 14, 2016

README.md

Pulse Loader for React Native

tinder-like loader for your react native app

Installation

npm i react-native-pulse-loader --save

Example

import React from 'react';
import PulseLoader from 'react-native-pulse-loader';

class App extends React.Component {
  render() {
    return (
      <PulseLoader
        avatar={'https://scontent-fra3-1.cdninstagram.com/t51.2885-15/e35/11429705_386886401514376_550879228_n.jpg'}
      />
    );
  }
}

API

Property Type Default Description
interval number 2000 action buttons visible or not
size number 100 width and height of the avatar
pulseMaxSize number 250 maximum size of the pulse in the background
avatar string undefined required avatar url to display
pressInValue number 0.8 should be between 0 and 1. scale of the avatar, when pressed in
pressDuration number 150 duration of the scale animation
pressInEasing Easing Easing.in easing type of the press in animation
pressOutEasing Easing Easing.out easing type of the press out animation
borderColor string '#D8335B' border color of the pulse
backgroundColor string '#ED225B55' background color of the pulse
getStyle function undefined override the styling of the pulse. gets as parameter the Animated variable. e.g. (anim) => ({ backgroundColor: 'yellow' })