Make <Progress /> in React Native

Where ActivityIndicatorIOS falls short for your UX, there come custom Components.

Here are two alternatives for your <ProgressBar /> Component.

react-native-progress

A simple progress bar component

<ProgressBar
    completePercentage={30}
    color={"#4FB948}
    borderColor={"#007696"} />

Progress Bar


react-native-progress-bar

An animated progress bar for React Native

<ProgressBar
  fillStyle={{}}
  backgroundStyle={{ backgroundColor: "#cccccc", borderRadius: 2 }}
  style={{ marginTop: 10, width: 300 }}
  progress={this.state.progress}
/>

Progress Bar