Since the library is a JS-based solution, to install the latest version of react-native-globalspinner you only need to run:
npm install --save react-native-globalspinner
or
yarn add react-native-globalspinner
Basic Usage
The Spinner component it's build to a global use, so you have to instance this component once in your main app screen always as a last inserted component:
import React from "react";
import { View } from "react-native";
import Spinner, { showSpinner, hideSpinner } from "react-native-globalspinner";
export default class App extends React.Component {
render() {
return (
<View style={{ flex: 1 }}>
<View ref={"otherView1"} />
<View ref={"otherView2"} />
<View ref={"otherView3"} />
{/* GLOBAL SPINNER COMPONENT INSTANCE */}
<Spinner type='BallIndicator' color={"blue"} size={30} count={8}/>
{/* <--- here as last component */}
</View>
);
}
}
After that you only need to call showSpinner or hideSpinner methods from anywhere in your app.
If you don't need a global use for (e.g. will use only in one screen) you can instance your Spinner Component with a ref ID (or other capture ref method):
<View style={{ flex: 1 }}>
<YourMainApp />
{/* <--- here as last component always with `ref` */}
<Spinner type='BallIndicator' color={"blue"} size={30} count={8} ref="mySpinner" />
<View>