A simple react component made using canvas and window frame animations. Very close in resemblance to that of the Spinner in Android or the loading spinner on YouTube.
Installation:
npm install react-spinner-material
Here's a full list of currently supported propTypes for use in the component.
// the width of the canvas to draw on
width = this.props.width
// the height of the canvas to draw on
height = this.props.height
// the spinner stroke color
spinnerColor = this.props.spinnerColor
// the width of the line stroke
spinnerWidth = this.props.spinnerWidth
// whether to show the spinner or not
show = this.props.show
Here is the most simple example of using the react-spinner-material.
Please note, the spinner is not visible by default, you must set show={true} for it to show up!!
import Spinner from 'react-spinner-material';
import React, { Component } from 'react';
export default = class Example extends Component {
render() {
return (
<div>
<Spinner width={100}
height={120}
spinnerColor={"#333"}
spinnerWidth={2}
show={true} />
</div>
);
}
}