diff --git a/README.md b/README.md index a04e7bb..f51cdf7 100644 --- a/README.md +++ b/README.md @@ -74,7 +74,8 @@ this.refs.circularProgress.performLinearAnimation(100, 8000); // Will fill the p You can configure the passing by following props: - **size** – width and height of the circle -- **width** - thickness of the line +- **width** - thickness of the lines +- **backgroundWidth** - thickness of the background line - **fill** - current, percentage fill (from 0 to 100) - **prefill** - percentage fill before the animation (from 0 to 100) - **tintColor** - color of a progress line diff --git a/src/CircularProgress.js b/src/CircularProgress.js index c1d2165..5e3e870 100644 --- a/src/CircularProgress.js +++ b/src/CircularProgress.js @@ -26,7 +26,7 @@ export default class CircularProgress extends React.Component { } render() { - const { size, width, tintColor, backgroundColor, style, rotation, linecap, children } = this.props; + const { size, width, backgroundWidth, tintColor, backgroundColor, style, rotation, linecap, children } = this.props; const backgroundPath = this.circlePath(size / 2, size / 2, size / 2 - width / 2, 0, 360 * .9999); const fill = this.extractFill(this.props.fill); @@ -40,7 +40,7 @@ export default class CircularProgress extends React.Component { + strokeWidth={backgroundWidth != null ? backgroundWidth : width}/>