# @codinggist/rn-progress

> Progress indicator components for React Native

Latest version **0.0.5** (published 2022-02-03) · MIT license · 0 weekly downloads

## Install

```sh
npm install @codinggist/rn-progress
pnpm add @codinggist/rn-progress
yarn add @codinggist/rn-progress
bun add @codinggist/rn-progress
```

## Health

**Score 30/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities; high quality score.

Warnings: low downloads; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.5 |
| Published | 2022-02-03 |
| First published | 2021-08-12 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 0 |
| Unpacked size | 23.7 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Muhammad Afaq Riaz |
| Maintainers | mafaqriaz, afaq-rns |
| Keywords | react-native, ios, android |

## Links

- npm: https://www.npmjs.com/package/@codinggist/rn-progress
- Repository: https://github.com/codinggist/rn-progress
- Homepage: https://github.com/codinggist/rn-progress.git#readme
- Issues: https://github.com/codinggist/rn-progress.git/issues
- npm.io page: https://npm.io/package/@codinggist/rn-progress

## Alternatives

- [@sindresorhus/slugify](https://npm.io/package/@sindresorhus/slugify.md) — 3.7M weekly downloads
- [solid-js](https://npm.io/package/solid-js.md) — 2.7M weekly downloads
- [expo-glass-effect](https://npm.io/package/expo-glass-effect.md) — 2.5M weekly downloads
- [nanoassert](https://npm.io/package/nanoassert.md) — 780.8K weekly downloads
- [@ffmpeg/ffmpeg](https://npm.io/package/@ffmpeg/ffmpeg.md) — 529.5K weekly downloads

## Recent versions

- 0.0.5 (latest) — 2022-02-03
- 0.0.4 — 2022-02-03
- 0.0.3 — 2021-08-14
- 0.0.2 — 2021-08-14
- 0.0.1 — 2021-08-12

## README

# rn-progress

A progress indicator component for React Native (both Android and iOS)

## Installation

Install component by running following command

```sh
npm i @codinggist/rn-progress
or
yarn add @codinggist/rn-progress
```

This componnet is based on React Native basic components. So, linking is not required.

## Usage

```js
import { ProgressBar } from "rn-progress";

// ...

<ProgressBar width={'80%'} height={'20'} />
```

## Props

Following are props to use this component

| Prop | Type | Description |
| ------ | ------ | ------ |
| width | number \| string | Width of ProgressBar in numbers or percentage |
| height | number \| string | Height of ProgressBar in numbers or percentage |
| strokeWidth | number | Width of outer border or stroke |
| strokeColor | string | Stroke color |
| color | string | Color of Progressbar |
| startValue | number | Starting value of progress |
| maxValue | number | Maximum value of progress |
| currentValue | number | Current value of progress (can be set using states). If current value is less than start value, it will be neglected and start value will be used as current value. |
| backgroundColor | string | Background color for bar |

## Contributing

See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow.

## License

MIT

---
**Note:**
This package is under development. Contributors are welcome to work on this package.

---
_Source: https://npm.io/package/@codinggist/rn-progress · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._