react-native-rounded-progress-bar

RoundedProgressBar

RoundedProgressBar is a native progress bar made in Kotlin and Swift which is renderized natively for Android and iOS devices.

Features

• Custom colors for background and foreground
• Custom size for background and foreground
• Set a different radius
• Light, there is no dependencies there

Installation

• $ yarn add react-native-rounded-progress-bar
• cd ios/ && pod install

Usage

import RoundedProgressBar from "react-native-rounded-progress-bar";
 
<RoundedProgressBar
  percent={0.75}
  borderWidth={4}
  size={40}
  color="#F02D00"
  bgColor="#DF8BD1"
  backgroundWidth={30}
  progressWidth={30}
  radius={100}
>
  <Text>Loading...</Text>
</RoundedProgressBar>;

Props

Name	Description
percentage	Decimal value used for displaying the progress, for example, 0.5 or 0.25
radius	Size of the radius of the circle
progressWidth	The width of the progress bar
backgroundWidth	The width of the background of the progress bar
progressBarColor	The color of the progress bar
backgroundBarColor	The background color of the border
backgroundColor	The inner background color of the component

Author

Domestika

License

MIT

Keywords

react native progress progressbar circle indicator

Happy hacking!