# progress-bar-rn

> A simple progress bar component created for React-Native

Latest version **1.0.1** (published 2022-03-19) · MIT license · 0 weekly downloads

## Install

```sh
npm install progress-bar-rn
pnpm add progress-bar-rn
yarn add progress-bar-rn
bun add progress-bar-rn
```

## Health

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

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.1 |
| Published | 2022-03-19 |
| First published | 2022-03-19 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 6 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 1 |
| Author | Wenhao Li |
| Maintainers | hysasuke |
| Keywords | progress-bar, progress, bar |

## Links

- npm: https://www.npmjs.com/package/progress-bar-rn
- Repository: https://github.com/hysasuke/ProgressBar
- Homepage: https://github.com/hysasuke/ProgressBar#readme
- Issues: https://github.com/hysasuke/ProgressBar/issues
- npm.io page: https://npm.io/package/progress-bar-rn

## Alternatives

- [@sentry/react-native](https://npm.io/package/@sentry/react-native.md) — 2.6M weekly downloads
- [@ardatan/aggregate-error](https://npm.io/package/@ardatan/aggregate-error.md) — 708.1K weekly downloads
- [custom-error-generator](https://npm.io/package/custom-error-generator.md) — 2.0K weekly downloads
- [@technik-sde/prosemirror-recreate-transform](https://npm.io/package/@technik-sde/prosemirror-recreate-transform.md) — 1.5K weekly downloads
- [@suchipi/error-utils](https://npm.io/package/@suchipi/error-utils.md) — 78 weekly downloads

## Recent versions

- 1.0.1 (latest) — 2022-03-19
- 1.0.0 — 2022-03-19

## README

# progress-bar-rn

---

A light and simple progress bar component created for React Native

## Installation

---

```
npm install progress-bar-rn
```

## Usage

---

```
import ProgressBar from "progress-bar-rn";

<ProgressBar
        containerShadowStyle={{ ... }}
        trackColor={"#00A0E9"}
        trackStyle={{
          borderTopLeftRadius: 10,
          borderBottomLeftRadius: 10,
          borderTopRightRadius: 10,
          borderBottomRightRadius: 10,
        }}
        type={'timing'} // optional
        animationStarted={state.alarmStatus === 'pending'} // only useful when type is timing
        duration={60 * 1000} // only useful when type is timing
        initialValue={currentProgress}// only useful when type is timing
        progress={50}
        style={{
          borderRadius: 10,
          backgroundColor: "black",
          marginHorizontal: 15,
          paddingVertical: 20,
          marginBottom: 20,
        }}
      >
        /* children components */
</ProgressBar>
```

## Props

---

| Prop                   | Description                                                                                                 | Default |
|:---------------------- |:-----------------------------------------------------------------------------------------------------------:|:-------:|
| `containerShadowStyle` | Set shadow of container                                                                                     | none    |
| `trackColor`           | Set color of track                                                                                          | none    |
| `trackStyle`           | Set style of track                                                                                          | none    |
| `progress`             | Set current progress percentage, e.g. 50                                                                    | 0       |
| `style`                | Set style of container                                                                                      | none    |
| `type`                 | *optional*: `timing`  When type is set to timing, then the increment of the progress bar will be continuous | none    |
| `initialValue`         | *optional*  Used to set where the continuous increment starts                                               | 0       |
| `duration`             | *optional*  Used to set the duration (in ms) of the continuous increment from 0 to 100                      | 500     |
| `animationStarted`     | Set whether or not the continuous increment is started                                                      | false   |

###

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