Version: 0.60

ProgressBarAndroid

Android-only React component used to indicate that the app is loading or there is some activity in the app.

Example:

import React, { Component } from 'react';
import {
ProgressBarAndroid,
StyleSheet,
View
} from 'react-native';
export default class App extends Component {
render() {
return (
<View style={styles.container}>
<ProgressBarAndroid />
<ProgressBarAndroid styleAttr="Horizontal" />
<ProgressBarAndroid
styleAttr="Horizontal"
color="#2196F3"
/>
<ProgressBarAndroid
styleAttr="Horizontal"
indeterminate={false}
progress={0.5}
/>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'space-evenly',
padding: 10
}
});

Reference

Props

Inherits View Props.

animating

Whether to show the ProgressBar (true, the default) or hide it (false).

TypeRequired
boolNo

color

Color of the progress bar.

TypeRequired
colorNo

indeterminate

If the progress bar will show indeterminate progress. Note that this can only be false if styleAttr is Horizontal, and requires a progress value.

TypeRequired
indeterminateTypeNo

progress

The progress value (between 0 and 1).

TypeRequired
numberNo

styleAttr

Style of the ProgressBar. One of:

  • Horizontal
  • Normal (default)
  • Small
  • Large
  • Inverse
  • SmallInverse
  • LargeInverse
TypeRequired
enum('Horizontal', 'Normal', 'Small', 'Large', 'Inverse', 'SmallInverse', 'LargeInverse')No

testID

Used to locate this view in end-to-end tests.

TypeRequired
stringNo