react-native-timekeeper

Timekeeper is the most complete and lightweight component for React-Native that allows you to create your own animated timer.

Features!

• Custom colors
• Custom borders and size
• Light-weight: No other dependencies besides react-native
• Enable/disable scale bounce animation (also specifies the size of the scales)
• Progressive or regressive counting
• Enable/disable pausable timer
• Apply your own callbacks on pausing, on resuming, or time elapsed

Installation

$ yarn add react-native-timekeeper

or

$ npm install react-native-timekeeper --save

Usage

importTimerfrom'react-native-timekeeper';render(){return(<Timerbeat={true}seconds={120}radius={100}borderWidth={6}color="#C52957"bgColor="#DE537C"bgColorSecondary="#E495AC"bgColorThirt="#EFD6DE"shadowColor="#DE537C"textStyle={{fontSize: 52,color: '#FFF',}}subTextStyle={{fontSize: 20,color: '#FFF',}}onTimeElapsed={()=>{console.log('Time elapsed')}}isPausable={true}onPause={()=>console.log('Pause')}onResume={()=>console.log('Resume')}minScale={0.9}maxScale={1.2}/>);}

Props

Name	Description	Type	Required	Default Value
beat	-----------	-----------	-----------	-----------
seconds	-----------	-----------	-----------	-----------
radius	-----------	-----------	-----------	-----------
borderWidth	-----------	-----------	-----------	-----------
color	-----------	-----------	-----------	-----------
bgColor	-----------	-----------	-----------	-----------
bgColorSecondary	-----------	-----------	-----------	-----------
bgColorThirt	-----------	-----------	-----------	-----------
shadowColor	-----------	-----------	-----------	-----------
textStyle	-----------	-----------	-----------	-----------
subTextStyle	-----------	-----------	-----------	-----------
onTimeElapsed	-----------	-----------	-----------	-----------
isPausable	-----------	-----------	-----------	-----------
onPause	-----------	-----------	-----------	-----------
onResume	-----------	-----------	-----------	-----------
minScale	-----------	-----------	-----------	-----------
maxScale	-----------	-----------	-----------	-----------

Author

Yamil Diaz Aguirre

Want to contribute? Great!