Skip to main content
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