react-native-popup-progress-bar

Android progress dialog, modal progress, or popup progress bar for React Native.

Based on Android ProgressDialog.

Getting started

$ yarn add react-native-popup-progress-bar

Or

$ npm i react-native-popup-progress-bar

In react-native v0.60+ no need to run command $ react-native link react-native-popup-progress-bar

Usage

import PopupProgressBar from 'react-native-popup-progress-bar';

/**
 * Default options
 */
const options = {
  theme: 'defaultDeviceLight',
  isSpinner: true,
  isIndeterminate: false,
  maxProgress: 100,
  isCancelable: true,
  onDismiss: () {}
};

PopupProgressBar.show(options);

Options (optional)

• theme - A native theme from Android ProgressDialog. | Type | Required | Value | | --- | --- | --- | | string | No, default: "holoLight" | "classic", "holoDark", "holoLight", "defaultDeviceDark", "defaultDeviceLight" |

• title - Title of Progress Dialog. | Type | Required | | --- | --- | | string | No, default: undefined |

• message - Message of Progress Dialog. | Type | Required | | --- | --- | | string | No, default: undefined |

• isSpinner - Set the progress bar style in spinner style or horizontal style. | Type | Required | | --- | --- | | boolean | No, default: true |

• isIndeterminate - Enable/Disable the indeterminate mode for the progress. In indeterminate mode, the progress is ignored and the dialog shows an infinite animation instead. NOTE: This property only effected if isSpinner is false. | Type | Required | | --- | --- | | boolean | No, default: false |

• maxProgress - Sets the maximum allowed progress value. NOTE: This property only effected if isSpinner is false. | Type | Required | | --- | --- | | number | No, default: 100 |

• isCancelable - Whether the dialog should be canceled when touched outside of the view progress. | Type | Required | | --- | --- | | boolean | No, default: true |

Methods

• .show(options) - Show the dialog.

• .setProgress(number) - Set percentage of the current progress bar, a value between 0 and maxProgress. NOTE: Only effected if isSpinner is false AND isIndeterminate is false

• .setTitle(string) - Set title of the progress. This is useful when you need displaying progress but only for the title.

• .setMessage(string) - Set message of the progress. This is useful when you need displaying progress but only for the message.

• .dismiss() - Hide/Dismiss the Progress Dialog.